Paragraph Indentation Carpet Bombing
grayghostvisuals opened this issue · 3 comments
Our current method to style paragraphs is a PAIN IN THE ASS and I'm tired of it carpet bombing everything. We need a more robust way to handle this. Anybody have thoughts on this?
//paragraph siblings indent
$indent-val: 1.5em !default;
p {
margin: auto auto $indent-val;
& + p {
text-indent: $indent-val;
margin-top: -$indent-val;
}
}
This is not a disagreement, but rather to help pin down the exact issue:
What kind of issues have you had with the current setup?
Looking at my own site (which, admittedly, is fairly small), I see a few places where I've overriden the current stuff:
.contact
, which is a form- Paragraphs following a paragraph that follows an h6 (yes, it's an ugly selector, sorry about that... =), which has
text-indent: 0
due to theh6
being a run-in sidehead. - I've also changed the margin-top to -1.1em rather than
-$indent-val
, to keep a touch more space between parapgrahs.
However, I've also made an active choice (based on the current carpent-bombing of both this style and one of my own) to not use paragraphs in the sidebar, even at one particular place where it might be appropriate.
I know there's been discussions to limit the typeplate styling to particular parts of the page through scoping - possibly set a reasonable default (like, say, none...) and allow the user to change it if they wish to scope it. I will test one theory I have and add to the discussion this weekend.
Here's my solution for users to opt in for paragraph styles of their choosing which I'll be adding later today.
// $Variables $Paragraphs
// -------------------------------------//
$paragraph-vertical-whitespace: false !default;
// $Styles $Parargraphs
// -------------------------------------//
p {
margin: auto auto $indent-val;
@if $paragraph-vertical-whitespace == false {
& + p {
//siblings indentation
text-indent: $indent-val;
margin-top: -$indent-val;
}
}
}
Change my diaper cause I just committed 8bce17a088dd44d5905c2c566ceba296925664e4.