mirror of
https://github.com/danog/sass-site.git
synced 2024-12-02 17:38:26 +01:00
43 lines
1.4 KiB
Plaintext
43 lines
1.4 KiB
Plaintext
---
|
|
title: Code Style Guide
|
|
---
|
|
|
|
%p.introduction
|
|
If you would like to contribute to this website's code, please adhere to the
|
|
following code style guidelines.
|
|
|
|
:markdown
|
|
- Please try to keep lines at a maximum of 78 characters.
|
|
- Favor clarity over brevity in naming anything.
|
|
|
|
## Markup
|
|
For the most part, we use [Haml](http://haml.info/) and
|
|
[Markdown](http://daringfireball.net/projects/markdown/) for writing markup.
|
|
If you need to use regular HTML anywhere, write HTML5, but favor a strict
|
|
XHTML style:
|
|
|
|
- Use well-formed markup; elements are nested properly and do not overlap.
|
|
- Write elements and attributes in lowercase.
|
|
- Quote all attributes.
|
|
- Self-close empty elements with a space before the trailing slash:
|
|
(`<br />`)
|
|
|
|
## Style
|
|
This website uses Sass (duh) in the newer SCSS syntax. We also use the
|
|
following extensions:
|
|
|
|
- [Compass](http://compass-style.org/)
|
|
- [Susy](http://susy.oddbird.net/)
|
|
|
|
Make sure you're using the mixins and such that they have to offer before
|
|
rewriting something, unless you can justify otherwise.
|
|
|
|
- Use hyphenated class names (no camelCase or snake_case).
|
|
- For naming, use the broad-to-specific approach. See
|
|
[this article](http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/quick-tip-name-your-sass-variables-modularly/)
|
|
for more details.
|
|
- Avoid nesting too deep.
|
|
- Write comma-delimited selectors on separate lines.
|
|
|
|
|