blocks/_blocks.scss000066600000047663152133444760010367 0ustar00/* !Block styles */ // Default block margin and alignment rules. // These are replicated inside of the Group block // so that child blocks in there appear the same way. .entry .entry-content > *, .entry .entry-summary > *, .entry .entry-summary > .wp-block-group > .wp-block-group__inner-container > *, .entry .entry-content > .wp-block-group > .wp-block-group__inner-container > * { margin: 32px 0; max-width: 100%; @include postContentMaxWidth(); @include media(tablet) { margin: 32px 0; } &.alignwide { margin-left: auto; margin-right: auto; clear: both; @include media(tablet) { width: 100%; max-width: 100%; } } &.alignfull { position: relative; left: -#{$size__spacing-unit }; width: calc( 100% + (2 * #{$size__spacing-unit})); max-width: calc( 100% + (2 * #{$size__spacing-unit})); clear: both; @include media(tablet) { margin-top: calc(2 * #{$size__spacing-unit}); margin-bottom: calc(2 * #{$size__spacing-unit}); left: calc( -12.5% - 75px ); width: calc( 125% + 150px ); max-width: calc( 125% + 150px ); } } &.alignleft { /*rtl:ignore*/ float: left; max-width: calc(5 * (100vw / 12)); margin-top: 0; margin-left: 0; /*rtl:ignore*/ margin-right: $size__spacing-unit; @include media(tablet) { max-width: calc(4 * (100vw / 12)); /*rtl:ignore*/ margin-right: calc(2 * #{$size__spacing-unit}); } } &.alignright { /*rtl:ignore*/ float: right; max-width: calc(5 * (100vw / 12)); margin-top: 0; margin-right: 0; /*rtl:ignore*/ margin-left: $size__spacing-unit; @include media(tablet) { max-width: calc(4 * (100vw / 12)); margin-right: 0; /*rtl:ignore*/ margin-left: calc(2 * #{$size__spacing-unit}); } } &.aligncenter { margin-left: auto; margin-right: auto; @include postContentMaxWidth(); @include media(tablet) { margin-left: 0; margin-right: 0; } } } .entry .entry-content > *, .entry .entry-summary > * { > *:first-child { margin-top: 0; } > *:last-child { margin-bottom: 0; } } /* * Unset nested content selector styles * - Prevents layout styles from cascading too deeply * - helps with plugin compatibility */ .entry .entry-content, .entry .entry-summary { .entry-content, .entry-summary, .entry { margin: inherit; max-width: inherit; padding: inherit; @include media(tablet) { margin: inherit; max-width: inherit; padding: inherit; } } } .entry .entry-content { //! Paragraphs p.has-background { padding: 20px 30px; } //! Audio .wp-block-audio { width: 100%; audio { width: 100%; } &.alignleft audio, &.alignright audio { max-width: (0.33 * $mobile_width); @include media(tablet) { max-width: (0.5 * $tablet_width); } @include media(wide) { max-width: (0.33 * $desktop_width); } } } //! Video .wp-block-video { video { width: 100%; } } //! Button .wp-block-button { .wp-block-button__link { @include button-transition; border: none; font-size: $font__size-sm; @include font-family( $font__heading ); line-height: $font__line-height-heading; box-sizing: border-box; font-weight: bold; text-decoration: none; padding: ($size__spacing-unit * .76) $size__spacing-unit; outline: none; outline: none; &:not(.has-background) { background-color: $color__background-button; } &:not(.has-text-color) { color: white; } &:hover { color: white; background: $color__background-button-hover; cursor: pointer; } &:focus { color: white; background: $color__background-button-hover; outline: thin dotted; outline-offset: -4px; } } &:not(.is-style-squared) .wp-block-button__link { border-radius: 5px; } &.is-style-outline .wp-block-button__link, &.is-style-outline .wp-block-button__link:focus, &.is-style-outline .wp-block-button__link:active { @include button-all-transition; border-width: 2px; border-style: solid; &:not(.has-background) { background: transparent; } &:not(.has-text-color) { color: $color__background-button; border-color: currentColor; } } &.is-style-outline .wp-block-button__link:hover { color: white; border-color: $color__background-button-hover; &:not(.has-background) { color: $color__background-button-hover; } } } //! Latest posts, categories, archives .wp-block-archives, .wp-block-categories, .wp-block-latest-posts { padding: 0; list-style: none; li > a { @include font-family( $font__heading ); font-size: calc(#{$font__size_base} * #{$font__size-ratio}); font-weight: bold; line-height: $font__line-height-heading; text-decoration: none; } } .wp-block-archives, .wp-block-categories { &.aligncenter { text-align: center; } } //! Latest categories .wp-block-categories { ul { padding-top: ( .75 * $size__spacing-unit ); } li ul { list-style: none; padding-left: 0; } @include nestedSubMenuPadding(); } //! Latest posts .wp-block-latest-posts { .wp-block-latest-posts__post-date { @include font-family( $font__heading ); font-size: $font__size-xs; color: $color__text-light; line-height: 1.2; } .wp-block-latest-posts__post-full-content, .wp-block-latest-posts__post-excerpt { margin-top: $size__spacing-unit; margin-bottom: $size__spacing-unit; } li { padding-bottom: ( .5 * $size__spacing-unit ); &.menu-item-has-children, &:last-child { padding-bottom: 0; } :not(:last-child) .wp-block-latest-posts__post-excerpt { padding-bottom: ( .5 * $size__spacing-unit ); } } &.is-grid li { border-top: 2px solid $color__border; padding-top: (1 * $size__spacing-unit); margin-bottom: (2 * $size__spacing-unit); a { &:after { content: ''; } } &:last-child { margin-bottom: auto; a:after { content: ''; } } } } //! Latest preformatted text .wp-block-preformatted { font-size: $font__size-xs; line-height: 1.8; padding: $size__spacing-unit; } //! Verse .wp-block-verse { @include font-family( $font__body ); font-size: $font__size_base; line-height: 1.8; } //! Paragraphs .has-drop-cap { &:not(:focus):first-letter { @include font-family( $font__heading ); font-size: $font__size-xxxl; line-height: 1; font-weight: bold; margin: 0 0.25em 0 0; } } //! Pullquote .wp-block-pullquote { border-color: transparent; border-width: 2px; padding: $size__spacing-unit; blockquote { color: $color__text-main; border: none; margin-top: calc(4 * #{ $size__spacing-unit}); margin-bottom: calc(4.33 * #{ $size__spacing-unit}); margin-right: 0; padding-left: 0; } p { font-size: $font__size-lg; font-style: italic; line-height: 1.3; margin-bottom: 0.5em; margin-top: 0.5em; em { font-style: normal; } @include media(tablet) { font-size: $font__size-xl; } } cite { display: inline-block; @include font-family( $font__heading ); line-height: 1.6; text-transform: none; color: $color__text-light; /* * This requires a rem-based font size calculation instead of our normal em-based one, * because the cite tag sometimes gets wrapped in a p tag. This is equivalent to $font-size_xs. */ font-size: calc(1rem / (1.25 * #{$font__size-ratio})); } &.alignleft, &.alignright { width: 100%; padding: 0; blockquote { margin: $size__spacing-unit 0; padding: 0; text-align: left; max-width: 100%; p:first-child { margin-top: 0; } } } &.is-style-solid-color { background-color: $color__link; padding-left: 0; padding-right: 0; @include media(tablet) { padding-left: 10%; padding-right: 10%; } p { font-size: $font__size-lg; line-height: 1.3; margin-bottom: 0.5em; margin-top: 0.5em; @include media(tablet) { font-size: $font__size-xl; } } a { color: $color__background-body; } cite { color: inherit; } blockquote { max-width: 100%; color: $color__background-body; padding-left: 0; margin-left: $size__spacing-unit; margin-right: $size__spacing-unit; &.has-text-color p, &.has-text-color a, &.has-primary-color, &.has-secondary-color, &.has-dark-gray-color, &.has-light-gray-color, &.has-white-color { color: inherit; } @include media(tablet) { margin-left: 0; margin-right: 0; } } &.alignright, &.alignleft { @include media(tablet) { padding: $size__spacing-unit calc(2 * #{$size__spacing-unit}); } } &.alignfull { @include media(tablet) { padding-left: calc(10% + 58px + (2 * #{$size__spacing-unit})); padding-right: calc(10% + 58px + (2 * #{$size__spacing-unit})); } } } } //! Blockquote .wp-block-quote { &:not(.is-large), &:not(.is-style-large) { border-width: 2px; border-color: $color__link; padding-top: 0; padding-bottom: 0; } p { font-size: 1em; font-style: normal; line-height: 1.8; } cite { /* * This requires a rem-based font size calculation instead of our normal em-based one, * because the cite tag sometimes gets wrapped in a p tag. This is equivalent to $font-size_xs. */ font-size: calc(1rem / (1.25 * #{$font__size-ratio})); } &.is-large, &.is-style-large { margin: $size__spacing-unit 0; padding: 0; border-left: none; p { font-size: $font__size-lg; line-height: 1.4; font-style: italic; } cite, footer { /* * This requires a rem-based font size calculation instead of our normal em-based one, * because the cite tag sometimes gets wrapped in a p tag. This is equivalent to $font-size_xs. */ font-size: calc(1rem / (1.25 * #{$font__size-ratio})); } @include media(tablet) { margin: $size__spacing-unit 0; padding: $size__spacing-unit 0; p { font-size: $font__size-lg; } } } } //! Image .wp-block-image { max-width: 100%; img { display: block; } // If an image does not have a left/center/right alignment, // it's a direct child of .wp-block-img. If it has no other // alignment added, we want to make sure the image does not // extend beyond the width of the text column. &:not(.alignwide):not(.alignfull) > img { @include postContentMaxWidth(); } .aligncenter { @include postContentMaxWidth(); @include media(tablet) { margin: 0; width: $size__site-tablet-content; img { margin: 0 auto; } } @include media(desktop) { width: $size__site-desktop-content; img { margin: 0 auto; } } } &.alignfull img { width: 100vw; max-width: calc( 100% + (2 * #{$size__spacing-unit})); @include media(tablet) { max-width: calc( 125% + 150px ); margin-left: auto; margin-right: auto; } } } //! Cover Image .wp-block-cover-image, .wp-block-cover { position: relative; min-height: 430px; padding: $size__spacing-unit; @include media(tablet) { padding: $size__spacing-unit 10%; } .wp-block-cover-image-text, .wp-block-cover-text, h2 { @include font-family( $font__heading ); font-size: $font__size-lg; font-weight: bold; line-height: 1.25; padding: 0; color: #fff; @include media(tablet) { font-size: $font__size-xl; max-width: 100%; } } &.alignleft, &.alignright { width: 100%; @include media(tablet) { padding: $size__spacing-unit calc(2 * #{$size__spacing-unit}); } } &.alignfull { .wp-block-cover-image-text, .wp-block-cover-text, h2 { @include postContentMaxWidth(); } @include media(tablet) { padding-left: calc(10% + 58px + (2 * #{$size__spacing-unit})); padding-right: calc(10% + 58px + (2 * #{$size__spacing-unit})); .wp-block-cover-image-text, .wp-block-cover-text, h2 { padding: 0; } } } } //! Galleries .wp-block-gallery { list-style-type: none; padding-left: 0; .blocks-gallery-image:last-child, .blocks-gallery-item:last-child { margin-bottom: 16px; } figcaption a { color: #fff; } } //! Captions .wp-block-audio figcaption, .wp-block-video figcaption, .wp-block-image figcaption, .wp-block-gallery .blocks-gallery-image figcaption, .wp-block-gallery .blocks-gallery-item figcaption { font-size: $font__size-xs; @include font-family( $font__heading ); line-height: $font__line-height-pre; margin: 0; padding: ( $size__spacing-unit * .5 ); text-align: center; } //! Separator .wp-block-separator, hr { background-color: $color__text-light; border: 0; height: 2px; margin-bottom: (2 * $size__spacing-unit); margin-top: (2 * $size__spacing-unit); max-width: 2.25em; text-align: left; &.is-style-wide { max-width: 100%; @include postContentMaxWidth(); } &.is-style-dots { max-width: 100%; @include postContentMaxWidth(); background-color: inherit; border: inherit; height: inherit; text-align: center; // Only apply the default dot color if there's no separator color specified. &:not(.has-text-color):not(.has-background) { color: $color__text-light; } &:before { font-size: $font__size-lg; letter-spacing: $font__size-sm; padding-left: $font__size-sm; } } /* Remove duplicate rule-line when a separator * is followed by an H1, or H2 */ & + h1, & + h2 { &:before { display: none; } } } //! Twitter Embed .wp-block-embed-twitter { word-break: break-word; } //! Table .wp-block-table { th, td { border-color: $color__text-light; } } //! File .wp-block-file { @include font-family( $font__heading ); .wp-block-file__button { display: table; @include button-transition; border: none; border-radius: 5px; background: $color__background-button; font-size: $font__size-base; @include font-family( $font__heading ); line-height: $font__line-height-heading; text-decoration: none; font-weight: bold; padding: ($size__spacing-unit * .75) $size__spacing-unit; color: #fff; margin-left: 0; margin-top: calc(0.75 * #{$size__spacing-unit}); @include media(desktop) { font-size: $font__size-base; padding: ($size__spacing-unit * .875) ($size__spacing-unit * 1.5); } &:hover { background: $color__background-button-hover; cursor: pointer; } &:focus { background: $color__background-button-hover; outline: thin dotted; outline-offset: -4px; } } } //! Code .wp-block-code { border-radius: 0; code { font-size: $font__size-md; white-space: pre-wrap; word-break: break-word; } } //! Columns .wp-block-columns { .wp-block-column > * { &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } // Ensure images do not expand beyond the column. .wp-block-image > img:not(.alignwide):not(.alignfull), .wp-block-image > figure { @include media(tablet) { max-width: 100%; } @include media(desktop) { max-width: 100%; } } @include media(tablet) { flex-wrap: nowrap; .wp-block-column:not(:first-child) { margin-left: 32px; } } } //! Group .wp-block-group { // When the Group block is standard/wide, we need to prevent full-aligned // child blocks from expanding out of their container. &:not(.alignfull) > .wp-block-group__inner-container > .alignfull, &:not(.alignfull) > .wp-block-group__inner-container > .wp-block-image > img { @include media(tablet) { left: 0; max-width: 100%; } } // The full-width Group block's inner container should mimic .entry-content styles. &.alignfull > .wp-block-group__inner-container { 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; } } // Group block with a colored background. &.has-background { padding: $size__spacing-unit; margin-top: 0; margin-bottom: 0; // Remove the top and bottom margins of inner blocks. .wp-block-group__inner-container { > *:first-child { margin-top: 0; } > *:last-child { margin-bottom: 0; } } // If the Group block is full-width, it does not need this extra padding. &.alignfull { padding-left: 0; padding-right: 0; @include media(tablet) { padding-top: $size__spacing-unit; padding-bottom: $size__spacing-unit; } } // Full-aligned child blocks should take up the maximum width available in their container. &:not(.alignfull) > .wp-block-group__inner-container > .alignfull { width: 100%; max-width: 100%; @include media(tablet) { width: calc( 100% + #{$size__spacing-unit * 2} ); max-width: calc( 100% + #{$size__spacing-unit * 2} ); margin-left: -#{$size__spacing-unit}; } } } } //! Latest Comments .wp-block-latest-comments { .wp-block-latest-comments__comment-meta { @include font-family( $font__heading ); font-weight: bold; .wp-block-latest-comments__comment-date { font-weight: normal; } } .wp-block-latest-comments__comment, .wp-block-latest-comments__comment-date, .wp-block-latest-comments__comment-excerpt p { font-size: inherit; } &.has-avatars { } &.has-dates { .wp-block-latest-comments__comment-date { font-size: $font__size-xs; } } &.has-excerpts { } } //! Font Sizes .has-small-font-size { font-size: $font__size-sm; } .has-normal-font-size { font-size: $font__size-md; } .has-large-font-size { font-size: $font__size-lg; } .has-huge-font-size { font-size: $font__size-xl; } //! Custom background colors .has-primary-background-color, .has-secondary-background-color, .has-dark-gray-background-color, .has-light-gray-background-color { // Use white text against these backgrounds by default. color: $color__background-body; > p, > h1, > h2, > h3, > h4, > h5, > h6, > a { color: $color__background-body; } } .has-white-background-color { color: $color__text-main; // Use dark gray text against this background by default. > p, > h1, > h2, > h3, > h4, > h5, > h6, > a { color: $color__text-main; } } .has-primary-background-color, .wp-block-pullquote.is-style-solid-color.has-primary-background-color { background-color: $color__link; } .has-secondary-background-color, .wp-block-pullquote.is-style-solid-color.has-secondary-background-color { background-color: $color__border-link-hover; } .has-dark-gray-background-color, .wp-block-pullquote.is-style-solid-color.has-dark-gray-background-color { background-color: $color__text-main; } .has-light-gray-background-color, .wp-block-pullquote.is-style-solid-color.has-light-gray-background-color { background-color: $color__text-light; } .has-white-background-color, .wp-block-pullquote.is-style-solid-color.has-white-background-color { background-color: #FFF; } //! Custom foreground colors .has-primary-color, .wp-block-pullquote blockquote.has-primary-color, .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color, .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color > p { color: $color__link; } .has-secondary-color, .wp-block-pullquote blockquote.has-secondary-color, .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color, .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color > p { color: $color__border-link-hover; } .has-dark-gray-color, .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color, .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color > p { color: $color__text-main; } .has-light-gray-color, .wp-block-pullquote blockquote.has-light-gray-color, .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color, .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color > p { color: $color__text-light; } .has-white-color, .wp-block-pullquote blockquote.has-white-color, .wp-block-pullquote.is-style-solid-color blockquote.has-white-color { color: #FFF; } } site/_site.scss000066600000001614152133444760007527 0ustar00 /*-------------------------------------------------------------- ## Header --------------------------------------------------------------*/ @import "header/site-header"; @import "header/site-featured-image"; /*-------------------------------------------------------------- ## Posts and pages --------------------------------------------------------------*/ @import "primary/posts-and-pages"; /*-------------------------------------------------------------- ## Comments --------------------------------------------------------------*/ @import "primary/comments"; /*-------------------------------------------------------------- ## Archives --------------------------------------------------------------*/ @import "primary/archives"; /*-------------------------------------------------------------- ## Footer --------------------------------------------------------------*/ @import "footer/site-footer"; site/secondary/_widgets.scss000066600000002700152133444760012215 0ustar00.widget { margin: 0 0 #{$size__spacing-unit}; /* Make sure select elements fit in widgets. */ select { max-width: 100%; } a { color: $color__link; &:hover { color: $color__link-hover; } } } .widget_archive, .widget_categories, .widget_meta, .widget_nav_menu, .widget_pages, .widget_recent_comments, .widget_recent_entries, .widget_rss { ul { padding: 0; list-style: none; li { color: $color__text-light; @include font-family( $font__heading ); font-size: calc(#{$font__size_base} * #{$font__size-ratio}); font-weight: 700; line-height: $font__line-height-heading; margin-top: #{0.5 * $size__spacing-unit}; margin-bottom: #{0.5 * $size__spacing-unit}; } @include nestedSubMenuPadding(); } } .widget_tag_cloud { .tagcloud { @include font-family( $font__heading ); font-weight: 700; } } .widget_search { .search-field { width: 100%; @include media(mobile) { width: auto; } } .search-submit { display: block; margin-top: $size__spacing-unit; } } .widget_calendar .calendar_wrap { text-align: center; table td, table th { border: none; } a { text-decoration: underline; } .wp-calendar-table { margin-bottom: 0; } .wp-calendar-nav { margin: 0 0 $size__spacing-unit; display: table; width: 100%; @include font-family( $font__heading ); span { display: table-cell; padding: 0.5em; } } .wp-calendar-nav-prev, .wp-calendar-nav-next { width: 40%; } }site/header/_site-featured-image.scss000066600000013623152133444760013637 0ustar00// Featured image styles .site-header.featured-image { /* Hide overflow for overflowing featured image */ overflow: hidden; /* Need relative positioning to properly align layers. */ position: relative; /* Add text shadow to text, to increase readability. */ text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35); /* Set white text color when featured image is set. */ .site-branding .site-title, .site-branding .site-description, .main-navigation a:after, .main-navigation .main-menu > li.menu-item-has-children:after, .main-navigation li, .social-navigation li, .entry-meta, .entry-title { color: $color__background-body; } .main-navigation a, .main-navigation a + svg, .social-navigation a, .site-title a, .site-featured-image a { color: $color__background-body; transition: opacity $link_transition ease-in-out; &:hover, &:active, &:hover + svg, &:active + svg { color: $color__background-body; opacity: 0.6; } &:focus, &:focus + svg { color: $color__background-body; } } .main-navigation .sub-menu a { opacity: inherit; } /* add focus state to social media icons */ .social-navigation a { &:focus { color: $color__background-body; opacity: 1; border-bottom: 1px solid $color__background-body; } } .social-navigation svg, .site-featured-image svg { /* Use -webkit- only if supporting: Chrome < 54, iOS < 9.3, Android < 4.4.4 */ -webkit-filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35) ); filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35) ); } /* Entry header */ .site-featured-image { /* First layer: grayscale. */ .post-thumbnail img { height: auto; left: 50%; max-width: 1000%; min-height: 100%; min-width: 100vw; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%); width: auto; z-index: 1; @supports ( object-fit: cover ) { height: 100%; left: 0; object-fit: cover; top: 0; transform: none; width: 100%; } /* When image filters are active, make it grayscale to colorize it blue. */ .image-filters-enabled & { filter: grayscale(100%); } } .entry-header { margin-top: calc( 4 * #{$size__spacing-unit}); margin-bottom: 0; margin-left: 0; margin-right: 0; @include media (tablet) { margin-left: $size__site-margins; margin-right: $size__site-margins; } .entry-title { &:before { background: $color__background-body; } } /* Entry meta */ .entry-meta { 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; } } .svg-icon { position: relative; display: inline-block; vertical-align: middle; margin-right: 0.5em; } .discussion-avatar-list { display: none; } } &.has-discussion { @include media (tablet) { .entry-meta { display: flex; position: relative; } .entry-title { padding-right: calc(1 * (100vw / 12) + #{$size__spacing-unit}); } .entry-meta .comment-count { position: absolute; right: 0; } .entry-meta .discussion-avatar-list { display: block; position: absolute; bottom: 100%; } } } } } /* Custom Logo Link */ .custom-logo-link { background: $color__background-body; box-shadow: 0 0 0 0 rgba($color__background-body, 0); &:hover, &:active, &:focus { box-shadow: 0 0 0 2px rgba($color__background-body, 1); } } /* Make sure important elements are above pseudo elements used for effects. */ .site-branding { position: relative; z-index: 10; } .site-featured-image .entry-header { position: relative; z-index: 9; } /* Set up image filter layer positioning */ .site-branding-container:after, .site-featured-image:before, .site-featured-image:after, &:after { display: block; position: absolute; top: 0; left: 0; content: "\020"; width: 100%; height: 100%; } /* Background & Effects */ /* Shared background settings between pseudo elements. */ background-position: center; background-repeat: no-repeat; background-size: cover; /* The intensity of each blend mode is controlled via layer opacity. */ /* Second layer: screen. */ .image-filters-enabled & .site-featured-image:before { background: $color__link; mix-blend-mode: screen; opacity: 0.1; } /* Third layer: multiply. */ /* When image filters are inactive, a black overlay is added. */ .site-featured-image:after { background: #000; mix-blend-mode: multiply; opacity: .7; /* When image filters are active, a blue overlay is added. */ .image-filters-enabled & { background: $color__link; opacity: .8; z-index: 3; /* Browsers supporting mix-blend-mode don't need opacity < 1 */ @supports (mix-blend-mode: multiply) { opacity: 1; } } } /* Fourth layer: overlay. */ .image-filters-enabled & .site-branding-container:after { background: rgba(0, 0, 0, 0.35); mix-blend-mode: overlay; opacity: 0.5; z-index: 4; /* Browsers supporting mix-blend-mode can have a light overlay */ @supports (mix-blend-mode: overlay) { background: rgba($color__background-body, 0.35); } } /* Fifth layer: readability overlay */ &:after { background: #000; /** * Add a transition to the readability overlay, to add a subtle * but smooth effect when resizing the screen. */ transition: opacity 1200ms ease-in-out; opacity: 0.7; z-index: 5; /* When image filters are active, a blue overlay is added. */ .image-filters-enabled & { background: mix($color__link, black, 12%); opacity: 0.38; @include media(tablet) { opacity: 0.18; } } } ::-moz-selection { background: rgba($color__background-body, 0.17); } ::selection { background: rgba($color__background-body, 0.17); } } site/header/_site-header.scss000066600000004055152133444760012207 0ustar00// Site header .site-header { padding: 1em; &.featured-image { display: flex; flex-direction: column; justify-content: space-between; min-height: 90vh; .site-branding-container { margin-bottom: auto; } } @include media(tablet) { margin: 0; padding: 3rem 0; &.featured-image { min-height: 100vh; margin-bottom: 3rem; } } } // Site branding .site-branding { color: $color__text-light; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; position: relative; word-wrap: break-word; @include media(tablet) { margin: 0 $size__site-margins; } } // Site logo .site-logo { position: relative; z-index: 999; margin-bottom: calc(.66 * #{$size__spacing-unit}); @include media(tablet) { margin-bottom: 0; position: absolute; right: calc(100% + (1.25 * #{$size__spacing-unit})); top: 4px; // Accounts for box-shadow widths z-index: 999; } .custom-logo-link { border-radius: 100%; box-sizing: content-box; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); display: block; width: 50px; height: 50px; overflow: hidden; transition: box-shadow $background_transition ease-in-out; .custom-logo { min-height: inherit; } &:hover, &:active, &:focus { box-shadow: 0 0 0 2px rgba(0, 0, 0, 1); } @include media(tablet) { width: 64px; height: 64px; } } } // Site title .site-title { margin: auto; display: inline; color: $color__text-main; a { color: $color__text-main; &:link, &:visited { color: $color__text-main; } &:hover { color: $color__text-hover; } } .featured-image & { margin: 0; @include media(tablet) { display: inline-block; } } /* When there is no description set, make sure navigation appears below title. */ + .main-navigation { display: block; } @include media(tablet) { display: inline; } &:not(:empty) + .site-description:not(:empty):before { content: "\2014"; margin: 0 .2em; } } // Site description .site-description { display: inline; color: $color__text-light; font-weight: normal; margin: 0; } site/primary/_archives.scss000066600000002227152133444760012053 0ustar00.archive .page-header, .search .page-header, .error404 .page-header { margin: $size__spacing-unit $size__spacing-unit calc(3 * #{$size__spacing-unit}); @include media(tablet) { margin: 0 $size__site-margins calc(3 * #{$size__spacing-unit}); } .page-title { color: $color__text-light; display: inline; letter-spacing: normal; &:before { display: none; } } .search-term, .page-description { display: inherit; clear: both; } } .archive .page-header .page-description, .search .page-header .page-description { display: block; color: $color__text-main; font-size: 1em; } .hfeed .entry .entry-header { @include media(tablet) { margin: calc(3 * #{$size__spacing-unit}) $size__site-margins calc(#{ $size__spacing-unit } / 2); } } /* 404 & Not found */ .error-404.not-found, .no-results.not-found { .page-content { margin: calc(3 * #{$size__spacing-unit}) #{$size__spacing-unit}; @include media(tablet) { margin: calc(3 * #{$size__spacing-unit}) $size__site-margins calc(#{ $size__spacing-unit } / 2); } } .search-submit { vertical-align: middle; margin: $size__spacing-unit 0; } .search-field { width: 100%; } } site/primary/_posts-and-pages.scss000066600000011507152133444760013255 0ustar00.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; } } } } site/primary/_comments.scss000066600000014361152133444760012076 0ustar00.comment-content a { word-wrap: break-word; } .bypostauthor { display: block; } .comments-area { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit; word-wrap: break-word; @include postContentMaxWidth(); @include media(tablet) { margin: calc(3 * #{$size__spacing-unit}) $size__site-margins; } & > * { margin-top: calc(2 * #{$size__spacing-unit}); margin-bottom: calc(2 * #{$size__spacing-unit}); @include media(tablet) { margin-top: calc(3 * #{$size__spacing-unit}); margin-bottom: calc(3 * #{$size__spacing-unit}); } } /* Add extra margin when the comments section is located immediately after the * post itself (this happens on pages). */ .entry + & { margin-top: calc(3 * #{$size__spacing-unit}); } .comments-title-wrap { @include media(tablet) { align-items: baseline; display: flex; justify-content: space-between; } .comments-title { @include post-section-dash; margin: 0; @include media(tablet) { flex: 1 0 calc(3 * (100vw / 12)); } } .discussion-meta { @include media(tablet) { flex: 0 0 calc(2 * (100vw / 12)); margin-left: #{$size__spacing-unit}; } } } } #comment { max-width: 100%; box-sizing: border-box; } #respond { position: relative; .comment-user-avatar { margin: $size__spacing-unit 0 -#{$size__spacing-unit}; } .comment .comment-form { padding-left: 0; } > small { display: block; font-size: $font__size_base; position: absolute; left: calc(#{$size__spacing-unit} + 100%); top: calc(-3.5 * #{$size__spacing-unit}); width: calc(100vw / 12 ); } } #comments { > .comments-title:last-child { display: none; } } .comment-form-flex { display: flex; flex-direction: column; .comments-title { display: none; margin: 0; order: 1; } #respond { order: 2; + .comments-title { display: block; } } } .comment-list { list-style: none; padding: 0; .children { margin: 0; padding: 0 0 0 $size__spacing-unit; } > .comment:first-child { margin-top: 0; } .pingback, .trackback { .comment-body { color: $color__text-light; @include font-family( $font__heading ); font-size: $font__size-xs; font-weight: 500; margin-top: $size__spacing-unit; margin-bottom: $size__spacing-unit; a:not(.comment-edit-link) { font-weight: bold; font-size: $font__size-base / (1 * $font__size-ratio); line-height: 1.5; padding-right: #{0.5 * $size__spacing-unit}; display: block; } .comment-edit-link { color: $color__text-light; @include font-family( $font__heading ); font-weight: 500; } } } } .comment-reply { #respond + & { display: none; } .comment-reply-link { display: inline-block; } } .comment { list-style: none; position: relative; @include media(tablet) { padding-left: calc(.5 * (#{$size__spacing-unit} + calc(100vw / 12 ))); &.depth-1, .children { padding-left: 0; } &.depth-1 { margin-left: calc(3.25 * #{$size__spacing-unit}); } } .comment-body { margin: calc(2 * #{$size__spacing-unit}) 0 0; } .comment-meta { position: relative; } .comment-author { .avatar { float: left; margin-right: $size__spacing-unit; position: relative; @include media(tablet) { float: inherit; margin-right: inherit; position: absolute; top: 0; right: calc(100% + #{$size__spacing-unit}); } } .fn { position: relative; display: block; a { color: inherit; &:hover { color: $color__link-hover; } } } .post-author-badge { border-radius: 100%; display: block; height: 18px; position: absolute; background: lighten( $color__link, 8% ); right: calc(100% - #{$size__spacing-unit * 2.5}); top: -3px; width: 18px; @include media(tablet) { right: calc(100% + #{$size__spacing-unit * .75}); } svg { width: inherit; height: inherit; display: block; fill: white; transform: scale(0.875); } } } .comment-metadata { > a, .comment-edit-link { display: inline; font-weight: 500; color: $color__text-light; vertical-align: baseline; time { vertical-align: baseline; } &:hover { color: $color__link-hover; text-decoration: none; } } > * { display: inline-block; } .edit-link-sep { color: $color__text-light; margin: 0 0.2em; vertical-align: baseline; } .edit-link { color: $color__text-light; svg { transform: scale(0.8); vertical-align: baseline; margin-right: 0.1em; } } .comment-edit-link { position: relative; padding-left: $size__spacing-unit; margin-left: -#{$size__spacing-unit}; z-index: 1; &:hover { color: $color__link; } } } .comment-content { margin: $size__spacing-unit 0; @include media(desktop) { padding-right: $size__spacing-unit; } > *:first-child { margin-top: 0; } > *:last-child { margin-bottom: 0; } blockquote { margin-left: 0; } a { text-decoration: underline; &:hover { text-decoration: none; } } } } .comment-reply-link, #cancel-comment-reply-link { font-weight: 500; &:hover { color: $color__link-hover; } } .discussion-avatar-list { @include clearfix; margin: 0; padding: 0; li { position: relative; list-style: none; margin: 0 -8px 0 0; padding: 0; float: left; } .comment-user-avatar { img { height: calc(1.5 * #{$size__spacing-unit}); width: calc(1.5 * #{$size__spacing-unit}); } } } .discussion-meta { .discussion-meta-info { margin: 0; .svg-icon { vertical-align: middle; fill: currentColor; transform: scale( 0.6 ) scaleX(-1) translateY(-0.1em); margin-left: -#{.25 * $size__spacing-unit}; // Align icon with avatars above. } } } .comment-form { .comment-notes, label { @include font-family( $font__heading ); font-size: $font__size-xs; color: $color__text-light; } .comment-form-author, .comment-form-email { @include media(tablet) { width: calc(50% - #{$size__spacing-unit / 2}); float: left; } } .comment-form-email { @include media(tablet) { margin-left: $size__spacing-unit; } } input[name="author"], input[name="email"], input[name="url"] { display: block; width: 100%; } } site/footer/_site-footer.scss000066600000001614152133444760012321 0ustar00/* Site footer */ #colophon { .widget-area, .site-info { margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit; @include media(tablet) { margin: calc(3 * #{$size__spacing-unit}) $size__site-margins; } } .widget-column { display: flex; flex-wrap: wrap; .widget { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; width: 100%; word-wrap: break-word; @include media(desktop) { margin-right: calc(3 * #{$size__spacing-unit}); width: calc(50% - (3 * #{$size__spacing-unit})); } } } .site-info { color: $color__text-light; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; word-wrap: break-word; a { color: inherit; &:hover { text-decoration: none; color: $color__link; } } .imprint, .privacy-policy-link { margin-right: $size__spacing-unit; } } }navigation/_menu-footer-navigation.scss000066600000000332152133444760014347 0ustar00/** === Footer menu === */ .footer-navigation { display: inline; & > div { display: inline; } .footer-menu { display: inline; padding-left: 0; li { display: inline; margin-right: 1rem; } } }navigation/_navigation.scss000066600000001073152133444760012114 0ustar00/*-------------------------------------------------------------- ## Links --------------------------------------------------------------*/ @import "links"; /*-------------------------------------------------------------- ## Menus --------------------------------------------------------------*/ @import "menu-main-navigation"; @import "menu-social-navigation"; @import "menu-footer-navigation"; /*-------------------------------------------------------------- ## Next / Previous --------------------------------------------------------------*/ @import "next-previous"; navigation/_links.scss000066600000000413152133444760011072 0ustar00a { @include link-transition; color: $color__link; &:visited { color: $color__link-visited; } &:hover, &:active { color: $color__link-hover; outline: 0; text-decoration: none; } &:focus { outline: thin dotted; text-decoration: underline; } } navigation/_next-previous.scss000066600000005246152133444760012613 0ustar00/* Next/Previous navigation */ // Singular navigation .post-navigation { margin: calc(3 * 1rem) 0; @include media(tablet) { margin: calc(3 * 1rem) $size__site-margins; max-width: calc(6 * (100vw / 12)); } @include media(desktop) { margin: calc(3 * 1rem) 0; max-width: 100%; } .nav-links { margin: 0 $size__spacing-unit; max-width: 100%; display: flex; flex-direction: column; @include media(tablet) { margin: 0; } @include media(desktop) { flex-direction: row; margin: 0 $size__site-margins; max-width: $size__site-desktop-content; } a { .meta-nav { color: $color__text-light; user-select: none; &:before, &:after { display: none; content: "—"; width: 2em; color: $color__text-light; height: 1em; } } .post-title { hyphens: auto; } &:hover { color: $color__link-hover; } } .nav-previous, .nav-next { @include media(desktop) { min-width: calc(50% - 2 * #{$size__spacing-unit}); } } .nav-previous { order: 2; @include media(desktop) { order: 1; } + .nav-next { margin-bottom: $size__spacing-unit; } .meta-nav { &:before { display: inline; } } } .nav-next { order: 1; @include media(desktop) { order: 2; padding-left: $size__spacing-unit; } .meta-nav { &:after { display: inline; } } } } } // Index/archive navigation .pagination { .nav-links { display: flex; flex-wrap: wrap; padding: 0 calc(.5 * #{$size__spacing-unit}); & > * { padding: calc(.5 * #{$size__spacing-unit}); &.dots, &.prev { padding-left: 0; } &.dots, &.next { padding-right: 0; } } a:focus { text-decoration: underline; outline-offset: -1px; &.prev, &.next { text-decoration: none; .nav-prev-text, .nav-next-text { text-decoration: underline; } } } .nav-next-text, .nav-prev-text { display: none; } @include media(tablet) { margin-left: $size__site-margins; padding: 0; .prev, .next { & > * { display: inline-block; vertical-align: text-bottom; } } & > * { padding: $size__spacing-unit; } } } } // Comments navigation .comment-navigation { .nav-links { display: flex; flex-direction: row; } .nav-previous, .nav-next { min-width: 50%; width: 100%; @include font-family( $font__heading ); font-weight: bold; .secondary-text { display: none; @include media(tablet) { display: inline; } } svg { vertical-align: middle; position: relative; margin: 0 -0.35em; top: -1px; } } .nav-next { text-align: right; } } navigation/_menu-main-navigation.scss000066600000020677152133444760014013 0ustar00/** === Main menu === */ .main-navigation { display: block; margin-top: #{0.25 * $size__spacing-unit}; body.page & { display: block; } > div { display: inline; } /* Un-style buttons */ button { display: inline-block; border: none; padding: 0; margin: 0; font-family: $font__heading; font-weight: 700; line-height: $font__line-height-heading; text-decoration: none; background: transparent; color: inherit; cursor: pointer; transition: background 250ms ease-in-out, transform 150ms ease; -webkit-appearance: none; -moz-appearance: none; &:hover, &:focus { background: transparent; } &:focus { outline: 1px solid transparent; outline-offset: -4px; } &:active { transform: scale(0.99); } } .main-menu { display: inline-block; margin: 0; padding: 0; > li { color: $color__link; display: inline; position: relative; > a { font-weight: 700; color: $color__link; margin-right: #{0.5 * $size__spacing-unit}; + svg { margin-right: #{0.5 * $size__spacing-unit}; } &:hover, &:hover + svg { color: $color__link-hover; } } &.menu-item-has-children { display: inline-block; position: inherit; @include media(tablet) { position: relative; } > a { margin-right: #{0.125 * $size__spacing-unit}; } & > a, .menu-item-has-children > a { &:after { content: ""; display: none; } } .submenu-expand { display: inline-block; margin-right: #{0.25 * $size__spacing-unit}; /* Priority+ Menu */ &.main-menu-more-toggle { position: relative; height: 24px; line-height: $font__line-height-heading; width: 24px; padding: 0; margin-left: #{0.5 * $size__spacing-unit}; svg { height: 24px; width: 24px; top: #{-0.125 * $size__spacing-unit}; vertical-align: text-bottom; } } .wp-customizer-unloading &, &.is-empty { display: none; } svg { position: relative; top: 0.2rem; } } } &:last-child > a, &:last-child.menu-item-has-children .submenu-expand { margin-right: 0; } } } .sub-menu { background-color: $color__link; color: $color__background-body; list-style: none; padding-left: 0; position: absolute; opacity: 0; left: -9999px; z-index: 99999; @include media(tablet) { width: auto; min-width: -moz-max-content; min-width: -webkit-max-content; min-width: max-content; } > li { display: block; float: none; position: relative; &.menu-item-has-children { .submenu-expand { display: inline-block; position: absolute; width: calc( 24px + #{$size__spacing-unit} ); right: 0; top: calc( .125 * #{$size__spacing-unit} ); bottom: 0; color: white; line-height: 1; padding: calc( .5 * #{$size__spacing-unit} ); svg { top: 0; } } .submenu-expand { margin-right: 0; } @include media(tablet) { .menu-item-has-children > a { &:after { content: "\203a"; } } } } > a, > .menu-item-link-return { color: $color__background-body; display: block; line-height: $font__line-height-heading; text-shadow: none; padding: calc( .5 * #{$size__spacing-unit} ) calc( 24px + #{$size__spacing-unit} ) calc( .5 * #{$size__spacing-unit} ) $size__spacing-unit; white-space: nowrap; &:hover, &:focus { background: $color__link-hover; &:after { background: $color__link-hover; } } } > .menu-item-link-return { width: 100%; font-size: $font__size_base; font-weight: normal; text-align: left; } > a:empty { display: none; } &.mobile-parent-nav-menu-item { display: none; font-size: $font__size-sm; font-weight: normal; svg { position: relative; top: 0.2rem; margin-right: calc( .25 * #{$size__spacing-unit} ); } } } } /* * Sub-menu styles * * :focus-within needs its own selector so other similar * selectors don’t get ignored if a browser doesn’t recognize it */ .main-menu .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu { display: block; left: 0; margin-top: 0; opacity: 1; width: auto; min-width: 100%; /* Non-mobile position */ @include media(tablet) { display: block; margin-top: 0; opacity: 1; position: absolute; left: 0; right: auto; top: auto; bottom: auto; height: auto; min-width: -moz-max-content; min-width: -webkit-max-content; min-width: max-content; transform: none; } &.hidden-links { left: 0; width: 100%; display: table; position: absolute; @include media(tablet) { right: 0; left: auto; display: block; width: max-content; } } .submenu-expand { display: none; } .sub-menu { display: block; margin-top: inherit; position: relative; width: 100%; left: 0; opacity: 1; /* Non-mobile position */ @include media(tablet) { float: none; max-width: 100%; } } /* Nested sub-menu dashes */ .sub-menu { counter-reset: submenu; } .sub-menu > li > a::before { font-family: $font__body; font-weight: normal; content: "\2013\00a0" counters(submenu, "\2013\00a0", none); counter-increment: submenu } } .main-menu .menu-item-has-children:not(.off-canvas):hover > .sub-menu, .main-menu .menu-item-has-children:not(.off-canvas):focus > .sub-menu, .main-menu .menu-item-has-children.is-focused:not(.off-canvas) > .sub-menu { display: block; left: 0; margin-top: 0; opacity: 1; width: auto; min-width: 100%; /* Non-mobile position */ @include media(tablet) { display: block; float: none; margin-top: 0; opacity: 1; position: absolute; left: 0; right: auto; top: auto; bottom: auto; height: auto; min-width: -moz-max-content; min-width: -webkit-max-content; min-width: max-content; transform: none; } &.hidden-links { left: 0; width: 100%; display: table; position: absolute; @include media(tablet) { right: 0; left: auto; display: table; width: max-content; } } .submenu-expand { display: none; } .sub-menu { display: block; margin-top: inherit; position: relative; width: 100%; left: 0; opacity: 1; /* Non-mobile position */ @include media(tablet) { float: none; max-width: 100%; } } /* Nested sub-menu dashes */ .sub-menu { counter-reset: submenu; } .sub-menu > li > a::before { font-family: $font__body; font-weight: normal; content: "\2013\00a0" counters(submenu, "\2013\00a0", none); counter-increment: submenu } } /** * Fade-in animation for top-level submenus */ .main-menu > .menu-item-has-children:not(.off-canvas):hover > .sub-menu { animation: fade_in 0.1s forwards; } /** * Off-canvas touch device styles */ .main-menu .menu-item-has-children.off-canvas .sub-menu { .submenu-expand .svg-icon { transform: rotate(270deg); } .sub-menu { opacity: 0; position: absolute; z-index: 0; transform: translateX(-100%); } li:hover, li:focus, li > a:hover, li > a:focus { background-color: transparent; } > li > a, > li > .menu-item-link-return { white-space: inherit; } &.expanded-true { display: table; margin-top: 0; opacity: 1; padding-left: 0; /* Mobile position */ left: 0; top: 0; right: 0; bottom: 0; position: fixed; z-index: 100000; /* Make sure appears above mobile admin bar */ width: 100vw; height: 100vh; max-width: 100vw; transform: translateX(+100%); animation: slide_in_right 0.3s forwards; > .mobile-parent-nav-menu-item { display: block; } /* Prevent menu from being blocked by admin bar */ .admin-bar & { top: 46px; height: calc( 100vh - 46px ); .sub-menu.expanded-true { top: 0; } /* WP core breakpoint */ @media only screen and ( min-width: 782px ) { top: 32px; height: calc( 100vh - 32px ); .sub-menu.expanded-true { top: 0; } } } } } // Hide duplicate menu-more-link when re-loading a menu in the customizer .main-menu-more { &:nth-child(n+3) { display: none; } } } /* Menu animation */ @keyframes slide_in_right { 100% { transform: translateX(0%); } } @keyframes fade_in { from { opacity: 0; } to { opacity: 1; } } navigation/_menu-social-navigation.scss000066600000002235152133444760014327 0ustar00/* Social menu */ .social-navigation { margin-top: calc(#{$size__spacing-unit} / 2 ); text-align: left; ul.social-links-menu { @include clearfix; display: inline-block; margin: 0; padding: 0; li { display: inline-block; vertical-align: bottom; vertical-align: -webkit-baseline-middle; list-style: none; &:nth-child(n+2) { margin-left: 0.1em; } a { border-bottom: 1px solid transparent; display: block; color: $color__text-main; margin-bottom: -1px; transition: opacity $link_transition ease-in-out; &:hover, &:active { color: $color__text-main; opacity: 0.6; } &:focus { color: $color__text-main; opacity: 1; border-bottom: 1px solid $color__text-main; } svg { display: block; width: 32px; height: 32px; // Prevent icons from jumping in Safari using hardware acceleration. transform: translateZ(0); &#ui-icon-link { transform: rotate(-45deg); } } } } } } .site-title + .social-navigation, .site-description + .social-navigation { @include media(tablet) { margin-top: calc(#{$size__spacing-unit} / 5 ); } } forms/_buttons.scss000066600000001404152133444760010440 0ustar00.button, button, input[type="button"], input[type="reset"], input[type="submit"] { @include button-transition; background: $color__background-button; border: none; border-radius: 5px; box-sizing: border-box; color: $color__background-body; @include font-family( $font__heading ); font-size: $font__size-sm; font-weight: 700; line-height: $font__line-height-heading; outline: none; padding: ( $size__spacing-unit * .76 ) $size__spacing-unit; text-decoration: none; vertical-align: bottom; &:hover { background: $color__background-button-hover; cursor: pointer; } &:visited { color: $color__background-body; text-decoration: none; } &:focus { background: $color__background-button-hover; outline: thin dotted; outline-offset: -4px; } } forms/_forms.scss000066600000000046152133444760010071 0ustar00@import "buttons"; @import "fields"; forms/_fields.scss000066600000001742152133444760010215 0ustar00input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea { -webkit-backface-visibility: hidden; background: $color__background-input; border: solid 1px $color__border; box-sizing: border-box; outline: none; padding: #{.36 * $size__spacing-unit} #{.66 * $size__spacing-unit}; -webkit-appearance: none; outline-offset: 0; border-radius: 0; &:focus { border-color: $color__link; outline: thin solid rgba( $color__link, 0.15 ); outline-offset: -4px; } } input[type="search"] { &::-webkit-search-decoration { display: none; } } select { } textarea { box-sizing: border-box; display: block; width: 100%; max-width: 100%; resize: vertical; } form { p { margin: $size__spacing-unit 0; } }media/_galleries.scss000066600000001645152133444760010651 0ustar00.gallery { display: flex; flex-flow: row wrap; justify-content: center; margin-bottom: calc(1.5 * #{$size__spacing-unit}); } .gallery-item { display: inline-block; margin-right: 16px; margin-bottom: 16px; text-align: center; vertical-align: top; width: 100%; // Loops to enumerate the classes for gallery columns. @for $i from 2 through 9 { .gallery-columns-#{$i} & { max-width: calc((100% - 16px * #{ $i - 1 }) / #{ $i }); &:nth-of-type(#{$i}n+#{$i}) { margin-right: 0; } } } &:last-of-type { padding-right: 0; } } .gallery-caption { display: block; font-size: $font__size-xs; @include font-family( $font__heading ); line-height: $font__line-height-pre; margin: 0; padding: ( $size__spacing-unit * .5 ); } .gallery-item > div > a { display: block; line-height: 0; // Accessibility box-shadow: 0 0 0 0 transparent; &:focus { box-shadow: 0 0 0 2px rgba( $color__link, 1 ); } } media/_captions.scss000066600000001210152133444760010506 0ustar00.wp-caption { margin-bottom: calc(1.5 * #{$size__spacing-unit}); &.aligncenter { @include media(tablet) { position: relative; left: calc( #{$size__site-tablet-content} / 2 ); transform: translateX( -50% ); } @include media(desktop) { left: calc( #{$size__site-desktop-content} / 2 ); } } } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption-text { color: $color__text-light; font-size: $font__size-xs; @include font-family( $font__heading ); line-height: $font__line-height-pre; margin: 0; padding: ( $size__spacing-unit * .5 ); text-align: center; } media/_media.scss000066600000001453152133444760007756 0ustar00.page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } embed, iframe, object { max-width: 100%; } .custom-logo-link { display: inline-block; } .avatar { border-radius: 100%; display: block; height: calc(2.25 * #{$size__spacing-unit}); min-height: inherit; width: calc(2.25 * #{$size__spacing-unit}); } svg { transition: fill $icon_transition ease-in-out; fill: currentColor; } /*-------------------------------------------------------------- ## Captions --------------------------------------------------------------*/ @import "captions"; /*-------------------------------------------------------------- ## Galleries --------------------------------------------------------------*/ @import "galleries"; variables-site/_variables-site.scss000066600000000142152133444760013436 0ustar00@import "colors"; @import "fonts"; @import "structure"; @import "columns"; @import "transitions"; variables-site/_colors.scss000066600000002037152133444760012032 0ustar00 // Backgrounds $color__background-body: #fff; $color__background-input: #fff; $color__background-screen: #f1f1f1; $color__background-hr: #ccc; $color__background-button: #0073aa; $color__background-button-hover: #111; $color__background-pre: #eee; $color__background-ins: #fff9c0; $color__background_selection: mix( $color__background-body, $color__background-button, 75% ); // lighten( salmon, 22.5% ); // lighten( #0999d4, 48% ); // Text $color__text-main: #111; $color__text-light: #767676; $color__text-hover: lighten( #111, 22.5% ); $color__text-screen: #21759b; $color__text-input: #666; $color__text-input-focus: #111; // Links $color__link: #0073aa; $color__link-visited: #0073aa; $color__link-hover: darken( $color__link, 10% ); // Borders $color__border: #ccc; $color__border-link: #0073aa; $color__border-link-hover: darken( $color__link, 10% ); $color__border-button: #ccc #ccc #bbb; $color__border-button-hover: #ccc #bbb #aaa; $color__border-button-focus: #aaa #bbb #bbb; $color__border-input: $color__border; $color__border-abbr: #666; variables-site/_transitions.scss000066600000000204152133444760013100 0ustar00// Transition timeouts. $link_transition: 110ms; $icon_transition: 120ms; $button_transition: 150ms; $background_transition: 200ms;variables-site/_fonts.scss000066600000014512152133444760011663 0ustar00/* * Chrome renders extra-wide   characters for the Hoefler Text font. * This results in a jumping cursor when typing in both the Classic and block * editors. The following font-face override fixes the issue by manually inserting * a custom font that includes just a Hoefler Text space replacement for that * character instead. */ @font-face { font-family: 'NonBreakingSpaceOverride'; src: url(data:application/font-woff2;charset=utf-8;base64,d09GMgABAAAAAAMoAA0AAAAACDQAAALTAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGh4GYACCahEICjx3CywAATYCJANUBCAFhiEHgWwbXQfILgpsY+rQRRARwyAs6uL7pxzYhxEE+32b3aeHmifR6tklkS9hiZA0ewkqGRJE+H7/+6378ASViK/PGeavqJyOzsceKi1s3BCiQsiOdn1r/RBgIJYEgCUhbm/8/8/h4saPssnTNkkiWUBrTRtjmQSajw3Ui3pZ3LYDPD+XG2C3JA/yKAS8/rU5eNfuGqRf4eNNgV4YAlIIgxglEkWe6FYpq10+wi3g+/nUgvgPFczNrz/RsTgVm/zfbPuHZlsuQECxuyqBcQwKFBjFgKO8AqP4bAN9tFJtnM9xPcbNjeXS/x1wY/xU52f5W/X1+9cnH4YwKIaoRRAkUkj/YlAAeF/624foiIDBgBmgQBeGAyhBljUPZUm/l2dTvmpqcBDUOHdbPZWd8JsBAsGr4w8/EDn82/bUPx4eh0YNrQTBuHO2FjQEAGBwK0DeI37DpQVqdERS4gZBhpeUhWCfLFz7J99aEBgsJCHvUGAdAPp4IADDCAPCEFMGpMZ9AQpTfQtQGhLbGVBZFV8BaqNyP68oTZgHNj3M8kBPfXTTC9t90UuzYhy9ciH0grVlOcqyCytisvbsERsEYztiznR0WCrmTksJwbSNK6fd1Rvr25I9oLvctUoEbNOmXJbqgYgPXEHJ82IUsrCnpkxh23F1rfZ2zcRnJYoXtauB3VTFkFXQg3uoZYD5qE0kdjDtoDoF1h2bulGmev5HbYhbrjtohQSRI4aNOkffIcT+d3v6atpaYh3JvPoQsztCcqvaBkppDSPcQ3bw3KaCBo1f5CJWTZEgW3LjLofYg51MaVezrx8xZitYbQ9KYeoRaqQdVLwSEfrKXLK1otCWOKNdR/YwYAfon5Yk8O2MJfSD10dPGA5PIJJQMkah0ugMJiv6x4Dm7LEa8xnrRGGGLAg4sAlbsA07sAt76DOsXKO3hIjtIlpnnFrt1qW4kh6NhS83P/6HB/fl1SMAAA==) format('woff2'), url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAAUQAA0AAAAACDQAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAE9AAAABwAAAAchf5yU0dERUYAAATYAAAAHAAAAB4AJwAbT1MvMgAAAaAAAABJAAAAYJAcgU5jbWFwAAACIAAAAF4AAAFqUUxBZ2dhc3AAAATQAAAACAAAAAgAAAAQZ2x5ZgAAApAAAAAyAAAAPL0n8y9oZWFkAAABMAAAADAAAAA2Fi93Z2hoZWEAAAFgAAAAHQAAACQOSgWaaG10eAAAAewAAAAzAAAAVC7TAQBsb2NhAAACgAAAABAAAAAsAOQBAm1heHAAAAGAAAAAHQAAACAAWQALbmFtZQAAAsQAAAF6AAADIYvD/Adwb3N0AAAEQAAAAI4AAADsapk2o3jaY2BkYGAA4ov5mwzj+W2+MnCzXwCKMNzgCBSB0LfbQDQ7AxuI4mBgAlEAFKQIRHjaY2BkYGD3+NvCwMDBAALsDAyMDKhAFAA3+wH3AAAAeNpjYGRgYBBl4GBgYgABEMnIABJzAPMZAAVmAGUAAAB42mNgZlJhnMDAysDCKsKygYGBYRqEZtrDYMT4D8gHSmEHjgUFOQwODAqqf9g9/rYwMLB7MNUAhRlBcsxBrMlASoGBEQAj8QtyAAAAeNrjYGBkAAGmWQwMjO8gmBnIZ2NA0ExAzNjAAFYJVn0ASBsD6VAIDZb7AtELAgANIgb9AHjaY2BgYGaAYBkGRgYQSAHyGMF8FgYPIM3HwMHAxMDGoMCwQIFLQV8hXvXP//9AcRCfAcb///h/ygPW+w/vb7olBjUHCTCyMcAFGZmABBO6AogThgZgIUsXAEDcEzcAAHjaY2BgECMCyoEgACZaAed42mNgYmRgYGBnYGNgYAZSDJqMgorCgoqCjECRXwwNrCAKSP5mAAFGBiRgyAAAi/YFBQAAeNqtkc1OwkAUhU/5M25cEhcsZick0AwlBJq6MWwgJkAgYV/KAA2lJeUn+hY+gktXvpKv4dLTMqKycGHsTZNv7px7z50ZAFd4hYHjdw1Ls4EiHjVncIFnzVnc4F1zDkWjrzmPW+NNcwGlzIRKI3fJlUyrEjZQxb3mDH2fNGfRx4vmHKqG0JzHg6E0F9DOlFBGBxUI1GEzLNT4S0aLuTtsGAEUuYcQHkyg3KmIum1bNUvKlrjbbAIleqHHnS4iSudpQcySMYtdFiXlAxzSbAwfMxK6kZoHKhbjjespMTioOPZnzI+4ucCeTVyKMVKLfeAS6vSWaTinuZwzyy/Dc7vaed+6KaV0kukdPUk6yOcctZPvvxxqksq2lEW8RvHjMEO2FCl/zy6p3NEm0R9OFSafJdldc4QVeyaaObMBO0/5cCaa6d9Ggyubxire+lEojscdjoWUR1xGOy8KD8mG2ZLO2l2paDc3A39qmU2z2W5YNv5+u79e6QfGJY/hAAB42m3NywrCMBQE0DupWp/1AYI7/6DEaLQu66Mrd35BKUWKJSlFv1+rue4cGM7shgR981qSon+ZNwUJ8iDgoYU2OvDRRQ99DDDECAHGmGCKmf80hZSx/Kik/LliFbtmN6xmt+yOjdg9GztV4tROnRwX/Bsaaw51nt4Lc7tWaZYHp/MlzKx51LZs5htNri+2AAAAAQAB//8AD3jaY2BkYGDgAWIxIGZiYARCESBmAfMYAAR6AEMAAAABAAAAANXtRbgAAAAA2AhRFAAAAADYCNuG) format('woff'); } // Font and typographic variables $font__body: "NonBreakingSpaceOverride", "Hoefler Text", Garamond, "Times New Roman", serif; $font__heading: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; $font__fallbacks: ( /* Arabic */ ar: 'Tahoma, Arial, sans-serif', ary: 'Tahoma, Arial, sans-serif', azb: 'Tahoma, Arial, sans-serif', ckb: 'Tahoma, Arial, sans-serif', fa-IR: 'Tahoma, Arial, sans-serif', haz: 'Tahoma, Arial, sans-serif', ps: 'Tahoma, Arial, sans-serif', /* Cyrillic */ be: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif', bg-BG: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif', kk: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif', mk-MK: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif', mn: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif', ru-RU: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif', sah: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif', sr-RS: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif', tt-RU: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif', uk: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif', /* Chinese (Hong Kong) */ zh-HK: '-apple-system, BlinkMacSystemFont, "PingFang HK", "Helvetica Neue", "Microsoft YaHei New", STHeiti Light, sans-serif', /* Chinese (Taiwan) */ zh-TW: '-apple-system, BlinkMacSystemFont, "PingFang TC", "Helvetica Neue", "Microsoft YaHei New", STHeiti Light, sans-serif', /* Chinese (China) */ zh-CN: '-apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", "Microsoft YaHei New", STHeiti Light, sans-serif', /* Devanagari */ bn-BD: 'Arial, sans-serif', hi-IN: 'Arial, sans-serif', mr: 'Arial, sans-serif', ne-NP: 'Arial, sans-serif', /* Greek */ el: '"Helvetica Neue", Helvetica, Arial, sans-serif', /* Gujarati */ gu: 'Arial, sans-serif', /* Hebrew */ he-IL: '"Arial Hebrew", Arial, sans-serif', /* Japanese */ ja: '-apple-system, BlinkMacSystemFont, "Hiragino Sans", Meiryo, "Helvetica Neue", sans-serif', /* Korean */ ko-KR: '"Apple SD Gothic Neo", "Malgun Gothic", "Nanum Gothic", Dotum, sans-serif', /* Thai */ th: '"Sukhumvit Set", "Helvetica Neue", helvetica, arial, sans-serif', /* Vietnamese */ vi: '"Libre Franklin", sans-serif', ); $font__code: Menlo, monaco, Consolas, Lucida Console, monospace; $font__pre: "Courier 10 Pitch", Courier, monospace; $font__size_base: 22px; $font__size-ratio: 1.125; $font__size-xxs: 1em / (1.5 * $font__size-ratio); $font__size-xs: 1em / (1.25 * $font__size-ratio); $font__size-sm: 1em / (1 * $font__size-ratio); $font__size-md: 1em * (1 * $font__size-ratio); $font__size-lg: 1em * (1.5 * $font__size-ratio); $font__size-xl: 1em * (2 * $font__size-ratio); $font__size-xxl: 1em * (2.5 * $font__size-ratio); $font__size-xxxl: 1em * (3 * $font__size-ratio); $font__line-height-body: 1.8; $font__line-height-pre: 1.6; $font__line-height-heading: 1.2; $font__line-height-double: 2 * $font__line-height-heading;variables-site/_structure.scss000066600000000564152133444760012574 0ustar00// Responsive widths. $size__spacing-unit: 1rem; $size__site-main: 100%; $size__site-sidebar: 25%; $size__site-margins: calc(10% + 60px); $size__site-tablet-content: calc(8 * (100vw / 12) - 28px); $size__site-desktop-content: calc(6 * (100vw / 12) - 28px); // Responsive widths. $mobile_width: 600px; $tablet_width: 768px; $desktop_width: 1168px; $wide_width: 1379px; variables-site/_columns.scss000066600000000614152133444760012210 0ustar00$columns: ( 1: calc(1 * (100vw / 12)), 2: calc(2 * (100vw / 12)), 3: calc(3 * (100vw / 12)), 4: calc(4 * (100vw / 12)), 5: calc(5 * (100vw / 12)), 6: calc(6 * (100vw / 12)), 7: calc(7 * (100vw / 12)), 8: calc(8 * (100vw / 12)), 9: calc(9 * (100vw / 12)), 10: calc(10 * (100vw / 12)), 11: calc(11 * (100vw / 12)), 12: calc(12 * (100vw / 12)) ); $columns__margin: $size__spacing-unit; mixins/_utilities.scss000066600000001534152133444760011142 0ustar00 @mixin media( $res ) { @if mobile == $res { @media only screen and (min-width: $mobile_width) { @content; } } @if tablet == $res { @media only screen and (min-width: $tablet_width) { @content; } } @if desktop == $res { @media only screen and (min-width: $desktop_width) { @content; } } @if wide == $res { @media only screen and (min-width: $wide_width) { @content; } } } @mixin link-transition( $attr: color ) { transition: $attr $link_transition ease-in-out; } @mixin button-transition() { transition: background $button_transition ease-in-out; } @mixin button-all-transition() { transition: all $button_transition ease-in-out; } @mixin background-transition() { transition: background $background_transition ease-in-out; } @mixin selection { ::-moz-selection { @content; } ::selection { @content; } } mixins/_mixins-master.scss000066600000005274152133444760011734 0ustar00// Rem output with px fallback @mixin font-size($sizeValue: 1) { font-size: ($sizeValue * 16) * 1px; font-size: $sizeValue * 1rem; } // Center block @mixin center-block { display: block; margin-left: auto; margin-right: auto; } // Clearfix @mixin clearfix() { content: ""; display: table; table-layout: fixed; } // Clear after (not all clearfix need this also) @mixin clearfix-after() { clear: both; } // Column width with margin @mixin column-width($numberColumns: 3) { width: map-get($columns, $numberColumns) - (($columns__margin * ($numberColumns - 1)) / $numberColumns); } @mixin filter-duotone { &:before { background: $color__link; mix-blend-mode: screen; opacity: 0.1; z-index: 2; } &:after { background: $color__link; mix-blend-mode: multiply; opacity: .8; z-index: 3; /* Browsers supporting mix-blend-mode don't need opacity < 1 */ @supports (mix-blend-mode: multiply) { opacity: 1; } } } @mixin filter-grayscale { position: relative; filter: grayscale(100%); z-index: 1; &:after { display: block; width: 100%; height: 100%; z-index: 10; } } @mixin post-section-dash { &:before { background: $color__text-light; content: "\020"; display: block; height: 2px; margin: $size__spacing-unit 0; width: 1em; } } /* If we add the border using a regular CSS border, it won't look good on non-retina devices, * since its edges can look jagged due to lack of antialiasing. In this case, we are several * layers of box-shadow to add the border visually, which will render the border smoother. */ @mixin box-shadow( $size ) { box-shadow: 0 0 0 $size $color__text-light inset, // Original border. 0 0 0 ($size + 1px) $color__text-light inset, // Antialiasing, inner edge. 0 0 1px 0 rgba( $color__text-light, 0.7 ); // Antialiasing, outer edge. } /* Calculates maximum width for post content */ @mixin postContentMaxWidth() { @include media(tablet) { max-width: $size__site-tablet-content; } @include media(desktop) { max-width: $size__site-desktop-content; } } /* Nested sub-menu padding: 10 levels deep */ @mixin nestedSubMenuPadding() { ul { counter-reset: submenu; } ul > li > a::before { font-family: $font__body; font-weight: normal; content: "\2013\00a0" counters(submenu, "\2013\00a0", none); counter-increment: submenu } } /* Ensure all font family declarations come with non-latin fallbacks */ @mixin font-family( $font_family: $font__body ) { font-family: $font_family; @extend %non-latin-fonts; } /* Build our non-latin font styles */ %non-latin-fonts { @each $lang, $font__fallback in $font__fallbacks { &:lang(#{$lang}) { font-family: unquote( $font__fallback ); } } } @import "utilities"; _normalize.scss000066600000013542152133444760007622 0ustar00/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ /* Document ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers. */ body { margin: 0; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* Grouping content ========================================================================== */ /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * Remove the gray background on active links in IE 10. */ a { background-color: transparent; } /** * 1. Remove the bottom border in Chrome 57- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */ } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Remove the border on images inside links in IE 10. */ img { border-style: none; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers. * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * Correct the inability to style clickable types in iOS and Safari. */ button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { vertical-align: baseline; } /** * Remove the default vertical scrollbar in IE 10+. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10. * 2. Remove the padding in IE 10. */ [type="checkbox"], [type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding in Chrome and Safari on macOS. */ [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in Edge, IE 10+, and Firefox. */ details { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Misc ========================================================================== */ /** * Add the correct display in IE 10+. */ template { display: none; } /** * Add the correct display in IE 10. */ [hidden] { display: none; } elements/_tables.scss000066600000000341152133444760010701 0ustar00table { margin: 0 0 $size__spacing-unit; border-collapse: collapse; width: 100%; @include font-family( $font__heading ); td, th { padding: 0.5em; border: 1px solid $color__text-light; word-break: break-all; } } elements/_elements.scss000066600000002017152133444760011245 0ustar00html { box-sizing: border-box; } ::-moz-selection { background-color: $color__background_selection; } ::selection { background-color: $color__background_selection; } *, *:before, *:after { box-sizing: inherit; } body { background-color: $color__background-body; } a { @include link-transition; color: $color__link; } a:visited { } a:hover, a:active { color: $color__link-hover; outline: 0; text-decoration: none; } a:focus { outline: thin; outline-style: dotted; text-decoration: underline; } h1, h2, h3, h4, h5, h6 { clear: both; margin: $size__spacing-unit 0; } h1:not(.site-title), h2 { @include post-section-dash; } hr { background-color: $color__text-light; border: 0; height: 2px; } @import "lists"; img { height: auto; max-width: 100%; position: relative; } figure { margin: 0; } blockquote { border-left: 2px solid $color__link; margin-left: 0; padding: 0 0 0 $size__spacing-unit; > p { margin: 0 0 $size__spacing-unit; } cite { color: $color__text-light; } } @import "tables"; elements/_lists.scss000066600000000536152133444760010573 0ustar00ul, ol { padding-left: ( 1 * $size__spacing-unit ); } ul { list-style: disc; ul { list-style-type: circle; } } ol { list-style: decimal; } li { line-height: $font__line-height-body; } li > ul, li > ol { padding-left: ( 2 * $size__spacing-unit ); } dt { font-weight: bold; } dd { margin: 0 $size__spacing-unit $size__spacing-unit; } typography/_typography.scss000066600000001057152133444760012234 0ustar00 html { font-size: $font__size_base; } body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: $color__text-main; @include font-family( $font__body ); font-weight: 400; font-size: 1em; line-height: $font__line-height-body; margin: 0; text-rendering: optimizeLegibility; } button, input, select, optgroup, textarea { color: $color__text-main; @include font-family( $font__body ); font-weight: 400; line-height: $font__line-height-body; text-rendering: optimizeLegibility; } @import "headings"; @import "copy"; typography/_headings.scss000066600000005017152133444760011610 0ustar00.author-description .author-link, .comment-metadata, .comment-reply-link, .comments-title, .comment-author .fn, .discussion-meta-info, .entry-meta, .entry-footer, .main-navigation, .no-comments, .not-found .page-title, .error-404 .page-title, .post-navigation .post-title, .page-links, .page-description, .pagination .nav-links, .sticky-post, .site-title, .site-info, #cancel-comment-reply-link, h1, h2, h3, h4, h5, h6 { @include font-family( $font__heading ); } .main-navigation, .page-description, .author-description .author-link, .not-found .page-title, .error-404 .page-title, .post-navigation .post-title, .pagination .nav-links, .comments-title, .comment-author .fn, .no-comments, .site-title, h1, h2, h3, h4, h5, h6 { font-weight: 700; letter-spacing: -0.02em; line-height: $font__line-height-heading; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .page-title { @include font-family( $font__body ); } .site-branding, .main-navigation ul.main-menu > li, .social-navigation, .author-description .author-bio, .nav-links { line-height: 1.25; } h1 { font-size: $font__size-xl; @include media(tablet) { font-size: $font__size-xxl; } } .entry-title, .not-found .page-title, .error-404 .page-title, .has-larger-font-size, h2 { font-size: $font__size-lg; @include media(tablet) { font-size: $font__size-xl; } } .has-regular-font-size, .has-large-font-size, .comments-title, h3 { font-size: $font__size-lg; } .site-title, .site-description, .main-navigation, .nav-links, .page-title, .page-description, .comment-author .fn, .no-comments, h2.author-title, p.author-bio, h4 { font-size: $font__size-md; } .pagination .nav-links, .comment-content, h5 { font-size: $font__size-sm; } .entry-meta, .entry-footer, .discussion-meta-info, .site-info, .has-small-font-size, .comment-reply-link, .comment-metadata, .comment-notes, .sticky-post, #cancel-comment-reply-link, img:after, h6 { font-size: $font__size-xs; } .site-title, .page-title { font-weight: normal; } .page-description, .page-links a { font-weight: bold; } .site-description { letter-spacing: -0.01em; } .post-navigation .post-title, .entry-title, .not-found .page-title, .error-404 .page-title, .comments-title, blockquote { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; word-break: break-word; word-wrap: break-word; } /* Do not hyphenate entry title on tablet view and bigger. */ .entry-title { @include media(tablet) { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; } } typography/_copy.scss000066600000001312152133444760010772 0ustar00p { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } dfn, cite, em, i { font-style: italic; } blockquote { cite { font-size: $font__size-xs; font-style: normal; @include font-family( $font__heading ); } } pre { font-size: $font__size-sm; font-family: $font__pre; line-height: $font__line-height-body; overflow: auto; } code, kbd, tt, var { font-size: $font__size-sm; font-family: $font__code; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #fff9c0; text-decoration: none; } big { font-size: 125%; } a { text-decoration: none; &:hover { text-decoration: none; } &:focus { text-decoration: underline; } } modules/_alignments.scss000066600000000675152133444760011436 0ustar00.alignleft { /*rtl:ignore*/ float: left; /*rtl:ignore*/ margin-right: $size__spacing-unit; @include media(tablet) { /*rtl:ignore*/ margin-right: calc(2 * #{$size__spacing-unit}); } } .alignright { /*rtl:ignore*/ float: right; /*rtl:ignore*/ margin-left: $size__spacing-unit; @include media(tablet) { /*rtl:ignore*/ margin-left: calc(2 * #{$size__spacing-unit}); } } .aligncenter { clear: both; @include center-block; } modules/_clearings.scss000066600000000646152133444760011242 0ustar00.clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after { @include clearfix; } .clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after { @include clearfix-after; } modules/_accessibility.scss000066600000001626152133444760012121 0ustar00/* Text meant only for screen readers. */ .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */ &:focus { background-color: $color__background-screen; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; clip-path: none; color: $color__text-screen; display: block; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } } /* Do not show the outline on the skip link target. */ #content[tabindex="-1"]:focus { outline: 0; } layout/_layout.scss000066600000000127152133444760010447 0ustar00 /** === Layout === */ #page { width: 100%; } .site-content { overflow: hidden; } index.php000066600000000032152141673120006365 0ustar00 .cmb-field-list > .cmb-row { padding: 1.8em 0; } input[type=text] { &.cmb2-oembed { width: 100%; } } } .cmb-row { padding: 0 0 1.8em; margin: 0 0 0.8em; .cmbhandle { right: -1em; position: relative; } } .cmb-repeatable-grouping { padding: 0 1em; max-width: 100%; min-width: 1px !important; } .cmb-repeatable-group > .cmb-row { padding-bottom: 0; } .cmb-th { width: 18%; padding: 0 2% 0 0; // text-align: right; } .cmb-td { margin-bottom: 0; padding: 0; line-height: 1.3; } .cmb-repeat-row .cmb-td { padding-bottom: 1.8em; } .cmb-th + .cmb-td { width: 80%; float: right; } .cmb-row:not(:last-of-type), .cmb-repeatable-group:not(:last-of-type) { border-bottom: 1px solid $light-gray; @media (max-width: $mobile-break) { border-bottom: 0; } } .cmb-repeat-group-field, .cmb-remove-field-row { padding-top: 1.8em; } .cmb2-metabox > .cmb-row { &.table-layout, .cmb-row.table-layout { .cmb-repeat-table .cmb-tbody { display: table; width: 100%; input.regular-text { width: 100%; } .cmb-row:not(.hidden):not(.empty-row) { display: table-row; } .cmb-td { display: table-cell; float: none; width: 100%; } .cmb-row:not(:first-of-type) .cmb-td { padding-top: 1.8em; } .cmb-td.cmb-remove-row { padding-right: 0; } } } } } partials/_mixins.scss000066600000001151152141673120010732 0ustar00//-------------------------------------------------------------- // Mixins //-------------------------------------------------------------- @mixin fullth() { font-size: 1.2em; @include _fullth; } @mixin fullth_side() { @include _fullth; label { font-size: $font-size; line-height: 1.4em; } } @mixin _fullth() { display: block; float: none; padding-bottom: 1em; text-align: left; width: 100%; label { display: block; margin-top: 0em; padding-bottom: 5px; &:after { border-bottom: 1px solid $light-gray; content: ''; clear: both; display: block; padding-top: .4em; } } } partials/_context_metaboxes.scss000066600000002753152141673120013167 0ustar00/*-------------------------------------------------------------- Context Metaboxes --------------------------------------------------------------*/ /* Metabox collapse arrow indicators */ .js .cmb2-postbox.context-box { .toggle-indicator { &:before { content: "\f142"; display: inline-block; font: normal 20px/1 dashicons; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-decoration: none !important; } } &.closed { .toggle-indicator { &:before { content: "\f140"; } } } } .cmb2-postbox.context-box { margin-bottom: 10px; &.context-before_permalink-box { margin-top: 10px; } &.context-after_title-box { margin-top: 10px; } &.context-after_editor-box { margin-top: 20px; margin-bottom: 0; } &.context-form_top-box { margin-top: 10px; .hndle { font-size: 14px; padding: 8px 12px; margin: 0; line-height: 1.4; } } .hndle { cursor: auto; } } .cmb2-context-wrap { margin-top: 10px; &.cmb2-context-wrap-form_top { margin-right: 300px; width: auto; } &.cmb2-context-wrap-no-title { .cmb2-metabox { padding: 10px; } } .cmb-th { padding: 0 2% 0 0; width: 18%; } .cmb-td { width: 80%; padding: 0; } .cmb-row { margin-bottom: 10px; &:last-of-type { margin-bottom: 0; } } } /* one column on the post write/edit screen */ @media only screen and (max-width: 850px) { .cmb2-context-wrap.cmb2-context-wrap-form_top { margin-right: 0; } } partials/_display.scss000066600000000637152141673120011100 0ustar00/** * CMB2 Styling */ .cmb2-colorpicker-swatch { span { display: inline-block; width: 1em; height: 1em; border-radius: 1em; float: left; margin-top: 3px; margin-right: 2px; } } .cmb2-code { overflow: scroll; } .cmb-image-display { max-width: 100%; height: auto; } .cmb2-display-file-list li { display: inline; margin: 0 .5em .5em 0; } .cmb2-oembed * { max-width: 100%; height: auto; } partials/_misc.scss000066600000001145152141673120010361 0ustar00/*-------------------------------------------------------------- Misc. --------------------------------------------------------------*/ #poststuff .cmb-repeatable-group h2 { margin: 0; } .edit-tags-php, .profile-php, .user-edit-php { .cmb2-metabox-title { font-size: 1.4em; } } .cmb2-options-page { .cmb2-metabox-title { font-size: 1.3em; margin: 1em 0; + p.cmb2-metabox-description { margin-top: -1.6em; margin-bottom: .8em; } } } .cmb2-postbox, .cmb2-no-box-wrap { .cmb-spinner { float: left; display: none; } } .cmb-spinner { display: none; &.is-active { display: block; } } partials/_front.scss000066600000001406152141673120010556 0ustar00.closed .inside { display: none; } .cmb-repeatable-grouping { position: relative; .cmb-group-title { margin-left: -1em; margin-right: -1em; min-height: 1.5em; } h3 { font-size: 14px; padding: 8px 12px; margin: 0; line-height: 1.4; } } .cmb-repeatable-group { &.repeatable .cmb-group-title { padding-left: 2.2em; } &.non-repeatable .cmb-group-title { padding-left: 12px; } } .cmb-type-group .cmb-row .cmbhandle { right: 0; position: absolute; } .cmb-spinner { background: url(/wp-admin/images/spinner.gif) no-repeat; -webkit-background-size: 20px 20px; background-size: 20px 20px; display: none; float: right; vertical-align: middle; opacity: 0.7; filter: alpha(opacity=70); width: 20px; height: 20px; margin: 4px 10px 0; } partials/_jquery_ui.scss000066600000016625152141673120011453 0ustar00/* * jQuery UI CSS Framework 1.8.16 * * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) * Dual licensed under the MIT or GPL Version 2 licenses. * http://jquery.org/license * * http://docs.jquery.com/UI/Theming/API * * WordPress Styles adopted from "jQuery UI Datepicker CSS for WordPress" * https://github.com/stuttter/wp-datepicker-styling * */ * html .cmb2-element.ui-helper-clearfix { height:1%; } $weekend: #f4f4f4; $freshblue: #00a0d2; $freshdark: #32373c; $freshdarkblue: #0073aa; .cmb2-element.ui-datepicker, .cmb2-element .ui-datepicker { padding: 0; margin: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background-color: #fff; border: 1px solid #dfdfdf; border-top: none; -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075); min-width: 17em; width: auto; * { padding: 0; font-family: "Open Sans", sans-serif; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } table { font-size: 13px; margin: 0; border: none; border-collapse: collapse; } .ui-widget-header, .ui-datepicker-header { background-image: none; border: none; color: #fff; font-weight: normal; } .ui-datepicker-header .ui-state-hover { background: transparent; border-color: transparent; cursor: pointer; } .ui-datepicker-title { margin: 0; padding: 10px 0; color: #fff; font-size: 14px; line-height: 14px; text-align: center; select { margin-top: -8px; margin-bottom: -8px; } } .ui-datepicker-prev, .ui-datepicker-next { position: relative; top: 0; height: 34px; width: 34px; } .ui-state-hover.ui-datepicker-prev, .ui-state-hover.ui-datepicker-next { border: none; } .ui-datepicker-prev, .ui-datepicker-prev-hover { left: 0; } .ui-datepicker-next, .ui-datepicker-next-hover { right: 0; } .ui-datepicker-next span, .ui-datepicker-prev span { display: none; } .ui-datepicker-prev { float: left; } .ui-datepicker-next { float: right; } .ui-datepicker-prev:before, .ui-datepicker-next:before { font: normal 20px/34px 'dashicons'; padding-left: 7px; color: #fff; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; width: 34px; height: 34px; } .ui-datepicker-prev:before { content: '\f341'; } .ui-datepicker-next:before { content: '\f345'; } .ui-datepicker-prev-hover:before, .ui-datepicker-next-hover:before { opacity: 0.7; } select.ui-datepicker-month, select.ui-datepicker-year { width: 33%; background: transparent; border-color: transparent; box-shadow: none; color: #fff; option { color: #333; } } thead { color: #fff; font-weight: 600; th { font-weight: normal; } } th { padding: 10px; } td { padding: 0; border: 1px solid $weekend; } td.ui-datepicker-other-month { border: transparent; } td.ui-datepicker-week-end { background-color: $weekend; border: 1px solid $weekend; &.ui-datepicker-today { -webkit-box-shadow: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.1); box-shadow: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.1); } } td.ui-datepicker-today { background-color: #f0f0c0; } td.ui-datepicker-current-day { background: #bbdd88; } td .ui-state-default { background: transparent; border: none; text-align: center; text-decoration: none; width: auto; display: block; padding: 5px 10px; font-weight: normal; color: #444; } td.ui-state-disabled .ui-state-default { opacity: 0.5; } /* Default Color Scheme */ .ui-widget-header, .ui-datepicker-header { background: $freshblue; } thead { background: $freshdark; } td .ui-state-hover, td .ui-state-active { background: $freshdarkblue; color: #fff; } .ui-timepicker-div { font-size: 14px; dl { text-align: left; padding: 0 .6em; dt { float: left; clear:left; padding: 0 0 0 5px; } dd { margin: 0 10px 10px 40%; select { width: 100%; } } } + .ui-datepicker-buttonpane { padding: .6em; text-align: left; .button-primary, .button-secondary { padding: 0 10px 1px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin: 0 .6em .4em .4em; } } } } .admin-color-fresh { .cmb2-element.ui-datepicker, .cmb2-element .ui-datepicker { .ui-widget-header, .ui-datepicker-header { background: $freshblue; } thead { background: $freshdark; } td .ui-state-hover { background: $freshdarkblue; color: #fff; } } } .admin-color-blue { .cmb2-element.ui-datepicker, .cmb2-element .ui-datepicker { .ui-widget-header, .ui-datepicker-header { background: #52accc; } thead { background: #4796b3; } // td .ui-state-hover { // background: #096484; // } td { .ui-state-hover, .ui-state-active { background: #096484; color: #fff; } &.ui-datepicker-today { background: #eee; } } } } .admin-color-coffee { .cmb2-element.ui-datepicker, .cmb2-element .ui-datepicker { .ui-widget-header, .ui-datepicker-header { background: #59524c; } thead { background: #46403c; } td .ui-state-hover { background: #c7a589; color: #fff; } } } .admin-color-ectoplasm { .cmb2-element.ui-datepicker, .cmb2-element .ui-datepicker { .ui-widget-header, .ui-datepicker-header { background: #523f6d; } thead { background: #413256; } td .ui-state-hover { background: #a3b745; color: #fff; } } } .admin-color-midnight { .cmb2-element.ui-datepicker, .cmb2-element .ui-datepicker { .ui-widget-header, .ui-datepicker-header { background: #363b3f; } thead { background: #26292c; } td .ui-state-hover { background: #e14d43; color: #fff; } } } .admin-color-ocean { .cmb2-element.ui-datepicker, .cmb2-element .ui-datepicker { .ui-widget-header, .ui-datepicker-header { background: #738e96; } thead { background: #627c83; } td .ui-state-hover { background: #9ebaa0; color: #fff; } } } .admin-color-sunrise { .cmb2-element.ui-datepicker, .cmb2-element .ui-datepicker { .ui-widget-header, .ui-datepicker-header, .ui-datepicker-header .ui-state-hover { background: #cf4944; } th { border-color: #be3631; background: #be3631; } td .ui-state-hover { background: #dd823b; color: #fff; } } } .admin-color-light { .cmb2-element.ui-datepicker, .cmb2-element .ui-datepicker { .ui-widget-header, .ui-datepicker-header { background: #e5e5e5; } select.ui-datepicker-month, select.ui-datepicker-year { color: #555; } thead { background: #888; } .ui-datepicker-title, td .ui-state-default, .ui-datepicker-prev:before, .ui-datepicker-next:before { color: #555; } td { .ui-state-hover, .ui-state-active { background: #ccc; } &.ui-datepicker-today { background: #eee; } } } } .admin-color-bbp-evergreen { .cmb2-element.ui-datepicker, .cmb2-element .ui-datepicker { .ui-widget-header, .ui-datepicker-header { background: #56b274; } thead { background: #36533f; } td .ui-state-hover { background: #446950; color: #fff; } } } .admin-color-bbp-mint { .cmb2-element.ui-datepicker, .cmb2-element .ui-datepicker { .ui-widget-header, .ui-datepicker-header { background: #4ca26a; } thead { background: #4f6d59; } td .ui-state-hover { background: #5fb37c; color: #fff; } } } partials/_main_wrap.scss000066600000013241152141673120011403 0ustar00/*-------------------------------------------------------------- Main Wrap --------------------------------------------------------------*/ .cmb2-wrap { margin: 0; input, textarea { font-size: $font-size; max-width: 100%; padding: 5px; } input[type=text] { &.cmb2-oembed { width: 100%; } } textarea { width: 500px; &.cmb2-textarea-code { font-family: $font-mono; line-height: 16px; } } input { &.cmb2-text-small, &.cmb2-timepicker { width: 100px; // margin-right: 15px } &.cmb2-text-money { width: 90px; // margin-right: 15px } &.cmb2-text-medium { width: 230px; // margin-right: 15px } &.cmb2-upload-file { width: 65%; } &.ed_button { padding: 2px 4px; } &:not([type="hidden"]) { + input, + .button, + select { margin-left: 20px; } } } ul { margin: 0; } li { font-size: $font-size; line-height: 16px; margin: 1px 0 5px 0; } // .cmb-field-list .cmb-field-list { // padding-top:5px; // margin: 0; // } select { font-size: $font-size; margin-top: 3px; } input:focus, textarea:focus { background: $light-yellow; } input[type="radio"] { margin: 0 5px 0 0; padding: 0 } input[type="checkbox"] { margin: 0 5px 0 0; padding: 0; } button, .button { white-space: nowrap; } .mceLayout { border: 1px solid $light-gray !important; } .mceIframeContainer { background: #fff; } .meta_mce { width: 97%; textarea { width: 100%; } } // /** // * Color picker // */ .wp-color-result, .wp-picker-input-wrap { vertical-align: middle; } .wp-color-result, .wp-picker-container { margin: 0 10px 0 0; } .cmb-row { margin: 0; &:after { content: ''; clear: both; display: block; width: 100%; } &.cmb-repeat-row { padding: 1.8em 0 0; &:first-of-type { padding: 0; } } &.cmb-repeat .cmb2-metabox-description { padding-top: 0; padding-bottom: 1.8em; } } } .cmb2-metabox { clear: both; margin: 0; > .cmb-row:first-of-type >, .cmb-field-list > .cmb-row:first-of-type > { .cmb-td, .cmb-th { border: 0; } } > .cmb-row { .cmb-repeat-table .cmb-row > .cmb-td { padding-right: 20px; box-sizing: border-box; float: left; } } } .cmb-add-row { margin: 1.8em 0 0; } .cmb-nested .cmb-td, .cmb-repeatable-group .cmb-th, .cmb-repeatable-group:first-of-type { border: 0; } .cmb-row:last-of-type, .cmb2-wrap .cmb-row:last-of-type, .cmb-repeatable-group:last-of-type { border-bottom: 0; } .cmb-repeatable-grouping { border: 1px solid $light-gray; padding: 0 1em; max-width: 1000px; &.cmb-row { margin: 0 0 0.8em; } + .cmb-repeatable-grouping { } } .cmb-th { color: $dark-gray; float: left; font-weight: 600; line-height: 1.3; padding: 20px 10px 20px 0; vertical-align: top; width: 200px; @media (max-width: $mobile-break) { @include fullth; } } .cmb-td { line-height: 1.3; max-width: 100%; padding: 15px 10px; vertical-align: middle; } .cmb-type-title { .cmb-td { padding: 0; } } .cmb-th label { display: block; padding: 5px 0; } .cmb-th + .cmb-td { float: left; } .cmb-td .cmb-td { padding-bottom: 1em; } .cmb-remove-row { text-align: right; } .empty-row.hidden { display: none; } .cmb-repeatable-group { .cmb-th { padding: 5px; } .cmb-group-title { background-color: $light-gray; padding: 8px 12px 8px 2.2em; margin: 0 -1em; min-height: 1.5em; font-size: 14px; line-height: 1.4; h4 { border: 0; margin: 0; font-size: 1.2em; font-weight: 500; padding: 0.5em 0.75em; } .cmb-th { display: block; width: 100%; } } .cmb-group-description .cmb-th { @include fullth; } .cmb-shift-rows { font-size: 1em; margin-right: 1em; text-decoration: none; .dashicons { font-size: 1.5em; height: 1.5em; line-height: 1.2em; width: 1em; &.dashicons-arrow-down-alt2 { line-height: 1.3em; } } } .cmb2-upload-button { float: right; } } p.cmb2-metabox-description { color: $gray; font-style: italic; margin: 0; padding-top: .5em; } span.cmb2-metabox-description { color: $gray; font-style: italic; } .cmb2-metabox-title { margin: 0 0 5px 0; padding: 5px 0 0 0; font-size: 14px; } .cmb-inline ul { padding: 4px 0 0 0; } .cmb-inline li { display: inline-block; padding-right: 18px; } .cmb-type-textarea-code pre { margin: 0; } .cmb2-media-status { .img-status { clear: none; display: inline-block; vertical-align: middle; margin-right: 10px; width: auto; img { max-width: 350px; height: auto; } } .img-status img, .embed-status { background: $white; border: 1px solid $light-gray; border-radius: 2px; -moz-border-radius: 2px; margin: 15px 0 0 0; padding: 5px; } .embed-status { float: left; max-width: 800px; } .img-status, .embed-status { position: relative; .cmb2-remove-file-button { background: url(../images/ico-delete.png); height: 16px; left: -5px; position: absolute; text-indent: -9999px; top: -5px; width: 16px; } } .img-status { .cmb2-remove-file-button { top: 10px; } } .img-status img, .file-status > span { cursor: pointer; } } .cmb-type-file-list .cmb2-media-status .img-status { clear: none; vertical-align: middle; width: auto; margin-right: 10px; margin-bottom: 10px; margin-top: 0; } .cmb-attach-list li { clear: both; display: inline-block; width: 100%; margin-top: 5px; margin-bottom: 10px; img { cursor: move; float: left; margin-right: 10px; } } .cmb2-remove-wrapper { margin: 0; } .child-cmb2 .cmb-th { text-align: left; } @media (max-width: $mobile-break) { .cmb-th, .cmb-td, .cmb-th + .cmb-td { display: block; float: none; width: 100%; } } partials/index.php000066600000000032152141673120010204 0ustar00 .cmb-field-list > .cmb-row { padding: 1.4em 0; } input { &[type=text]:not( .wp-color-picker ) { width: 100%; } + input:not( .wp-picker-clear ), + select { margin-left: 0; margin-top: 1em; display: block; } &.cmb2-text-money { max-width: 70%; + .cmb2-metabox-description { display: block; } } } label { display: block; font-weight: 700; padding: 0 0 5px; } } textarea { max-width: 99%; } .cmb-repeatable-group { border-bottom: 1px solid $light-gray; } .cmb-type-group > .cmb-td > .cmb-repeatable-group { border-bottom: 0; margin-bottom: -1.4em; } .cmb-th, .cmb-td, .cmb-th + .cmb-td { width: 100%; display: block; float: none; } .closed .inside { display: none; } .cmb-td .cmb-td { padding-bottom: 1em; } .cmb-th { @include fullth_side; padding-left: 0; padding-right: 0; } .cmb-group-description { .cmb-th { padding-top: 0; } .cmb2-metabox-description { padding: 0; } } .cmb-group-title { // padding-bottom: 0; .cmb-th { padding: 0; } } .cmb-repeatable-grouping { + .cmb-repeatable-grouping { margin-top: 1em; } } .cmb2-media-status { .img-status, .embed-status { img { max-width: 90%; // width: auto; height: auto; } } } .cmb2-list label { display: inline; font-weight: normal; } .cmb2-metabox-description { display: block; padding: 7px 0 0; } .cmb-type-checkbox { .cmb-td label, .cmb2-metabox-description { font-weight: normal; display: inline; } } .cmb-row .cmb2-metabox-description { padding-bottom: 1.8em; } .cmb2-metabox-title { font-size: 1.2em; font-style: italic; } .cmb-remove-row { clear: both; padding-top: 12px; padding-bottom: 0; } .cmb-type-colorpicker .cmb-repeat-row { .cmb-td { width: auto; clear: none; float: left; padding-top: 0; &.cmb-remove-row { float: right; margin: 0; } } } .cmb2-upload-button { clear: both; margin-top: 12px; } } cmb2-display.scss000066600000000065152141673120007736 0ustar00/** * CMB2 Styling */ @import "partials/display";