Skip to content

Commit

Permalink
feat(typography): use consistent fonts
Browse files Browse the repository at this point in the history
It also removes code that we do not need from bootstrap source files.

Update #429
  • Loading branch information
talha131 committed Feb 1, 2020
1 parent f4bee2f commit 8b7a8bd
Show file tree
Hide file tree
Showing 6 changed files with 62 additions and 83 deletions.
1 change: 0 additions & 1 deletion static/bootstrap/code.less
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@
code,
pre {
padding: 0 3px 2px;
#font > #family > .monospace;
font-size: @baseFontSize - 2;
color: @grayDark;
.border-radius(3px);
Expand Down
45 changes: 0 additions & 45 deletions static/bootstrap/type.less
Original file line number Diff line number Diff line change
Expand Up @@ -53,51 +53,6 @@ a.text-success:focus { color: darken(@successText, 10%); }
.text-center { text-align: center; }


// Headings
// -------------------------

h1, h2, h3, h4, h5, h6 {
margin: (@baseLineHeight / 2) 0;
font-family: @headingsFontFamily;
font-weight: @headingsFontWeight;
line-height: @baseLineHeight;
color: @headingsColor;
text-rendering: optimizelegibility; // Fix the character spacing for headings
small {
font-weight: normal;
line-height: 1;
color: @grayLight;
}
}

h1,
h2,
h3 { line-height: @baseLineHeight * 2; }

h1 { font-size: @baseFontSize * 2.75; } // ~38px
h2 { font-size: @baseFontSize * 2.25; } // ~32px
h3 { font-size: @baseFontSize * 1.75; } // ~24px
h4 { font-size: @baseFontSize * 1.25; } // ~18px
h5 { font-size: @baseFontSize; }
h6 { font-size: @baseFontSize * 0.85; } // ~12px

h1 small { font-size: @baseFontSize * 1.75; } // ~24px
h2 small { font-size: @baseFontSize * 1.25; } // ~18px
h3 small { font-size: @baseFontSize; }
h4 small { font-size: @baseFontSize; }


// Page header
// -------------------------

.page-header {
padding-bottom: (@baseLineHeight / 2) - 1;
margin: @baseLineHeight 0 (@baseLineHeight * 1.5);
border-bottom: 1px solid @grayLighter;
}



// Lists
// --------------------------------------------------

Expand Down
1 change: 0 additions & 1 deletion static/css/admonition.css
Original file line number Diff line number Diff line change
Expand Up @@ -103,7 +103,6 @@ div.note p.admonition-title:before,
div.hint p.admonition-title:before,
div.tip p.admonition-title:before {
display: inline-block;
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
line-height: 1;
Expand Down
4 changes: 0 additions & 4 deletions static/css/blockquote.css
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,6 @@ blockquote {
padding: 0.1rem 1.2rem;
position: relative;
width: 80%;
& p {
font-family: "Helvetica Neue", Helvetica, Arial, Sans-Serif;
font-weight: 400;
}
&:before,
&:after {
color: dimgray;
Expand Down
28 changes: 0 additions & 28 deletions static/css/elegant.css
Original file line number Diff line number Diff line change
Expand Up @@ -47,11 +47,6 @@ a {
hr {
border-width: 3px;
}
/* site title */
.site-name {
font-family: "Monaco", "Inconsolata", "Andale Mono", "Lucida Console",
"Bitstream Vera Sans Mono", "Courier New", Courier, Monospace;
}
/* Top navigation menu */
.top-menu li a {
font-weight: bold;
Expand Down Expand Up @@ -125,7 +120,6 @@ table.highlighttable tbody > tr:nth-child(odd) > td {
}
/* Tags */
.list-of-tags {
font-family: "Helvetica Neue", Helvetica, Arial, Sans-Serif;
list-style: none;
margin: 0;
overflow: hidden;
Expand All @@ -151,30 +145,18 @@ table.highlighttable tbody > tr:nth-child(odd) > td {
float: none;
line-height: 28px;
}
.tag-title {
font-family: "Trebuchet MS", Trebuchet, "Lucida Sans Unicode", "Lucida Grande",
"Lucida Sans", Arial, Sans-Serif;
}
.articles-in-tag li {
font: 1.1em/1.6 "Trebuchet MS", Trebuchet, "Lucida Sans Unicode",
"Lucida Grande", "Lucida Sans", Arial, Sans-Serif;
}
/* Article */
.article-content,
div.recent-posts p {
font: 1.2em/1.6 "PT Serif", Georgia, "Times New Roman", Times, Serif;
text-align: justify;
}
.article-content {
max-width: 50em;
}
.article-content p,
div.recent-posts p {
font-size: inherit;
font-variant: normal;
line-height: 1.6;
text-transform: none;
}
.article-content p {
margin: 20px 0;
}
Expand Down Expand Up @@ -211,8 +193,6 @@ div.recent-posts p {
.page-header {
border-bottom: 2px solid maroon;
color: maroon;
margin: 10px 10px 20px;
padding: 5px;
}
.page-header h1 {
border: none;
Expand Down Expand Up @@ -271,7 +251,6 @@ ul.list-articles-category {
ul.list-articles-category li time {
color: #8f8f8f;
display: inline-block;
font: 0.9em "PT Sans", "Helvetica Neue", Arial, Sans-Serif;
width: 7em;
}
a.category-link {
Expand All @@ -280,11 +259,6 @@ a.category-link {
a.category-link:hover {
text-decoration: none;
}
a.list-of-categories {
font-family: "Trebuchet MS", Trebuchet, "Lucida Sans Unicode", "Lucida Grande",
"Lucida Sans", Arial, Sans-Serif;
font-size: 1.1em;
}
a.list-of-categories:hover {
background-color: #08c;
border-radius: var(--border-radius);
Expand Down Expand Up @@ -445,8 +419,6 @@ a#allposts:hover {
border-radius: var(--border-radius);
border: 1px solid #e1e1e8;
color: #d14;
font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
font-size: 12px;
padding: 2px 4px;
white-space: nowrap;
}
Expand Down
66 changes: 62 additions & 4 deletions static/css/typography.css
Original file line number Diff line number Diff line change
Expand Up @@ -4,24 +4,43 @@
/* Headings that are not inside article. Like in sidebar are "others" */
--heading-others-line-height: 1.3rem;
--heading-others-h4-font-size: 1.1rem;
--sansFontFamily: "PT Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
--monoFontFamily: "PT Mono", Monaco, Menlo, Consolas, "Courier New", monospace;
--serifFontFamily: "PT Serif", Georgia, "Times New Roman", Times, serif;
--serifHeadingFontFamily: "PT Serif Caption", Baskerville, Garamond, Georgia,
"DejaVu Serif", "Times New Roman", Times, serif;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: Baskerville, Garamond, Georgia, "DejaVu Serif", "Times New Roman",
Times, Serif;
h6,
.page-header {
font-weight: normal;
margin: 10px 0px;
text-align: left;
& small {
font-style: italic;
}
}
header.page-header h1 {
font-family: var(--serifHeadingFontFamily);
}
h1,
h2,
h3,
h4,
h5,
h6,
.tag-title,
.list-of-tags,
a.list-of-categories,
ul.list-articles-category li time {
font-family: var(--sansFontFamily);
}
h1 {
font-size: 2.5rem;
font-size: 2.4rem;
}
h2 {
font-size: 2.2rem;
Expand Down Expand Up @@ -101,3 +120,42 @@ nav h4 {
font-size: var(--heading-others-h4-font-size);
line-height: var(--heading-others-line-height);
}
/* code */
code,
pre,
.literal, /* reST */
.site-name {
/*Site title */
font-family: var(--monoFontFamily);
}
/* code */
code,
pre,
.literal /* reST */ {
font-size: 0.9rem;
}
.site-name {
font-size: 1.5rem;
}
/* article */
.article-content,
div.recent-posts p {
font-size: 1.125rem;
font-family: var(--serifFontFamily);
font-weight: 400;
line-height: 1.6;
text-transform: none;
}
/* blockquotes */
blockquote {
& p {
font-family: var(--sansFontFamily);
font-weight: 400;
}
}
a.list-of-categories {
font-size: 1.1rem;
}
ul.list-articles-category li time {
font-size: 0.7rem;
}

0 comments on commit 8b7a8bd

Please sign in to comment.