summaryrefslogtreecommitdiff
path: root/design/sass/_details.scss
diff options
context:
space:
mode:
Diffstat (limited to 'design/sass/_details.scss')
-rw-r--r--design/sass/_details.scss521
1 files changed, 0 insertions, 521 deletions
diff --git a/design/sass/_details.scss b/design/sass/_details.scss
deleted file mode 100644
index 74965fd..0000000
--- a/design/sass/_details.scss
+++ /dev/null
@@ -1,521 +0,0 @@
-.content {
- margin-top: 3rem;
-}
-//************** archive grids **********************************{{{
-.archive-grid {
- margin-top: 2rem;
- list-style-type: none;
- padding: 0;
- @include constrain_wide;
- @include breakpoint(alpha) {
- display: grid;
- grid-template-columns: 1fr 1fr 1fr;
- grid-gap: 20px;
- row-gap: 1rem;
- }
-}
-.archive-grid-quad {
- //used for books and related posts in detail pages
- list-style-type: none;
- padding: 0;
- @include breakpoint(alpha) {
- display: grid;
- grid-template-columns: 1fr 1fr;
- grid-gap: 15px;
- }
- @include breakpoint(beta) {
- grid-template-columns: 1fr 1fr 1fr;
- }
- @include breakpoint(epsilon) {
- grid-template-columns: 1fr 1fr 1fr 1fr;
- }
-}
-.related .archive-grid-quad {
- //there's only 4 related items so override the
- //3-grid at breakpoint beta
- @include breakpoint(beta) {
- grid-template-columns: 1fr 1fr;
- }
-}
-.archive-grid-double {
- // homepage recent
- @include breakpoint(alpha) {
- grid-template-columns: 1fr 1fr;
- row-gap: 1rem;
- grid-gap: 16px;
- }
-}
-.archive-grid-single {
- // homepage popular
- @include breakpoint(alpha) {
- grid-template-columns: 1fr;
- row-gap: 1rem;
- grid-gap: 16px;
- }
-}
-.recent-popular {
- // get popular and recent lined up
- // side by side on the hompage
- @include constrain_wide;
- @include breakpoint(alpha) {
- display: flex;
- flex-direction: row;
- width: calc(100% + 30px);
- .popular {
- margin-left: 30px;
- }
- }
-}
-.archive-grid-card {
- //container object for cards (usually an article tag)
- a {
- text-decoration: none;
- }
-}
-.archive-grid-card-simple {
- //container object for cards with no dek
- line-height: 1;
- margin-bottom: 1.4rem;
-}
-.related {
- //special rules for related post grid
- //on detail pages in jrnl and src
- ul {
- list-style-type: none;
- padding: 0;
- }
- .card-hed {
- text-align: center;
- @include fancy_sans;
- @include fontsize(20);
- margin: 1rem auto .25rem;
- }
- .card-smcap {
- text-align: center;
- }
-}
-//}}}
-//************** archive cards **********************************{{{
-.card-smcaps, .post-smcaps {
- // formats date and location lines as small caps
- @include smcaps;
- @include fontsize(13);
- font-weight: bold;
- margin: 0;
- color: $body_font_light;
-}
-.card-hed {
- // main headline of the card
- @include fontsize(32);
- color: darken($body_font_light,15);
- margin: 0;
- line-height: 1;
-}
-.card-hed-it {
- // italic variant of card hed
- // used on jrnl archives
- @include fontsize(26);
- line-height: 1.3;
- font-style: italic;
- margin: .25rem 0 .5rem;
-
-}
-.card-hed-smit {
- // smaller italic variant of card hed
- // used on homepage
- @include fontsize(22);
- line-height: 1.3;
- font-style: italic;
- margin: .25rem 0 .5rem;
-
-}
-.card-hed-btm {
- // hed with a little bottom margin
- // used in book list
- margin-bottom: .5rem;
-}
-.card-image-sm {
- // smaller card image
- // used on homepage
- max-height: 180px;
- overflow: hidden;
- margin-bottom: .5rem;
- img {
- margin-top: -20%;
- }
-}
-.card-image-tiny {
- // even smaller card image used for
- // related posts on detail pages
- max-height: 120px;
- overflow: hidden;
- margin-bottom: .5rem;
- img {
- width: 100%;
- margin-top: -20%;
- }
-}
-.card-lede {
- // subtitle or lede
- @include fontsize(20);
- color: darken($body_font_light,5);
- font-style: italic;
- line-height: 1.6;
- margin: 0;
-}
-.card-dek {
- // used for p test on jrnl page and elsewhere
- @include fontsize(16);
- line-height: 1.6;
- margin: 0 0 .5rem;
-}
-.card-stars {
- // ratings on books
- @include fontsize(16);
- display: block;
-}
-.read-in {
- // makes read in date in books look good
- display: block;
-}
-.circle-img-wrapper {
- // small images next to archive lists
- border-radius: 50%;
- width: 106px;
- height: 106px;
- overflow: hidden;
- float: left;
- border: 3px solid #666;
- img {
- width: 160px;
- max-width: 160px;
- }
- @include breakpoint(beta) {
- margin-left: -128px;
- margin-top: -2px;
- }
-}
-//}}}
-//************** header, dateline and expanding map **************{{{
-.post-header {
- @include constrain_narrow;
- color: #555;
- padding-bottom: 2.6rem;
- margin-bottom: 2.6rem;
- border-bottom: 1px solid #efefef;
- text-align: center;
- @include breakpoint(beta) {
- text-align: left;
- }
-}
-.post-linewrapper {
- border-top: 1px solid #efefef;
-}
-.post-linewrapper, .post-linewrapper h3 {
- color: lighten($secondary-link-color, 15);
- margin-top: 1rem;
- padding-top: 1rem;
- display: inline-block;
- @include smcaps;
- @include fancy_sans;
- @include fontsize(14);
- font-weight: 600;
- text-align: center;
- a {
- color: lighten($secondary-link-color, 15);
- }
- time {
- color: $secondary-link-color
- }
- @include breakpoint(beta) {
- text-align: left;
- }
-}
-.post-linewrapper h3 {
- display: inline;
-}
-.post-source {
- @include smcaps;
- @include fancy_sans;
- @include fontsize(14);
- font-weight: 600;
- margin: 0;
-}
-.map {
- width: 100vw;
- position: relative;
- left: 50%;
- right: 50%;
- margin-left: -50vw;
- margin-right: -50vw;
-}
-#detail-map-canvas {
- height: 400px;
- width: 98vw;
- position: relative;
- left: 49%;
- right: 49%;
- margin-left: -48vw;
- margin-right: -49vw;
-}
-.lttr .post-header, .lttr .post-linewrapper, .lttr .post-linewrapper h3 {
- text-align: center;
-}
-.post-title {
- letter-spacing: -1px;
- margin-bottom: .25rem;
-}
-.post-subtitle {
- @include fontsize(22);
- font-style: italic;
- line-height: 1.25;
- margin-top: 0;
- margin-bottom: 0;
- text-align: center;
- @include breakpoint(beta) {
- text-align: left;
- }
-}
-//}}}
-//************** post detail *************************************{{{
-.post-body > *:not(.picwide):not(.cluster), .post-article > *:not(.picwide):not(.cluster):not(.highlight) {
- @include constrain_narrow;
-}
-.post-body .picwide, .post-body .cluster {
- @include constrain_wide;
-}
-.post-article {
- h3 {
- @include fancy_sans;
- @include fontsize(26);
- font-weight: bold;
- }
- h4, h3 {
- margin: 3rem 0 0 0;
- line-height: 1.4;
- }
- h4+p, h3+p {
- margin-top: .125rem;
- }
- h5 {
- @include fancy_sans;
- @include fontsize(20);
- }
- ul {
- @include fontsize(22);
- list-style: circle;
- margin-left: 2.5em;
- list-style-position: outside;
- margin-bottom: 2.4em;
- }
-}
-.picwide {
- @include breakpoint(alpha) {
- }
-}
-.picwide img {
- max-width: 98%;
- @include breakpoint(alpha) {
- max-width: 100%;
- }
-}
-p + .picwide {
- margin-top: 1.75rem;
- @include breakpoint(alpha) {
- margin-top: 2.6rem;
- }
-}
-.row-2 {
- display: flex;
- flex-direction: row;
- gap: .5rem;
- * > {
- margin-left: 5px;
- }
-}
-//}}}
-//************** post footer *************************************{{{
-.entry-footer {
- @include constrain_narrow;
- border-top: 3px double #efefef;
- border-bottom: 3px double #efefef;
- margin-top: 3rem;
- padding: 2rem;
- h3 {
- font-weight: 600;
- @include smcaps;
- @include fontsize(16);
- }
- ul {
- padding: 0;
- font-size: 96%;
- list-style-type: none;
- ul {
- list-style-type: disc;
- padding-left: 2rem;
- li {
- color: $secondary-link-color;
- }
- }
- }
- @include breakpoint(gamma) {
- display: flex;
- flex-direction: row;
- ul {
- display: flex;
- flex-direction: column;
- font-size: 92%;
- }
- }
-}
-//}}}
-//************** next/previous / you might also / footnotes ******{{{
-//}}}
-//************** homepage banner and other special elements*******{{{
-.homepage-section-header {
- @include fontsize(28);
- @include fancy_sans;
-}
-.banner {
- .post-image {
- position: relative;
- max-height: 900px;
- overflow: hidden;
- }
-
- @include breakpoint(beta) {
- figcaption {
- position: absolute;
- margin: 0;
- bottom: 0;
- width: 100%;
- z-index: 100;
- background: rgba(0,0,0,0.6);
- }
- }
- .large-top-image {
- position: relative;
- max-height: 900px;
- overflow: hidden;
- max-width: 100%;
- img {
- margin: 0;
- }
- @include breakpoint(beta) {
- img {
- margin-top: -120px;
- }
- }
- }
-}
-.hero-text-wrapper {
- text-align: center;
- margin-bottom: 1rem;
- .post-title {
- @include fontsize(36);
- }
- @include breakpoint(beta) {
- color: white;
- .post-title {
- @include fontsize(42);
- margin-bottom: .5rem;
- }
- .post-subtitle, .post-date, .post-location {
- text-align: center;
- a {
- text-decoration: none;
- @include fontsize(14);
- padding: 0;
- border: none;
- }
- }
- }
- .post-date {
- display: none;
- }
- .post-linewrapper {
- border-color: #6a6a6a;
- text-align: center;
- margin-top: .25rem;
- padding-top: .25rem;
- }
- .btn {
- color: white;
- text-align: center;
- margin: .5rem auto;
- }
-}
-.homepage-bio {
- margin: 3rem auto;
- @include constrain_wide;
- @include breakpoint(alpha) {
- margin: 6rem auto;
- }
-}
-.homepage-map-img {
- @include breakpoint(alpha) {
- float: left;
- width: 350px;
- margin-right: 2rem;
- }
-}
-.homepage-next {
- margin-top: 3rem;
- @include constrain_wide;
- h5 {
- text-align: center;
- }
- a {
- @include fontsize(14);
- @include fancy_sans;
- @include smcaps;
- font-weight: 500;
- text-decoration: none;
- padding: 12px 10px 12px;
- border: $link_color 1px solid;
- &:after {
- content: "\21E2";
- margin-left: 4px;
- }
- &:hover {
- background: $link_color;
- color: white;
- }
- }
-}
-// About page
-#about-luxagraf .circle-pic {
- margin: 0 auto;
- display: block;
- @include breakpoint(gamma) {
- float: left;
- margin-left: -250px;
- }
-}
-.circle-pic {
- border-radius: 50%;
- border: 3px solid #000;
-}
-//}}}
-//A few Mailing list specific styles
-.large-top-image{
- background: #f7f7f7;
- img {
- max-width: 100%;
- margin: 4rem 0;
- }
-}
-.list-hed{
- @include fontsize(32);
-}
-.list-subhed {
- @include fontsize(26);
- font-style: italic;
- margin-bottom: 0;
-
-}
-//
-.section {
- margin-top: 6rem;
-}
-