DocRequirementsCSS
Below is a list of things that we would like to see in the web site CSS to serve docs pages. This is not a comprehensive list, but rather a list of ideas about things that we need that we don't have (or which we have and are unaware of).
Here's the css guide & templates
- style for notes and tips
done - style for the feedback box that we put at the end of most of the tutorials so that it is right-aligned and has reasonable spacing in relation to the last section of the tutorials (e.g. the See Also or Next Steps sections)
- good spacing between the orange h2 headers and the elements above it
done - padding for screenshots, such as when they appear in ordered lists. also style for the captions that go with the image.
- good formatting for tables
done - Have to remember to put a
after an orange heading to get decent spacing. Would be nice if that was not necessary.
done - I still don't know the official rule for good spacing for lists with multiple paragraphs. Somthing like "if you have multiple paragraphs for a bulleted item, wrap each paragraph with a
except for the last paragraph.
- If you have a bulleted list next to a right-aligned image, the bullets are under the image. (In this example I had to replace the bullets by stars for that reason)
NOTE: This is because the image's style is float:right - this means that text is floating around the image. This behavior is correct at this place. If you need text to stay indented, than easiest way is to crate table with 1 row, 2 cells, image in left cell, text in right cell. - In embedded lists, the first indented line is a bit too close to the line above. example
done - A link inside bold text ( or ) should be displayed bold, otherwise it looks out of place. (It works with italic text).
NOTE: By default links ar not bold and its style overrides the <b>, to acheive what you mean please use <b>text before</b> <a href="link"><b>link</b></a> <b>text after</b> - When I look at a page locally, or live, the text styles look different (e.g. in the features dir, locally h1/h2 are red, while live h1/h2 are darkblue; line spacing seems diffferent too.) -- I assume this is because some divs with sideffects are part of the wrapper?
NOTE: Pages in the testwww/www/features/ dir are using special css file: testwwww/www/features.css which overrides site wide heading colors. Depending on how this one is referenced, your local version can find it or not. If features.css is referenced absolutelly like /features.css the browser will not find it. If it's referenced relatively like ../../features.css the browser will find it. - option of using single pixel borders around screenshots: (equivalents of: style="border:1px solid", and style="border:0")
done - add an additional .collapse class for those of us who can't remember that the class uses an incorrect spelling.
