diff options
Diffstat (limited to 'design/old/v9/_details.scss')
-rw-r--r-- | design/old/v9/_details.scss | 601 |
1 files changed, 0 insertions, 601 deletions
diff --git a/design/old/v9/_details.scss b/design/old/v9/_details.scss deleted file mode 100644 index 53e819f..0000000 --- a/design/old/v9/_details.scss +++ /dev/null @@ -1,601 +0,0 @@ -.detail { - #article { - padding-bottom: 2rem; - border-bottom: 3px double #efefef; - } - article { - font-family: $fancy_serif; - @include constrain_narrow; - margin-top: 4rem; - h1 { - font-family: $fancy_serif; - line-height: 1em; - letter-spacing: -1px; - @include fontsize(48); - font-weight: normal; - margin-bottom: .25rem - } - ul { - text-align: left; - @include fontsize(18); - } - } - .post-subtitle { - font-style: italic; - font-size: 1.4rem; - line-height: 1.25; - margin-top: 0; - margin-bottom: 0; - } - .post-subtitle-segundo { - @include fancy_sans; - @include smcaps; - @include fontsize(13); - font-weight: bold; - color: #999; - - } - .post-linewrapper { - margin-top: 1rem; - padding-top: 1rem; - display: inline-block; - border-top: 1px solid #efefef; - } - .post-location { - color: #b6b6b6; - text-align: center; - a { - color: #b6b6b6; - text-decoration: underline; - text-decoration-color: $orange; - } - @include breakpoint(gamma) { - text-align: left; - } - } - .post-date { - text-align: center; - @include breakpoint(alpha) { - text-align: left; - } - } - .map { - width: 100vw; - position: relative; - left: 50%; - right: 50%; - margin-left: -50vw; - margin-right: -50vw; - } - .post-header { - @include fancy_sans; - @include fontsize(18); - color: lighten($body_font_color, 20); - padding-bottom: 2.6rem; - border-bottom: 1px solid #efefef; - @include breakpoint(alpha) { - text-align: left; - } - time { - } - } - p:first-of-type { - margin-top: 2.6rem; - } - h4, h5 { - @include fancy_sans; - margin: 3rem 0 0 0; - } - h4 + p, .afterward h4 + p { - margin-top: .125rem; - } - h5 { - margin: 0 - } - .afterward { - p {font-style: italic;} - h4 { - margin-bottom: 0; - } - } - p.small { - @include fontsize(18); - } - .sci { - text-align: center; - @include fontsize(24); - font-weight: 400; - margin: 0; - - } - .sci:nth-child(3) { - @include fontsize(18); - margin-bottom: 2rem; - } - ul { - list-style: circle; - margin-left: 2.5em; - list-style-position: outside; - margin-bottom: 2.4em; - } - // Ack, id selector, so wrong, but easy handles the slightly different footer - // in the dialogue section that lists all the sightings - #endnode { - h5 { - @include fontsize(14); - @include smcaps; - @include fancy_sans; - margin-bottom: 1rem; - margin-top: 2rem; - } - ul { - margin-bottom: 2em; - list-style-type: none; - padding: 0; - li { - color: lighten($body_font_color, 30); - margin-bottom: 0; - margin-top: 0; - &:before { - content: "\2022"; - color: lighten($body_font_color, 30); - margin-right: .35rem; - } - } - } - } - #detail-map-canvas { - height: 400px; - width: 98vw; - position: relative; - left: 49%; - right: 49%; - margin-left: -48vw; - margin-right: -49vw; - } -} -.post-dateline { - display: inline-block; - margin-top: 0em; - padding-top: 1rem; - padding-bottom: 2.6rem; - border-top: 1px solid #efefef; -} -header.tight { - margin-bottom: 3rem; - * { - margin: 0; - text-align: center; - } - h1 { - margin-bottom: 1rem; - } - h2 { - display: inline-block; - border-top: 1px solid darken(#efefef, 10); - padding-top: 1rem; - } - h3 { - margin-top: .35rem; - } -} -h4.post-source { - @include fontsize(14); - @include smcaps; - padding-bottom: 0em; - margin-bottom: 0; - margin-top: 0; - font-weight: bold; - color: #b6b6b6; - a { - color: #b6b6b6; - &:hover { - color: $link_color; - } - } -} -.post-location { - h3 { - display: inline; - @include fontsize(14); - } - a { - color: $secondary_link_color; - text-decoration: none; - } -} -.post-essay ~ p:first-child:first-letter { - @include fancy_sans; - font-size: 75px; - line-height: 60px; - padding-top: 4px; - padding-right: 8px; - padding-left: 3px; -} -//### GUIDE STUFF ### -.product-card { - margin: 5rem 0; -} -.detail .product-link { - a { - display: block; - padding: 1rem; - background: #249bd6; - color: white; - text-transform: uppercase; - font-size: 16px; - text-decoration: none; - } -} -.buy-btn { - @include fancy_sans; - display: block; - padding: .5rem 1rem; - background: #249bd6; - color: white; - text-transform: uppercase; - @include fontsize(16); - text-decoration: none; - margin-right: 1rem; -} -.buy-btn-wrapper { - display: flex; - justify-content: start; - align-items: center; - align-content: space-between; - h4 { - margin: 0 1.5rem 0 0; - line-height: normal; - &:after { - content: ":"; - } - } - h5 { - margin-right: 1rem; - } -} -.post-guide .buy-btn-wrapper { - margin-top: 4rem; - justify-content: center; -} -.detail .post-guide { - h3 { - @include fontsize(27); - margin: 4rem 0 .5rem 0; - & + p { - margin-top: 0; - } - } -} -//### PAGE NAVIGATION ### -.nav-wrapper { - @include constrain_narrow(); - border-bottom: 3px double #efefef; -} -#page-navigation { - margin: 2em auto; - text-align: center; - display: table; - ul { - list-style-type: none; - margin: 0 auto; - width: 100%; - text-align: center; - padding: 0; - } - li { - margin: 6px auto; - clear: both; - line-height: 24px; - text-align: center; - } - span { - @include fancy_sans; - @include fontsize(14); - min-width: 70px; - display: block; - text-align: right; - margin-right: 10px; - float: left; - } - a { - display: block; - float: left; - font-family: $fancy_serif; - text-align: left; - font-style: italic; - color: $brown; - text-decoration: none; - } -} - -.article-afterward { - @extend %clearfix; - @include constrain_narrow; - padding-bottom: 2rem; - .article-card-mini { - margin-bottom: 0 - } - .hedtinycaps { - display: inline-block; - margin-bottom: 2.5rem; - border-bottom: 2px solid #efefef; - } - @include breakpoint(gamma) { - @include constrain(960px); - } -} -.related-bottom { - @extend %clearfix; - &:after { - display: block; - content: ''; - @include constrain_narrow; - height: 30px; - border-bottom: 3px double #efefef; - } -} -.article-card-list { - padding: 0 !important; - margin: 0 !important; - list-style-type: none !important; - margin: 0 auto !important; -} -.article-card-mini, .detail .article-card-mini { - margin-left: 0; - margin-right: 0; - margin-bottom: 2rem; - max-width: 100%; - a { text-decoration: none;} - .post-title { - @include fontsize(20); - text-align: center; - line-height: 1.2; - margin: 0; - } - .post-subtitle { - @include fontsize(18); - text-align: center; - font-family: $fancy_serif; - font-style: italic; - font-weight: normal; - margin: .25rem auto 0; - } - .post-summary, .post-date{ - text-align: center; - display: inline-block; - line-height: 0.6 !important; - color: #b6b6b6; - } - @include breakpoint(omega) { - margin: 0 auto; - max-width: 70%; - margin-bottom: 0; - } - @include breakpoint(alpha) { - max-width: 50%; - } - @include breakpoint(beta) { - max-width: 47%; - float: left; - margin-right: 1rem; - margin-bottom: 1.5rem; - } - @include breakpoint(gamma) { - max-width: 230px; - float: left; - margin-right: .5rem; - } -} -.post-mini-image { - max-height: 220px; - overflow: hidden; - @include breakpoint(beta) { - margin-bottom: 1rem; - } - img { - margin-top: -20%; - } -} - - -.entry-footer { - @extend %clearfix; - @include constrain_narrow; - border-bottom: 3px double #efefef; - margin-top: 2em; - text-align: left; - h3 { - @include smcaps; - @include fontsize(16); - } - h3 + ul { - padding: 0; - } - li { - margin: .25em 0; - list-style-type: none; - } - li ul { - columns: 2 auto; - list-style-type: none; - margin-left: .5rem; - padding: 0; - } - li ul li:before { - content: "\2022"; - margin-right: .45rem; - color: lighten($body_font_color, 40); - } - .grouper { - margin-top: 1em; - } - a { - text-decoration: none; - color: lighten($body_font_color, 20); - } - #wildlife li ul li { - color: lighten($body_font_color, 40); - a { - color: lighten($body_font_color, 10); - } - } - @include breakpoint(beta) { - padding-bottom: 2rem; - #wildlife { - max-width: 55%; - float: left; - margin-right: 1.2rem; - } - #recommended-reading{ - ul { - list-style-type: none; - } - img { - max-width: 180px; - } - } - } - aside { - @extend %clearfix; - } -} -#field_notes { - @include breakpoint(beta) { - max-width: 33%; - float: left; - margin-top: .15em; - margin-left: 7em; - } - li:before { - content: "\2022"; - margin-right: .35rem; - color: $body_font_light; - } -} -.rr-clear { - clear: left; -} - -//### FOOTNOTES ### -.footnote { - margin: 1em auto 0 auto; - padding: 0; - list-style-type: none; - p { - font-size: 1rem; - line-height: 1.4; - margin-top: 0 !important; - } - hr {display: none;} - ol { - padding-left: 1em; - @include breakpoint(alpha) { - margin-left: 1em; - } - } -} -sup { - line-height: 1; - .footnote-ref { - padding: 4px 3px; - - } -} - -//### Figments ### -.downloads { - list-style-type: none; -} - -// ### Books ### -.book { - &:after { - display: block; - content: ''; - height: 30px; - border-bottom: 3px solid #efefef; - width: 200px; - margin: 0 auto 3rem auto; - padding-left: 30px; - } -} -.book-metadata { - text-align: left; - @include fancy_sans; - dd { - display: inline; - margin: 0; - } - dd:after{ - display: block; - content: ''; - } - dt{ - display: inline-block; - } - dt:after { - content: ":"; - } -} -.thoughts, .highlights, .meta-cover, .dis { - @include constrain_narrow; - font-family: $fancy_serif; - text-align: left; - p { - max-width: 100%; - } -} -.book-cover-wrapper { - @include constrain_wide; - img { - float: left; - max-width: 20rem; - } -} -.thoughts { - margin-top: 4rem; - p:first-of-type { - margin-top: 0; - } -} -.thoughts h5, .highlights h4 { - font-weight: 500; - letter-spacing: 1px; - margin: 3em 0 .5em 0; - @include fancy_sans; - @include smcaps; - @include fontsize(14); -} -.highlights div:first-of-type p:first-of-type { - margin-top: 0; -} -.book-highlight p:last-of-type { - margin-bottom: 0; -} -.book p:last-of-type, .highlights div:first-of-type p:last-of-type{ - margin-top: 8px; -} -.highlink { - @include fontsize(20); - margin-right: .5rem; - float: left; - line-height: 1.6; - text-decoration: none; - color: lighten($body_font_color, 60); - @include breakpoint(alpha) { - margin-top: 1px; - } - &:visited { - color: lighten($body_font_color, 60); - } -} -.foot { - margin-top: 16px; - @include fancy_sans; - @include fontsize(16); -} -.dis { - @include fontsize(16); - text-align: center; -} |