Epic :: Components

[w0rd-driven]

• Artist :: Index
  • Mobile: List with separators at the top and bottom of the text only.
  • Desktop: List with separators covering the entire line.
  • Artist icon and Artist name
  • This is the closest between mobile and desktop.
• Artist :: Show
  • Mobile: 2-column Grid, of the same type as Album :: Index. Art component, title in bold, and year as full-width stack of image, text, and text. Large text is truncated with ....
  • Desktop: Flexbox list of albums. Art component to the left, title in bold, and genre (dot) year stacked.
• Artist :: Show :: Album
  • Mobile: There is no desktop equivalent so we won't cover this whatsoever.
• Album :: Index
  • Mobile: Identical 2-column grid to Artist :: Show. Art component, album in bold, and artist. Large text is truncated with ....
  • Desktop: Responsive grid that looks like Artist :: Show. Art component, album in bold, and artist. Text can encompass 2 rows before it's truncated with ... for both sections. I don't think I have examples of both album and artist taking up both rows.
• Album :: Show
  • Mobile: Art component, album in bold, artist link, genre (dot) year as a full-width centered stack.
  • Desktop: Art component on the left, album in bold, artist link, genre (dot) year as full-width left-aligned stack.
• Notifications should look identical on desktop and mobile. The text is usually long enough.

I feel this is a catalyst for everything and should be part of the public release milestone.

It isn't terrible practice to throw everything on screen and let the components bubble up. I can predict a lot of them up front but if we're using a for loop that's usually a good indicator of reuse.