search

ampproject / wg-bento

Creative Commons Attribution 4.0 International
17 stars 14 forks source link

Discussion: Visual Styles on amp-accordion #43

Open krdwan opened 4 years ago

krdwan commented 4 years ago

As part of the port of amp-accordion to Bento, we are considering specifics of porting visual styles.

In 0.1 we have the following CSS styles applied to header sections in an amp-accordion:

background-color: #efefef; padding-right: 20px; border: solid 1px #dfdfdf;

This results in the accordion displayed visually as shown below (Notice the gray styled Section 1, 2, and 3)

image

For 1.0, we are considering how we would like to style the component. The options we are considering include:

  1. Remove the visual styling. Is it necessary for us to provide these default styles?
  2. Provide the styling on amp level only. Maintains a similar look and feel as 0.1 when in amp mode. In Preact mode, the user will not be tied to any pre-set default styling.
  3. Provide default styling on amp and preact.. Maintains similar look and feel as 0.1 in both amp and preact modes. Will require a bit of extra work to enable JSX for light-DOM in preact mode.
nainar commented 4 years ago

My vote is for option 3.

dvoytenko commented 4 years ago

Agree. Let's proceed with option 3.