/*-------------------------------------------------------*/ /* Gutenberg Front-end Styles /*-------------------------------------------------------*/ div.blockst-negative-mt-100 { margin-top: -100px; } // Adjust columns breakpoint .wp-block-columns { flex-wrap: wrap !important; @include bp-lg-up { flex-wrap: nowrap !important; } } .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column { @include bp-lg-up { flex-basis: 0; flex-grow: 1; } @include bp-lg-down { flex-basis: 100% !important; } } /* Full-width Images -------------------------------------------------------*/ .alignwide { width: auto; max-width: none; position: relative; z-index: 1; @include bp-lg-up { margin-left: -140px; margin-right: -140px; } @include bp-xl-up { margin-left: -220px; margin-right: -220px; } } .alignfull { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); max-width: 100vw; width: auto; position: relative; z-index: 1; } .blockst-right-sidebar, .blockst-left-sidebar { .alignfull, .alignwide { max-width: 100%; margin-left: auto; margin-right: auto; } } .page.blockst-fullwidth .entry__article { .alignwide { margin-left: 0; margin-right: 0; } } /* Images -------------------------------------------------------*/ .wp-block-image { .alignleft { margin-right: 2em; max-width: 40%; @include bp-sm-down { float: none; margin-right: 0; } } .alignright { margin-left: 2em; max-width: 40%; @include bp-sm-down { float: none; margin-left: 0; } } } /* Cover -------------------------------------------------------*/ .wp-block-cover { font-size: 1rem; line-height: 1.3; &.alignleft { margin: 0.5em 2em 1.5em 0; } &.alignright { margin: 0.5em 0 1.5em 2em; } } .wp-block-cover, .wp-block-cover-image { padding: 2em; } .wp-block-cover-image .wp-block-cover-image-text, .wp-block-cover .wp-block-cover-text, section.wp-block-cover-image > h2 { font-size: 2.25em; } /* Tables -------------------------------------------------------*/ .wp-block-table { width: 100%; margin-bottom: 2rem; } .wp-block-table.is-style-stripes.has-subtle-light-gray-background-color tr:nth-child(odd), .wp-block-table.is-style-stripes tr:nth-child(odd) { background-color: #f9f9f9; } /* Latest Comments -------------------------------------------------------*/ ol.wp-block-latest-comments { padding-left: 0; } /* Galleries -------------------------------------------------------*/ ul.wp-block-gallery, .wp-block-gallery ul { list-style: none; padding-left: 0; } /* Captions -------------------------------------------------------*/ .wp-block-image figcaption, .wp-block-embed figcaption, .wp-block-audio figcaption { color: var(--wp--preset--color--tertiary); } .wp-block-image figcaption { margin-top: 1em; } /* Separators -------------------------------------------------------*/ hr { margin-top: 20px; margin-bottom: 20px; border: 0; opacity: 1; border-top: 1px solid var(--deo-border-color); } .wp-block-separator { border-top: 0; border-color: var(--deo-border-color); } .wp-block-separator:not(.is-style-wide):not(.is-style-dots), .wp-block-separator.is-style-default { max-width: 100px; margin-left: auto; margin-right: auto; } .wp-block-separator.is-style-dots:before { font-weight: 500; color: var(--wp--preset--color--tertiary); } /* Blockquote / Pullquote -------------------------------------------------------*/ blockquote { overflow: hidden; } .wp-block-quote { &.has-text-align-center { border: 0; } &.has-text-align-right { border-left: 0; border-right-width: 3px; border-right-style: solid; } &.is-large, &.is-style-large { padding: 12px 40px; margin-top: 40px; margin-bottom: 40px; p { font-size: 2rem; } cite, footer { font-size: 1rem; } } } .wp-block-pullquote { text-align: left; position: relative; line-height: 1.5; padding: 0.1em 1em 0.2em 2.5em; margin-bottom: 30px; margin-top: 0; color: var(--wp--preset--color--secondary); &.alignleft, &.alignright { font-size: 1rem; } blockquote { margin: 0; border: 0; padding: 0; line-height: normal; } &::before { content: "“"; color: var(--wp--preset--color--primary); left: 0; top: 0; position: absolute; font-size: 5rem; line-height: 1; } p { color: inherit; } cite { opacity: 0.7; } blockquote:not(.has-text-color) cite { color: var(--wp--preset--color--tertiary); } @include bp-sm-up { &.alignleft { margin-right: 2em /*!rtl:end:ignore*/; } &.alignright { margin-left: 2em /*!rtl:end:ignore*/; } } } // Solid Color .wp-block-pullquote.is-style-solid-color { margin-top: 10px; padding: 40px 0; &::before { left: 10px; top: 10px; } &.alignleft blockquote p, &.alignright blockquote p { font-size: 1rem; } } /* Social Icons -------------------------------------------------------*/ ul.wp-block-social-links { padding: 0; .wp-social-link a:focus { color: currentColor; fill: currentColor; } } /* Latest Posts -------------------------------------------------------*/ .wp-block-latest-posts { &.wp-block-latest-posts__list { padding: 0; } &__post-title { display: block; font-size: 0.875rem; font-weight: var(--deo-heading-font-weigth); line-height: 1.3; } &__featured-image { margin-bottom: 10px; } &__post-author, &__post-date { font-size: 0.875rem; margin-top: 5px; } } /* Post Navigation -------------------------------------------------------*/ .wp-block-post-navigation-link { a { display: inline-flex; align-items: center; line-height: 1; font-weight: 600; color: var(--wp--preset--color--secondary); &:hover, &:focus { color: var(--wp--preset--color--primary); } } &.post-navigation-link-next a::after { content: "\e902"; font-family: "blockst"; margin-left: 6px; display: inline-block; } &.post-navigation-link-previous a::before { content: "\e901"; font-family: "blockst"; margin-right: 6px; display: inline-block; } }