Skip to content
This repository was archived by the owner on Dec 11, 2021. It is now read-only.

Typography: Added basic styles for paragraphs and lists #142

Closed
wants to merge 2 commits into from
Closed

Typography: Added basic styles for paragraphs and lists #142

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
d0c6447
Typography: Added styles for paragraphs and lists
thejdeep Mar 3, 2016
af66864
Typography: Added font-size to p map
thejdeep Mar 11, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 18 additions & 0 deletions scss/atoms/typography/_typography.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,24 @@ h6 {
@include heading($h6);
}

p {
text-align: map-get($p,text-alignment);
margin: em(map-get($p,margin-top)) em(map-get($p,margin-right)) em(map-get($p,margin-bottom)) em(map-get($p,margin-left));
line-height: 1.5;
font-size: em(map-get($p, font-size));
}

ul, ol {
margin: 0 0 10px;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

margins should probably be put into a variable

Copy link
Contributor

@sfrisk sfrisk Apr 26, 2016 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

also just styling for ol/ul and nested ol/ul? no li styling?

}

ul ul,
ol ul,
ul ol,
ol ol {
margin: 0;
}

/*
* ==========================================================================
* Block elements
Expand Down
11 changes: 11 additions & 0 deletions scss/variables/typography.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -161,6 +161,17 @@ chassis.typography = {
"font-style": "italic",
"padding-left": "1em"
}
},
"p": {
name: "Paragraph style",
value: {
"margin-top": "25px",
"margin-bottom": "25px",
"margin-left": "0px",
"margin-right": "0px",
"text-alignment": "left",
"font-size": fontSize
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

check my comment above
" font-size" :fontSize

}

};
Expand Down