Problem/Motivation
We would like all of the designs/styling used in Drupal core to use reusable components. Unfortunately, its not always obvious what these components should be named.
Proposed resolution
Do a survey of various style guides to see what others have named these components.
We are building a list of possible components in a Google drive spreadsheet: https://docs.google.com/spreadsheet/ccc?key=0AvR7gnIrX0ckdDgzNDI0blZVSnF...
Here's the list of style guides/resources that should be used for each component:
- Seven style guide: guide with screenshots, live HTML demo
- Styleguide and Boilerplate patterns
- Aria: Abstract roles, Widget roles
Remaining tasks
As components are identified and a survey is made of its naming, create an issue for each component and then try to come to consensus based on the survey data. Add that new issue to the issue summary of #1995272: [Meta] Refactor module CSS files inline with our CSS standards
Related Issues
List of identified components so far
- Menu tree #1912516: Markup for menus
- Breadcrumb
- Tabs #1999182: Dream mark up for tabs
- Action buttons
- Publishing status
- Item list
- More link #2031301: Replace theme_more_link() and replace with #type 'more_link'
- More help link
- Pagination #1912608: Update pagination markup for new CSS standards and improved accessibility
- Button links #1986074: Buttons style update
- Progress bar #1989480: Progress Bar style update
- Inline links
- Messages #1986408: Message style update
- Field label
- Multiple field UI
- Autocomplete
- Resizeable text area widget
- Table drag widget
- Sticky header
- Throbber
Comments
Comment #1
ry5n CreditAttribution: ry5n commentedBesides the Seven Style Guide and Anna Debenham’s Mother of All Styleguide Lists (see issue summary), there is also the ARIA roles spec, which may help with naming.
http://www.w3.org/WAI/PF/aria/roles#abstract_roles
http://www.w3.org/WAI/PF/aria/roles#widget_roles
Comment #1.0
ry5n CreditAttribution: ry5n commentedAdded links to the Seven Style Guide and to Anna Debenham’s Mother of All Style Guide Lists
Comment #2
JohnAlbinHere's the survey doc I'm fleshing out. https://docs.google.com/spreadsheet/ccc?key=0AvR7gnIrX0ckdDgzNDI0blZVSnF...
Comment #2.0
JohnAlbinFixed Anna Debenham link and added Cloud Four's spreadsheet.
Comment #3
JohnAlbinI've updated the issue summary with more concrete steps.
Comment #4
RainbowArrayI went through the six style guides besides Seven that were listed under menu_tree and filled out all the information that I could. There are more on the master spreadsheet, but this is maybe a good starting place?
Some of the style guides are of higher quality than others. Foundation and Bootstrap had the most number of components.
A lot of these are very class heavy. Some of that is inevitable. It just seems a bit wordy in some cases. AUI in particular prefixes near every class with aui- which seems unnecessary.
Anyhow, here's the updated spreadsheet.
https://docs.google.com/spreadsheet/ccc?key=0AvR7gnIrX0ckdDgzNDI0blZVSnF...
Comment #4.0
RainbowArrayAdd more formalized plan
Comment #5
LewisNyman CreditAttribution: LewisNyman commentedMoving into core
Comment #6
LewisNyman CreditAttribution: LewisNyman commentedThis survey spreadsheet is really useful, I think it would help to have an overview of all the components we've address in the spreadsheet in this issue summary, because it's hard to tell what we are missing.
Comment #7
LewisNyman CreditAttribution: LewisNyman commentedI've added the issues to each identified component that has already been fixed
Comment #8
LewisNyman CreditAttribution: LewisNyman commentedComment #9
idebr CreditAttribution: idebr commented