$color_0: #232629; $color_1: lighten($color_0, 1%); // 25292c $color_2: lighten($color_0, 4%); // 2c3034 $color_3: lighten($color_0, 10%); // 3a4045 $color_4: lighten($color_0, 12%); // 3f454a $color_5: lighten($color_0, 15%); // 464c52 $color_6: lighten($color_0, 20%); // 525960 $color_7: lighten($color_0, 32%); // 6e7881 $color_8: lighten($color_0, 45%); // 9199a1 $color_9: lighten($color_0, 60%); // babfc4 $color_10: lighten($color_0, 78%); // ebedee $color_11: lighten($color_0, 83%); // f9fafa $color_12: #ff5c57; $color_13: #f28482; $color_14: #6eafa0; $color_15: #1abc9c; $color_16: #f8f9fa; /* WordPress Core START */ .alignnone { margin: 5px 0 20px 0; } .aligncenter, div.aligncenter { display: block; margin: 5px auto 5px auto; } .alignright { float: right; margin: 5px 0 20px 20px; } .alignleft { float: left; margin: 5px 20px 20px 0; } a img { &.alignright { float: right; margin: 5px 0 20px 20px; } &.alignnone { margin: 5px 0 20px 0; } &.alignleft { float: left; margin: 5px 20px 20px 0; } &.aligncenter { display: block; margin-left: auto; margin-right: auto; } } .wp-caption { background: #fff; border: 1px solid #f0f0f0; max-width: 96%; /* Image does not overflow the content area */ // padding: 5px 3px 10px; text-align: center; &.alignnone, &.alignleft { margin: 5px 20px 20px 0; } &.alignright { margin: 5px 0 20px 20px; } img { border: 0 none; height: auto; margin: 0; max-width: 98.5%; padding: 0; width: auto; } p.wp-caption-text { font-size: 11px; line-height: 17px; margin: 0; padding: 0 4px 5px; } } .bypostauthor, .gallery-caption { display: block; } /* WordPress Core END */ body { word-wrap: break-word; } body, a, button, input, optgroup, select, textarea { font-family: 'Roboto', sans-serif; } a { color: $color_12; transition: all .2s ease-in-out; &:hover { color: $color_12; } } // .h1, .h2, .h3, .h4, h1, h2, h3, h4 { // font-weight: lighter; // } input { &::-ms-clear { display: none; } &[type="search"] { &::-webkit-search-cancel-button { display: none; } } } input, textarea { &:focus { &::placeholder { opacity: 0; } } } /*.form-control { &::placeholder { color: $color_9; } }*/ /*.search-form, .post-password-form { .form-control { &::placeholder { color: $color_8; } } }*/ dl, ol, ul { padding-left: 1rem; } #content { ul:not(.pagination):not(#toc):not(#sidebar-toc):not(ul[data-toc]) li { list-style-type: square; &::marker { color: $color_13; } } ol li { &::marker { color: $color_13; } } .article-body > { ul, ol { > li { margin-bottom: 1rem; line-height: 1.5; } } } // h2 ~ ul:first-of-type, #toc, #sidebar-toc, ul[data-toc] { font-size: 1.063rem; margin-bottom: 2.5rem; padding: 1.125rem 1.25rem; border: 1px solid rgba(0, 0, 0, .08); border-radius: .25rem; ul { padding-left: 1.5rem; } li { margin-bottom: 0; a { display: inline-flex; margin-top: .125rem; margin-bottom: .125rem; transition: none; &:hover { text-decoration: none; background-color: lighten($color_12, 31%); } } } } #sidebar-toc { li { a { display: block; padding-top: 0.125rem !important; padding-bottom: 0.125rem !important; // line-height: 1.3; &.active { color: $color_12; background-color: lighten($color_12, 31%); } } // &:hover { // > ul { // display: block; // } // } // > { // ul { // display: none; // } // a.active + ul { // display: block; // } // } } } #comments { > ol li, ul li.page-item { list-style: none; } article { &.comment-body { display: flex; flex-wrap: wrap; .comment-meta, .comment-content { width: 100%; } .reply { align-self: center; } .comment-votes { margin-left: auto; .disabled { opacity: 1; } button { .dashicons { vertical-align: inherit; font-size: 1.125rem; } &:first-child { color: $color_14; } &:last-child { color: $color_13; } &:hover:not(:active) { opacity: .7; } } } } } #reply-title { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; > small { margin-top: 1rem; margin-bottom: 1rem; } } } } .page-link { color: $color_12; transition: none; &:hover, &:focus { color: $color_12; border-color: $color_12; background-color: #fff; box-shadow: none; } } .pagination { .page-item { &.active .page-link { border-color: $color_12; background-color: $color_12; } &.disabled .page-link { color: $color_9; } } } .single #main .articles { img.wp-post-image { filter: brightness(.93); } // a { // text-decoration: underline; // &:hover { // text-decoration: none; // } // } } pre { margin-bottom: 1rem !important; border-radius: .25rem; padding: 1rem; tab-size: 4; background-color: $color_11; > code { display: inline-block !important; } // &[class*="language-"] { // color: #495057; // } &.wp-block-code { margin-bottom: 1rem !important; > code { white-space: pre; background-color: $color_11; } } } code { color: #516c7b; background-color: $color_11; // padding: .125rem .25rem; padding-left: .125rem; padding-right: .125rem; border-radius: .25rem; line-height: 1.4; // &[class*="language-"] { // color: #495057; // background-color: $color_11 !important; // } } :not(pre) > code[class*="language-"] { word-break: break-all !important; } kbd { background-color: $color_7; } // .token.important, // .token.regex, // .token.variable { // color: #495057; // } // .token.important { // font-weight: inherit; // } .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; &:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, .6); clip: auto !important; clip-path: none; color: #21759b; display: block; font-size: 14px; font-size: .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; } } #content[tabindex="-1"]:focus { outline: 0; } .site-main { .comment-navigation, .posts-navigation, .post-navigation { margin: 1rem 0; overflow: hidden; } } .comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous { float: left; width: 50%; } .comment-navigation .nav-next, .posts-navigation .nav-next, .post-navigation .nav-next { float: right; text-align: right; width: 50%; } .jumbotron { border-radius: 0; padding: 0; // background-image: linear-gradient(287deg, $color_0, $color_1); background-color: $color_2; position: relative; overflow: hidden; } .bg-dark { background-color: $color_1 !important; } // .form-control { // color: $color_9; // background-color: #fff; // } .badge-primary { background-color: $color_7; } .bg-secondary { background-color: $color_3 !important; } .home #content .list-group-item, .exact-match .post.card, .card-columns .post.card { &:hover, &:focus { box-shadow: 0 0 12px 0 $color_10; background-color: $color_11; } } .list-group-item-light.list-group-item-action { color: $color_12; &:hover { color: $color_12; } } .breadcrumb { font-weight: lighter; background-color: transparent; color: $color_12; a { color: rgba(255, 255, 255, .7); text-transform: uppercase; font-size: .75rem; } } .breadcrumb_last { color: rgba(255, 255, 255, .7); text-transform: uppercase; font-size: .75rem; } .breadcrumb { a { text-decoration: underline; &:hover { text-decoration: none; } } .dashicons-admin-home { width: .875rem; height: auto; font-size: 1rem; vertical-align: text-bottom; text-decoration: none; } } .taglist { color: $color_12; } .frontpage-title { position: relative; font-weight: lighter; color: $color_9; // text-shadow: 0 3px 10px #421a35, 0 0 0 #6d3b60; z-index: 1; } .page-title, .entry-title, .lead { font-weight: lighter; color: $color_9; text-shadow: 0 3px 10px $color_2; } .home .entry-title { text-shadow: none; } .jumbotron-inner { position: relative; } .jumbotron-title { min-height: 11rem; &::before { content: ""; min-height: 11rem; } } .x-back { position: absolute; transform: rotate(-57deg); background: $color_4; width: 30rem; height: 4rem; right: -6rem; top: 30%; } .x-front { position: absolute; transform: rotate(57deg); background: $color_5; box-shadow: 0 0 40px 0 #24282a; width: 30rem; height: 4rem; right: -6rem; top: 30%; } body[class*="articles"] { .search-form .form-control { &:valid + input + .input-group-append > .search-reset { display: flex !important; } } } .search-form, .post-password-form { .form-control { background-color: $color_5; border-color: $color_5; box-shadow: none; color: $color_9; z-index: 3; &:focus { border-color: $color_5; } &:valid + .input-group-append > .search-reset { display: flex !important; } &.ui-autocomplete-loading { background-image: url("../img/search-spinner.svg"); background-repeat: no-repeat; background-position: right .25rem center; background-size: 1rem 1rem; & + .input-group-append > .search-reset { display: none !important; } } } .input-group-append { .btn:focus, .input-group-prepend .btn:focus { z-index: 2; } .search-reset { top: 0; bottom: 0; width: 1.5rem; left: -1.437rem; cursor: default; z-index: 3; &:focus { z-index: 3; } } } ul.ui-autocomplete { z-index: 99992; >li { cursor: pointer; &:first-child { // border-top-left-radius: 0; border-top-right-radius: 0; } &:hover { background-color: $color_11; } &.ui-state-focus { color: #eee; background-color: $color_3; border-color: $color_3; z-index: 2; } } } .ui-state-highlight { font-weight: bold; color: $color_12; } } .search #content .search-filters { display: flex !important; } .search-form, .post-password-form { .btn-outline-secondary { color: rgba(255, 255, 255, .7); background-color: $color_12; border-color: $color_12; &:hover { color: $color_9; background-color: $color_8; border-color: $color_8; } &.search-reset:not(:hover) { color: $color_8; } } } .btn { transition: all .2s ease-in-out; } .btn-outline-primary { color: $color_12; border-color: $color_12; background-color: transparent; &:hover { background-color: $color_12; border-color: $color_12; } &:not(:disabled):not(.disabled) { &.active, &:active { color: $color_12; background-color: transparent; border-color: $color_12; } } } .show>.btn-outline-primary.dropdown-toggle { color: $color_12; background-color: transparent; border-color: $color_12; } .btn-primary { background-color: $color_12; border-color: $color_12; color: #fff; &:hover { color: $color_12; border-color: $color_12; background-color: white; } &:not(:disabled):not(.disabled) { &.active, &:active { color: $color_12; background-color: transparent; border-color: $color_12; } } } .show>.btn-primary.dropdown-toggle { color: $color_12; background-color: transparent; border-color: $color_12; } .btn-primary { &.disabled, &:disabled { color: #fff; background-color: $color_8; border-color: $color_8; } } .btn-outline-success:not(:disabled):not(.disabled) { &.active, &:active { background-color: $color_12; border-color: $color_12; } } .show>.btn-outline-success.dropdown-toggle { background-color: $color_12; border-color: $color_12; } .btn-outline-secondary { &.focus, &:focus { box-shadow: none; } } .btn-outline-success { &.focus, &:focus { box-shadow: none; } } .btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, .show > .btn-outline-secondary.dropdown-toggle { background-color: $color_8; border-color: $color_8; } .post-img-wrap { > img { object-fit: scale-down; } } .post-img-cover { display: block; position: absolute; top: -1rem; left: -1rem; right: -1rem; bottom: -1rem; background-repeat: no-repeat; background-position: center; background-size: cover; filter: blur(14px); opacity: .4; } .widget { margin: 0 0 1rem; overflow: hidden; &:last-child { margin-bottom: 0; } } .widget-title { font-size: 1.5rem; margin-bottom: 1rem; color: $color_6; } table { margin: 0 0 1.5rem; width: 100%; } blockquote { position: relative; color: $color_3; background-color: $color_11; border: 1px solid rgba(0, 0, 0, .125); border-radius: .25rem !important; padding: .75rem 1.25rem; margin-top: 1rem; margin-bottom: 1rem; &::before { position: absolute; content: ""; top: -.188rem; right: -.188rem; font-size: 20px; line-height: 1; font-family: dashicons; font-weight: lighter; font-style: normal; text-align: center; color: $color_7; } p { margin: 0; } code { background-color: $color_11 !important; } } .dropdown-item { &.active, &:active { background-color: $color_9; } } #wp-comment-cookies-consent { margin-right: 1rem; } .wpcf7-form label { width: 100%; } div.wpcf7-mail-sent-ok { border: 1px solid $color_8; text-align: center; } span.wpcf7-not-valid-tip { color: $color_12; } .wpcf7-response-output { text-align: center; } div { &.wpcf7-validation-errors, &.wpcf7-acceptance-missing { border: 2px solid $color_9; } } #main { :not(.wp-playlist-current-item) > img { &:not(.embed-responsive-item) { max-width: 100%; height: auto; } } } body:not(.single) { #main { :not(.wp-playlist-current-item) > img { &.embed-responsive-item { object-fit: cover; filter: brightness(.93); transition: all 0.5s ease-in-out; &:hover { transform: scale(1.02, 1.02); filter: none; } } } } } .post-nav { .wp-post-image { transition: all .2s ease-in-out; } .post-nav-inner { .wp-post-image { height: 100%; object-fit: cover; filter: brightness(.93); } &:hover { .wp-post-image { opacity: .7; } } } } .single-post #main img[src$=".png"] { padding: 1rem; background-color: #000; border-bottom: 1px solid #1c1c1c; } body:not([class*="articles"]) { &.single-post #main img[src$=".png"], &.archive.category #main img[src$=".png"], &.archive.tag #main img[src$=".png"], &.search #main img[src$=".png"] { filter: invert(.99); } } .archive { .articles { .archive-title a { &, &:focus, &:hover { color: $color_6 !important; } } .card-text { margin-bottom: .5rem; } .dashicons { width: .938rem; height: .938rem; font-size: .938rem; color: $color_8 !important; } } } .tags-links .dashicons { width: .938rem; height: .938rem; font-size: .938rem; } .form-control:focus { border-color: $color_9; box-shadow: none; } .btn-outline-secondary:not(:disabled):not(.disabled) { &.active:focus, &:active:focus { box-shadow: none; } } .show>.btn-outline-secondary.dropdown-toggle:focus { box-shadow: none; } .btn-outline-primary:not(:disabled):not(.disabled) { &.active:focus, &:active:focus { box-shadow: none; } } .show>.btn-outline-primary.dropdown-toggle:focus { box-shadow: none; } .btn-outline-primary { &.focus, &:focus { box-shadow: none; } } .btn-primary { &.focus, &:focus { color: #fff; background-color: $color_12; border-color: $color_12; box-shadow: none; } &:not(:disabled):not(.disabled) { &.active:focus, &:active:focus { box-shadow: none; } } } .show>.btn-primary.dropdown-toggle:focus { box-shadow: none; } .pre-wrap { position: relative; background-color: $color_2; border-top-left-radius: .25rem; border-top-right-radius: .25rem; box-shadow: 0 4px 16px 1px rgba(59, 64, 69, 0.5); &::after { content: ""; position: absolute; top: .188rem; left: .188rem; width: 57px; height: 19px; background-image: url(../img/buttons-terminal.svg); background-repeat: no-repeat; background-size: 57px 19px; } >pre { border-radius: 0; } } #masthead { // position: sticky; // top: 0; // left: 0; // right: 0; // z-index: 99992; .menu-item a { text-transform: uppercase; font-size: .75rem; } // .search-filters .custom-select { // color: $color_0; // border-color: $color_8; // background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='%23232629' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right .75rem (center / 8px) 10px; // background-color: $color_8; // } } // .custom-checkbox .custom-control-input:checked~.custom-control-label::before { // background-color: $color_12; // } // .custom-control-label::before { // background-color: #b49bad; // } .search-filters .input-group-text { width: 3rem; border-color: $color_7; background-color: $color_7; } .custom-control-label::before { border: $color_7 solid 1px; background-color: $color_7; } .custom-switch .custom-control-label::after { background-color: $color_7; } .custom-control-input:focus:not(:checked) ~ .custom-control-label::before { border-color: $color_7; } .custom-control-input:checked ~ .custom-control-label::before { border-color: $color_7; background-color: $color_7; } // .custom-control-input:focus~.custom-control-label::before { // box-shadow: none; // } .custom-switch .custom-control-input:checked ~ .custom-control-label::after { background-color: $color_7; } .custom-control-input:not(:disabled):active ~ .custom-control-label::before { background-color: $color_8; border-color: $color_8; } .custom-control-input.is-invalid ~ .custom-control-label, .was-validated .custom-control-input:invalid ~ .custom-control-label { color: $color_12; } .custom-control-input.is-invalid ~ .custom-control-label::before, .was-validated .custom-control-input:invalid ~ .custom-control-label::before { border-color: $color_12; } .custom-control-input.is-valid ~ .custom-control-label, .was-validated .custom-control-input:valid ~ .custom-control-label { color: $color_15; a { color: $color_15; } } .custom-control-input.is-valid ~ .custom-control-label::before, .was-validated .custom-control-input:valid ~ .custom-control-label::before { border-color: $color_15; } .custom-control-input.is-valid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:valid:checked ~ .custom-control-label::before { border-color: $color_15; background-color: $color_15; } .custom-control-label { &::before { box-shadow: none !important; } } .navbar-dark .navbar-toggler { border-color: transparent; } .entry-content, .article-body .wp-block-paragraph { line-height: 1.8; } .entry-content { ol[start] > li { font-size: 1.75rem; font-weight: lighter; } .tooltip-txt { color: $color_12; cursor: default; } } .article-body { h2:not(:first-of-type), h3, h4, h5, h6 { margin-top: 2.5rem; } } .tooltip { z-index: 99992; &.show { opacity: .95; } } .bs-tooltip-auto[x-placement^="top"] .arrow::before, .bs-tooltip-top .arrow::before { border-top-color: $color_12; } .bs-tooltip-auto[x-placement^="bottom"] .arrow::before, .bs-tooltip-bottom .arrow::before { border-bottom-color: $color_12; } .bs-tooltip-auto[x-placement^="left"] .arrow::before, .bs-tooltip-left .arrow::before { border-left-color: $color_12; } .bs-tooltip-auto[x-placement^="right"] .arrow::before, .bs-tooltip-right .arrow::before { border-right-color: $color_12; } .tooltip-inner { background-color: $color_12; padding-top: .5rem; padding-bottom: .5rem; line-height: 1; } .custom-select:focus { box-shadow: none; } // .search-filters .custom-select { // font-size: .75rem; // color: $color_3; // border-color: $color_3; // } .badge-pill { border-radius: 10rem !important; } .comment-author-link { font-weight: bold; } .widget:not(:first-child) { padding-top: 1rem; border-top: 1px solid #dfdfdf; } .comments-title { margin-bottom: 3rem; } .comment-content { overflow: hidden; } .comment .children { padding-left: .5rem; } .comment-author.vcard { img { margin-right: .5rem; } } article.comment-body, footer.comment-meta { margin-bottom: 1rem; } ol.comment-list { padding: 0; margin-bottom: 3rem; } article.comment-body { // background-color: $color_11; padding: 1.25rem; border: 1px solid $color_10; } .comment-metadata { &, .edit-link { > a { color: $color_8; font-size: .875rem; } } } #main, .is-root-container { table { // border-collapse: initial; thead > tr > th { text-align: center; background-color: $color_10; } tbody > tr > td { background-color: $color_11; } thead > tr > th, tbody > tr > td { padding: .5rem; } } } #secondary { .sticky-top { top: .5rem; } ul { li { font-size: .9375rem; } } // #toc, // #sidebar-toc, // ul[data-toc] { // li { // line-height: 1.4; // } // } .card { #recentcomments { color: $color_7; margin-bottom: 0; .recentcomments { a { display: block !important; } &:not(:last-child) { margin-bottom: 1rem; } } } ul { margin: 0; li { list-style-type: none; } > li { > ul { padding: 0; } } } } } .meta-text { font-size: .875rem; } // .package-install>span { // user-select: all; // } #main .card.archive-item { .archive-img-wrap { border-bottom: 1px solid rgba(0, 0, 0, .125); img { object-fit: scale-down; object-position: center; border-top-left-radius: calc(.25rem - 1px); border-top-right-radius: calc(.25rem - 1px); } } } .dropdown-menu { background-color: $color_9; } .dropdown-item { &:focus, &:hover { color: $color_9; background-color: $color_3; } } .toast { z-index: 99992; display: none; } #arrow-up { display: none; left: auto; width: 2.5rem; height: 2.5rem; color: $color_12; background-color: rgba(255, 255, 255, .7); box-shadow: 0 6px 20px -5px rgba(0, 0, 0, .3), 0 0 0 1px rgba(0, 0, 0, .06); z-index: 99991; } .search-highlight { color: $color_12; } .exact-match .card-header .search-highlight { background-color: inherit !important; border: 0 !important; } .custom-switch .custom-control-label::after { transition: transform .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; } .dashicons { transition: none; } .search-cat-link { text-decoration: underline; &:hover { text-decoration: none; } } .package-install-wrap { .package-install { font-size: 87.5%; font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; white-space: pre; overflow: auto; color: #d6e0e2; } .package-install-copy { visibility: hidden; cursor: pointer; color: $color_12; } &:hover > .package-install-copy { visibility: visible; } } #content { .mejs-controls .mejs-time-rail .mejs-time-current { background: $color_12; } .mejs-container, .mejs-container .mejs-controls, .mejs-embed, .mejs-embed body { background: $color_0; } .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current, .mejs-controls .mejs-time-rail .mejs-time-loaded { background: $color_9; } } .code-pre-wrap { position: relative; // > pre { // > code[class*="language-"] { // padding-right: .625rem; // } // } > .prism-theme, > .code-clipboard { position: absolute; top: .25rem; cursor: pointer; font-size: 1rem; } > .prism-theme { right: 1.125rem; } > .code-clipboard { right: 0; } > .dashicons { display: none; filter: brightness(1.2); } &:hover > .dashicons { display: inline; } } .wp-block-image figcaption { font-size: .875rem; font-style: italic; text-align: center; } .pre-wrap { .ya-share2__container.ya-share2__container_color-scheme_blackwhite .ya-share2__badge, .ya-share2__container.ya-share2__container_color-scheme_blackwhite .ya-share2__mobile-popup-badge { background-color: $color_6 !important; } } .alert-danger { color: $color_11; background-color: $color_12; border-color: $color_12; &:hover { color: $color_11; } } .alert-outline-danger { color: $color_12; background-color: #fff; border-color: $color_12; &.h5 { line-height: 1.5; } &:hover { color: $color_12; } } .ya-share2__container.ya-share2__container_color-scheme_blackwhite .ya-share2__badge, .ya-share2__container.ya-share2__container_color-scheme_blackwhite .ya-share2__mobile-popup-badge { background-color: $color_7 !important; } .ya-share2__container_mobile.ya-share2__container_size_m .ya-share2__icon { height: 24px !important; width: 24px !important; } .link-underline a { text-decoration: underline !important; &:hover { text-decoration: none !important; } } .reading-time { font-size: .875rem; .dashicons { color: $color_13; } } .trumbowyg-modal { overflow: visible; } .trumbowyg-box svg, .trumbowyg-modal svg { color: $color_7; fill: $color_7; } .trumbowyg-fullscreen .trumbowyg-button-group .trumbowyg-fullscreen-button svg { color: $color_7; } .trumbowyg-button-pane .trumbowyg-open-dropdown::after { border-top-color: $color_7; } .trumbowyg-dropdown button, .trumbowyg-modal-box .trumbowyg-modal-title { color: $color_7 !important; } .trumbowyg-modal-box .trumbowyg-modal-button.trumbowyg-modal-submit { background: $color_15; &:hover, &:focus, &:active { background: lighten($color_15, 4%); } } .trumbowyg-modal-box .trumbowyg-input-infos .trumbowyg-msg-error { color: $color_12; } .trumbowyg-modal-box .trumbowyg-input-error { input, select, textarea { outline-color: $color_12; } } .trumbowyg-pastecode-form-group { margin: 1rem .625rem; .trumbowyg-pastecode-form-control { width: 100%; border: 1px solid $color_9; font-size: .875rem; padding: .5rem; &.code { height: 12.5rem; &:focus-visible { outline: none; } } } } .trumbowyg-editor-box { background-color: $color_16; border-radius: .25rem; } .trumbowyg-box .trumbowyg-editor { min-height: 300px; } .trumbowyg-h1-dropdown-button { display: none !important; } .wp-block-embed-youtube { > .wp-block-embed__wrapper { position: relative; display: block; width: 100%; padding: 0; overflow: hidden; &::before { display: block; content: ""; padding-top: 56.25%; } > iframe { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0; } } } @media (max-width: 575px) { .lead { font-size: 1rem; } } /* BS4 Headings Responsive SRART */ h1, .h1 { font-size: 2.5rem; } @media (max-width: 1200px) { h1, .h1 { font-size: calc(1.375rem + 1.5vw); } } h2, .h2 { font-size: 2rem; } @media (max-width: 1200px) { h2, .h2 { font-size: calc(1.325rem + .9vw); } } h3, .h3 { font-size: 1.75rem; } @media (max-width: 1200px) { h3, .h3 { font-size: calc(1.3rem + .6vw); } } h4, .h4 { font-size: 1.5rem; } @media (max-width: 1200px) { h4, .h4 { font-size: calc(1.275rem + .3vw); } } h5, .h5 { font-size: 1.25rem; } h6, .h6 { font-size: 1rem; } /* BS4 Headings Responsive END */ @media (min-width: 576px) { .card-columns { column-count: 1; } .comment .children { padding-left: 2rem; } } @media (min-width: 768px) { .w-md-75 { width: 75% !important; } #masthead { .search-settings { display: flex !important; } #menu-main { & > .menu-item:last-child > .nav-link { padding-right: 0; } .dropdown-toggle { &::after { display: none; } } .dropdown:hover > .dropdown-menu { display: block; margin-top: 0; animation-name: example; animation-duration: .1s; } @keyframes example { from { opacity: .2; } to { opacity: 1; } } } } .card-columns { column-count: 2; } } @media (min-width: 992px) { pre { scrollbar-width: thin; &::-webkit-scrollbar { width: .625rem; height: .625rem; background-color: transparent; } &::-webkit-scrollbar-thumb { border: .063rem solid transparent; border-radius: .5rem; background-color: $color_9; background-clip: content-box; &:hover { background-color: $color_8; } } } #secondary { .sticky-top { height: calc(100vh - 1rem); overflow-y: auto; scrollbar-width: none; &::-webkit-scrollbar { width: 0; background-color: transparent; } } } .card-columns { column-count: 3; } #secondary { ul.ya-share2__list { width: 100%; display: flex; justify-content: space-between; } } } @media (min-width: 1200px) { .card-columns { column-count: 2; } #main { .card.archive-item { .archive-img-wrap { border-right: 1px solid rgba(0, 0, 0, .125); border-bottom: 0; img { object-fit: cover; object-position: left top; border-top-right-radius: 0; border-bottom-left-radius: calc(.25rem - 1px); } } } } #secondary { ul.ya-share2__list { justify-content: space-around; } } }