From 3086e9d8d77ccf4ad7d5be189d07c98ab3dad481 Mon Sep 17 00:00:00 2001 From: Michael Rose Date: Sat, 7 Sep 2013 12:57:20 -0400 Subject: [PATCH] Improve typography of .article-author --- assets/css/ie.css | 74 +++++++++++++++++++++++-------------- assets/css/main.css | 74 +++++++++++++++++++++++-------------- assets/less/elements.less | 15 -------- assets/less/page.less | 35 ++++++++++++++++++ assets/less/typography.less | 2 +- 5 files changed, 130 insertions(+), 70 deletions(-) diff --git a/assets/css/ie.css b/assets/css/ie.css index 8b9cd14..d893fcb 100644 --- a/assets/css/ie.css +++ b/assets/css/ie.css @@ -534,9 +534,9 @@ blockquote { font-size: 24px; font-size: 1.5rem; } -.entry-content .footnotes ol, -.entry-content .footnotes li, -.entry-content .footnotes p { +.footnotes ol, +.footnotes li, +.footnotes p { font-size: 14px; font-size: 0.875rem; line-height: 1.8571; @@ -715,30 +715,6 @@ svg:not(:root) { -o-transform: translate(0, 2px); transform: translate(0, 2px); } -.author-social { - display: block; - margin-bottom: 5px; - font-size: 14px; - font-size: 0.875rem; - color: #111111; -} -.author-social:visited { - color: #111111; -} -.author-social:hover { - -webkit-transform: scale(1.1); - -moz-transform: scale(1.1); - -ms-transform: scale(1.1); - -o-transform: scale(1.1); - transform: scale(1.1); -} -.author-social:active { - -webkit-transform: translate(0, 2px); - -moz-transform: translate(0, 2px); - -ms-transform: translate(0, 2px); - -o-transform: translate(0, 2px); - transform: translate(0, 2px); -} /* Well ================================================= */ .well { min-height: 20px; @@ -1194,13 +1170,57 @@ body { -moz-border-radius: 100px; border-radius: 100px; } +.author-social { + display: block; + margin-bottom: 5px; + font-size: 14px; + font-size: 0.875rem; + color: #111111; +} +.author-social:visited { + color: #111111; +} +.author-social:hover { + -webkit-transform: scale(1.1); + -moz-transform: scale(1.1); + -ms-transform: scale(1.1); + -o-transform: scale(1.1); + transform: scale(1.1); +} +.author-social:active { + -webkit-transform: translate(0, 2px); + -moz-transform: translate(0, 2px); + -ms-transform: translate(0, 2px); + -o-transform: translate(0, 2px); + transform: translate(0, 2px); +} .article-author-top { display: none; + text-align: center; +} +.article-author-bottom { + margin-bottom: 1em; } .article-author-bottom .bio-photo { float: left; margin-right: 25px; } +.article-author-bottom .author-social { + display: inline-block; + margin-right: 5px; +} +.article-wrap p > a, +.article-wrap li > a { + border-bottom: 1px dotted #b3b3b3; +} +.article-wrap p > a:hover, +.article-wrap li > a:hover { + border-bottom-style: solid; +} +.article-wrap p > a.reversefootnote, +.article-wrap li > a.reversefootnote { + border-bottom-width: 0; +} .toc { display: none; font-size: 95%; diff --git a/assets/css/main.css b/assets/css/main.css index f5fddbd..6e9cf1e 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -534,9 +534,9 @@ blockquote { font-size: 24px; font-size: 1.5rem; } -.entry-content .footnotes ol, -.entry-content .footnotes li, -.entry-content .footnotes p { +.footnotes ol, +.footnotes li, +.footnotes p { font-size: 14px; font-size: 0.875rem; line-height: 1.8571; @@ -1392,30 +1392,6 @@ svg:not(:root) { -o-transform: translate(0, 2px); transform: translate(0, 2px); } -.author-social { - display: block; - margin-bottom: 5px; - font-size: 14px; - font-size: 0.875rem; - color: #111111; -} -.author-social:visited { - color: #111111; -} -.author-social:hover { - -webkit-transform: scale(1.1); - -moz-transform: scale(1.1); - -ms-transform: scale(1.1); - -o-transform: scale(1.1); - transform: scale(1.1); -} -.author-social:active { - -webkit-transform: translate(0, 2px); - -moz-transform: translate(0, 2px); - -ms-transform: translate(0, 2px); - -o-transform: translate(0, 2px); - transform: translate(0, 2px); -} /* Well ================================================= */ .well { min-height: 20px; @@ -1949,13 +1925,57 @@ body { -moz-border-radius: 100px; border-radius: 100px; } +.author-social { + display: block; + margin-bottom: 5px; + font-size: 14px; + font-size: 0.875rem; + color: #111111; +} +.author-social:visited { + color: #111111; +} +.author-social:hover { + -webkit-transform: scale(1.1); + -moz-transform: scale(1.1); + -ms-transform: scale(1.1); + -o-transform: scale(1.1); + transform: scale(1.1); +} +.author-social:active { + -webkit-transform: translate(0, 2px); + -moz-transform: translate(0, 2px); + -ms-transform: translate(0, 2px); + -o-transform: translate(0, 2px); + transform: translate(0, 2px); +} .article-author-top { display: none; + text-align: center; +} +.article-author-bottom { + margin-bottom: 1em; } .article-author-bottom .bio-photo { float: left; margin-right: 25px; } +.article-author-bottom .author-social { + display: inline-block; + margin-right: 5px; +} +.article-wrap p > a, +.article-wrap li > a { + border-bottom: 1px dotted #b3b3b3; +} +.article-wrap p > a:hover, +.article-wrap li > a:hover { + border-bottom-style: solid; +} +.article-wrap p > a.reversefootnote, +.article-wrap li > a.reversefootnote { + border-bottom-width: 0; +} .toc { display: none; font-size: 95%; diff --git a/assets/less/elements.less b/assets/less/elements.less index 74ccb87..3d8165e 100644 --- a/assets/less/elements.less +++ b/assets/less/elements.less @@ -59,21 +59,6 @@ svg:not(:root) { .translate(0, 2px); } } -.author-social { - display: block; - margin-bottom: 5px; - .font-rem(14); - color: @black; - &:visited { - color: @black; - } - &:hover { - .scale(1.1); - } - &:active { - .translate(0, 2px); - } -} /* Well ================================================= */ .well { min-height: 20px; diff --git a/assets/less/page.less b/assets/less/page.less index fd22b0e..ef8e96f 100644 --- a/assets/less/page.less +++ b/assets/less/page.less @@ -128,14 +128,49 @@ body { .rounded(100px); } } +.author-social { + display: block; + margin-bottom: 5px; + .font-rem(14); + color: @black; + &:visited { + color: @black; + } + &:hover { + .scale(1.1); + } + &:active { + .translate(0, 2px); + } +} .article-author-top { display: none; + text-align: center; } .article-author-bottom { + margin-bottom: 1em; .bio-photo { float: left; margin-right: 25px; } + .author-social { + display: inline-block; + margin-right: 5px; + } +} +.article-wrap { + // Dotted line underlines for links + p > a, + li > a { + border-bottom: 1px dotted lighten(@link-color, 50); + &:hover { + border-bottom-style: solid; + } + } + p > a.reversefootnote, + li > a.reversefootnote { + border-bottom-width: 0; + } } .toc { display: none; diff --git a/assets/less/typography.less b/assets/less/typography.less index 204520a..45c48ce 100644 --- a/assets/less/typography.less +++ b/assets/less/typography.less @@ -101,7 +101,7 @@ blockquote { // Footnotes // -------------------------------------------------- -.entry-content .footnotes { +.footnotes { ol, li, p { .font-size(14); } -- 2.43.0