Closed nicetransition closed 11 years ago
@kevinmack18 fixed on development branch https://github.com/LukeAskew/Front-End-Standards/blob/development/Stylesheets/Sass.md#Inception
Question: is it good how I have it, or, do we want to have line-breaks for rules regardless of whether a property is defined?
For example:
.cart { .sidebar { width: 150px; } .content { width: 850px; } }
For consistency sake, I'd recommend that it's always has a line break. When there are too many cases it just makes it complicated and hard to remember.
The example above looks unnecessarily spaced out. For me, the indentation is enough visual separation.
Does everyone normally include that much space when writing Sass?
If so, should this example be updated to match this type of formatting.
.special-widget {
background-color: blue;
.super-special {
background-color: red;
a {
border: 2px solid yellow;
&:hover {
text-decoration: underline;
}
}
}
}
I agree with @adamweis
// bad -- to spacey
.special-widget {
background-color: blue;
.super-special {
background-color: red;
a {
border: 2px solid yellow;
&:hover {
text-decoration: underline;
}
}
}
}
// good
.special-widget {
background-color: blue;
.super-special {
background-color: red;
a {
border: 2px solid yellow;
&:hover {
text-decoration: underline;
}
}
}
}
Agreed. To recap, I will fix the line-breaks section I have to be consistent with @kevinmack18 's //good example from above.
// good .special-widget { background-color: blue; .super-special { background-color: red; a { border: 2px solid yellow; &:hover { text-decoration: underline; } } } } .next-widget { //stuff }
fixed on development branch https://github.com/LukeAskew/Front-End-Standards/blob/development/Stylesheets/Sass.md#Line%20Breaks
The first "good" example does not have consistent spacing:
// Good
.module {
color: black;
width: 100%;
.shrim {
color: green;
font-size: 16px;
}
.spaghett {
color: red;
font-size: 12px;
}
}
fixed in issue #62 on master
https://github.com/LukeAskew/Front-End-Standards/blob/master/Stylesheets/Sass.md#the-inception-rule "Page Context" is missing line breaks around curly brackets