diff options
Diffstat (limited to 'site/assets/css/css.css')
| -rw-r--r-- | site/assets/css/css.css | 154 |
1 files changed, 131 insertions, 23 deletions
diff --git a/site/assets/css/css.css b/site/assets/css/css.css index 732386bd..91d75599 100644 --- a/site/assets/css/css.css +++ b/site/assets/css/css.css @@ -89,6 +89,7 @@ header .links a { transition: color 0.1s cubic-bezier(0,0,1,1), border-color 0.1s cubic-bezier(0,0,1,1); border-bottom: 1px solid rgba(255,255,255,0); padding: 3px; + font-weight: 500; } header .links a.active { color: #bbb; @@ -139,11 +140,12 @@ footer a:hover { h1 { color: #ddd; - font-weight: 300; - font-size: 24pt; + font-weight: 400; + font-size: 28pt; margin: 75px 0 10px; padding: 0; transition: color 0.2s cubic-bezier(0,0,1,1); + font-family: 'Roboto'; } h2 { color: #ddd; @@ -152,13 +154,15 @@ h2 { margin: 20px 0 10px; padding: 0; transition: color 0.2s cubic-bezier(0,0,1,1); + font-family: 'Roboto'; } h3 { margin: 0 0 20px 0; padding: 20px 0 0 0; - font-size: 14pt; + font-size: 16pt; font-weight: 500; transition: color 0.2s cubic-bezier(0,0,1,1); + font-family: 'Roboto'; } h4 { margin: 0 0 10px 0; @@ -166,6 +170,7 @@ h4 { font-size: 11pt; font-weight: 500; transition: color 0.2s cubic-bezier(0,0,1,1); + font-family: 'Roboto'; } .content h3 a { color: #888; @@ -180,16 +185,19 @@ h4 { padding: 0 0 10px 0; font-family: 'Roboto Mono'; font-weight: 400; - font-size: 14px; + font-size: 13px; text-transform: uppercase; letter-spacing: 2px; } - +.right-sidebar ul li a{ + border-bottom: 0; +} th, .gray { font-family: 'Roboto Mono', monospace; - font-weight: 400; + font-weight: 500; text-transform: uppercase; - color: #666; + letter-spacing: .15rem; + color: #999; } th, .gray { font-size: 9pt; @@ -221,8 +229,8 @@ section { p { margin: 0 0 20px 0; line-height: 2; - font-size: 15px; - font-weight: 400; + font-size: 16px; + font-weight: 300; } .content a { color: #fff; @@ -231,7 +239,8 @@ p { transition: color 0.2s cubic-bezier(0,0,1,1); } .desktop .content a:hover { - color: #ff8; + color: #fff; + border-bottom: 1px solid; } /* top of post metadata */ @@ -241,7 +250,7 @@ p { flex-direction: row; justify-content: flex-start; align-items: flex-start; - font-size: 10pt; + font-size: 11pt; margin-bottom: 20px; font-family: 'Roboto', sans-serif; } @@ -261,21 +270,46 @@ p { border-left: 1px solid #444; font-family: 'Roboto'; font-size: 14px; + font-weight: 400; } -.right-sidebar .meta { +.left-sidebar { + float: left; + width: 220px; + padding-top: 10px; + padding-right: 20px; + margin-right: 20px; + margin-bottom: 10px; + /*border-right: 1px solid #444;*/ + font-family: 'Roboto'; + font-size: 14px; + font-weight: 400; + clear:left; +} +.left-sidebar .meta, .right-sidebar .meta { flex-direction: column; } .right-sidebar .meta > div { margin-bottom: 10px; } +.left-sidebar .meta > div { + margin-bottom: 10px; +} .right-sidebar ul { margin-bottom: 10px; color: #aaa; } +.left-sidebar ul { + margin-bottom: 10px; + color: #aaa; +} .right-sidebar ul:first-child a { text-decoration: none; border-bottom: 1px solid; } +.left-sidebar ul:first-child a { + text-decoration: none; + border-bottom: 1px solid; +} /* lists */ @@ -317,6 +351,10 @@ hr { border: 0; width: 80px; } +hr.supp{ + width:100%; + margin:70px 0 30px 0; +} blockquote { margin-left: 28px; padding: 0 0 0 10px; @@ -355,17 +393,22 @@ section.images { flex-direction: row; align-items: flex-start; justify-content: center; + clear: both; } .image:only-child { width: 100%; } .image:first-child { margin-left: 0; + /*margin-top:10px;*/ } .image:nth-child(2), .image:nth-child(3) { margin-left: 40px; } +.image:nth-child(4) { + margin-left: 20px; +} .image:first-child:nth-last-child(2), .image:first-child:nth-last-child(2) ~ .image { width: 300px; @@ -374,6 +417,9 @@ section.images { .image:first-child:nth-last-child(3) ~ .image { width: 186px; } +.image:first-child:nth-last-child(4) ~ .image { + width: 100px; +} section.wide { width: 960px; } @@ -386,25 +432,35 @@ section.fullwidth { section.fullwidth .image { max-width: 100%; } +.image .caption{ + text-align: center; +} +.image .caption.intro-caption{ + text-align: left; +} .caption { text-align: left; font-size: 9pt; color: #999; max-width: 960px; - margin: 10px auto 0 auto; + margin: 10px auto 10px auto; font-family: 'Roboto'; } .sideimage { - margin: 10px 0; + margin: 0px 0 40px 0; display: flex; flex-direction: row; justify-content: flex-start; align-items: flex-start; } +.sideImage p{ + margin-top:0px; + padding-top:0px; +} .sideimage img { - margin-right: 10px; - width: 250px; - height: 250px; + margin-right: 40px; + width: 200px; + height: 200px; } /* blog index */ @@ -539,6 +595,14 @@ section.fullwidth .image { height: 140px; padding: 10px; color: white; + font-weight: 300; + font-family: 'Roboto Mono' +} +.desktop .content .dataset-list a{ + border:none; +} +.dataset-list a:hover{ + border:none; } .dataset-list a:nth-child(3n+1) { background-color: rgba(255, 0, 0, 0.1); } .desktop .dataset-list a:nth-child(3n+1):hover { background-color: rgba(255, 0, 0, 0.2); } @@ -563,7 +627,7 @@ section.intro_section { background-size: cover; background-position: bottom left; padding: 50px 0; - min-height: 60vh; + min-height: 45vh; display: flex; justify-content: center; align-items: center; @@ -581,10 +645,10 @@ section.intro_section { font-weight: 300; } .intro_section .hero_subdesc { - font-size: 18px; + font-size: 17px; line-height: 36px; - max-width: 640px; - font-weight: 300; + max-width: 680px; + font-weight: 400; color: #ddd; } .intro_section div > span { @@ -595,6 +659,50 @@ section.intro_section { box-decoration-break: clone; } +/* ----------------------------------------------------- +page-specific formatting +----------------------------------------------------- */ + +/* Dataset */ + +.leaflet-container{ + margin-bottom: 10px +} + +/* map */ + +.map-legend-item{ + display: inline-block; + margin-right: 10px +} +.edu{ + color:#f30000; +} +.com{ + color:#f2f293; +} +.gov{ + color:#3264f6; +} + +/* about */ + +.content-about{ + font-color:#ff0; +} +.content-about .about-menu ul li{ + display:inline-block; + font-size: 12px; + font-weight: 400; + margin-right: 5px; + text-transform: uppercase; + margin-right: 10px +} +.content-about .about-menu ul li a{ + border-bottom: 0; +} + + /* footnotes */ a.footnote { @@ -620,8 +728,8 @@ a.footnote_shim { bottom: 8px; } .desktop a.footnote:hover { - background-color: #ff8; - color: #000; + /*background-color: #ff8;*/ + color: #fff; } .backlinks { margin-right: 10px; |
