.sticky { display: block; } .sticky-post { background: $color__background-button; color: #fff; display: inline-block; font-weight: bold; line-height: 1; padding: .25rem; position: absolute; text-transform: uppercase; top: -$size__spacing-unit; z-index: 1; } .updated:not(.published) { display: none; } .page-links { clear: both; margin: 0 0 calc(1.5 * #{$size__spacing-unit}); } .entry { margin-top: calc(6 * #{$size__spacing-unit}); &:first-of-type { margin-top: 0; } .entry-header { margin: calc(3 * #{ $size__spacing-unit}) $size__spacing-unit $size__spacing-unit; position: relative; @include media(tablet) { margin: calc(3 * #{ $size__spacing-unit}) $size__site-margins $size__spacing-unit; } } .entry-title { @include post-section-dash; margin: 0; a { color: inherit; &:hover { color: $color__text-hover; } } } .entry-meta, .entry-footer { color: $color__text-light; font-weight: 500; > span { margin-right: $size__spacing-unit; display: inline-block; &:last-child { margin-right: 0; } } a { @include link-transition; color: currentColor; &:hover { text-decoration: none; color: $color__link; } } .svg-icon { position: relative; display: inline-block; vertical-align: middle; margin-right: 0.5em; } } .entry-meta { margin: $size__spacing-unit 0; } .entry-footer { margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit $size__spacing-unit; @include media(tablet) { margin: $size__spacing-unit $size__site-margins calc(3 * #{$size__spacing-unit}); max-width: $size__site-tablet-content; } @include media(tablet) { max-width: $size__site-desktop-content; } } .post-thumbnail { margin: $size__spacing-unit; @include media(tablet) { margin: $size__spacing-unit $size__site-margins; } &:focus { outline: none; } .post-thumbnail-inner { display: block; img { position: relative; display: block; width: 100%; } } } .image-filters-enabled & { .post-thumbnail { position: relative; display: block; .post-thumbnail-inner { filter: grayscale(100%); &:after { background: rgba(0, 0, 0, 0.35); content: ""; display: block; height: 100%; opacity: .5; pointer-events: none; position: absolute; top: 0; width: 100%; z-index: 4; @supports (mix-blend-mode: multiply) { display: none; } } } &:before, &:after { position: absolute; display: block; width: 100%; height: 100%; top: 0; left: 0; content: "\020"; pointer-events: none; } @include filter-duotone; } } .entry-content, .entry-summary { max-width: calc(100% - (2 * #{ $size__spacing-unit })); margin: 0 $size__spacing-unit; @include media(tablet) { max-width: 80%; margin: 0 10%; padding: 0 60px; } } .entry-content { p { word-wrap: break-word; } .more-link { @include link-transition; display: inline; color: inherit; &:after { content: "\02192"; display: inline-block; margin-left: 0.5em; } &:hover { color: $color__link; text-decoration: none; } } a { text-decoration: underline; &.button, &:hover { text-decoration: none; } &.button { display: inline-block; } &.button:hover { background: $color__background-button-hover; color: $color__background-body; cursor: pointer; } } // Overwrite iframe embeds that have inline styles. > iframe[style] { margin: 32px 0 !important; max-width: 100% !important; @include media(tablet) { max-width: $size__site-tablet-content !important; } @include media(desktop) { max-width: $size__site-desktop-content !important; } } // Page links .page-links a { margin: calc(0.5 * #{$size__spacing-unit}); text-decoration: none; } // Classic editor audio embeds. .wp-audio-shortcode { max-width: calc(100vw - (2 * #{ $size__spacing-unit })); @include media(tablet) { max-width: $size__site-tablet-content; } @include media(desktop) { max-width: $size__site-desktop-content; } } } } /* Author description */ .author-bio { margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit $size__spacing-unit; @include postContentMaxWidth(); @include media(tablet) { margin: calc(3 * #{$size__spacing-unit}) $size__site-margins; } @include media(desktop) { margin: calc(3 * #{$size__spacing-unit}) $size__site-margins; } .author-title { @include post-section-dash; display: inline; } .author-description { display: inline; color: $color__text-light; font-size: $font__size-md; line-height: $font__line-height-heading; .author-link { display: inline-block; &:hover { color: $color__link-hover; text-decoration: none; } } } }