.
- */
- & .icon--search {
- position: absolute;
- inset-block-start: 0;
- inset-inline-end: 0;
- display: block;
- width: 24px; /* Width of the SVG background image. */
- height: 100%;
- pointer-events: none;
- background-image: url("../../images/search--white.svg");
- background-repeat: no-repeat;
- background-position: center;
- background-size: contain;
-
- &::after {
- position: absolute;
- inset-block-end: 0;
- inset-inline-start: 0;
- width: 100%;
- height: 0;
- content: "";
- transition: transform 0.2s;
- transform: scaleX(0);
- transform-origin: left;
- border-block-start: solid var(--sp0-5) var(--color--primary-50);
- }
- }
-
- &:focus {
- outline: solid 4px transparent;
- outline-offset: -4px;
- box-shadow: none;
-
- & span::after {
- transform: scaleX(1);
- }
-
- @media screen and (-ms-high-contrast: active) {
- border-bottom-width: var(--sp0-5);
-
- & span::after {
- content: none;
- }
- }
- }
-
- @media screen and (-ms-high-contrast: active) {
- /* Edge's high contrast does show the background image, so we hide it. */
- & .icon--search {
- display: none;
- }
- }
- }
-}
-
-.block-search-wide__container {
- max-width: var(--max-width);
- padding-inline-end: var(--sp2);
-}
-
-.block-search-wide__grid {
- display: grid;
- grid-template-columns: repeat(var(--grid-col-count), 1fr);
- grid-column-gap: var(--grid-gap);
-}
-
-/* Override specificity from container-inline.module.css */
-.container-inline {
- & .block-search-wide__container {
- display: block;
- }
-
- & .block-search-wide__grid {
- display: grid;
- }
-}
-
-.block-search-wide__button {
- position: relative;
- display: none;
- width: var(--sp3);
- height: var(--sp6);
- cursor: pointer;
- color: var(--color-text-neutral-loud); /* Affects SVG search icon. */
- border: 0;
- background: transparent;
- -webkit-appearance: none;
-
- &:focus {
- position: relative;
- outline: 0;
-
- &::after {
- position: absolute;
- top: 50%;
- left: 50%;
- width: 80%;
- height: var(--sp3);
- content: "";
- transform: translate(-50%, -50%);
- border: solid 2px var(--color--primary-50);
- border-radius: 4px;
- }
- }
-
- &[aria-expanded="true"] {
- background: var(--color--black);
-
- &:focus::after {
- border-color: var(--color--white);
- }
-
- & .block-search-wide__button-close {
- &::before,
- &::after {
- position: absolute;
- top: 50%;
- left: 50%;
- width: var(--sp1-5);
- height: 0;
- content: "";
- border-block-start: solid 2px var(--color--white);
- }
-
- &::before {
- transform: translate(-50%, -50%) rotate(-45deg);
- }
-
- &::after {
- transform: translate(-50%, -50%) rotate(45deg);
- }
- }
-
- & svg {
- display: none;
- }
- }
-
- & svg {
- margin-inline-start: auto;
- margin-inline-end: auto;
- }
-
- @media (forced-colors: active) {
- background: ButtonFace;
-
- & path {
- fill: ButtonText;
- }
- }
-}
-
-/* Provide rudimentary access to site search if JS is disabled. */
-html:not(.js) .search-block-form:focus-within .block-search-wide__wrapper {
- visibility: visible;
- max-height: var(--sp8);
-}
-
-/* Necessary to override specificity of transpiled PostCSS properties from default input focus styling. */
-[dir] .block-search-wide__wrapper input[type="search"] {
- background-color: transparent;
- background-image: linear-gradient(var(--color--primary-50), var(--color--primary-50)); /* Two values are needed for IE11 support. */
- background-repeat: no-repeat;
- background-position: bottom left; /* LTR */
- background-size: 0% 10px;
-
- &:focus {
- background-size: 100% var(--sp0-5);
- }
-}
-
-[dir="rtl"] .block-search-wide__wrapper {
- & input[type="search"] {
- background-position: bottom right;
- }
-
- & .search-form__submit .icon--search::after {
- transform-origin: right;
- }
-}
-
-body:not(.is-always-mobile-nav) {
- & .block-search-wide__wrapper,
- & .block-search-wide__button {
- @media (--nav) {
- display: block;
- }
- }
-}
diff --git a/css/components/pcss/header-site-branding.pcss.css b/css/components/pcss/header-site-branding.pcss.css
deleted file mode 100755
index be075f8..0000000
--- a/css/components/pcss/header-site-branding.pcss.css
+++ /dev/null
@@ -1,120 +0,0 @@
-/**
- * @file
- * Site branding in header.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.site-branding {
- display: flex;
- flex-shrink: 1;
- align-items: flex-end;
- min-width: calc((2 * var(--grid-col-width)) + (2 * var(--grid-gap)) + var(--container-padding)); /* Span minimum of 2 column widths. */
- min-height: var(--sp3);
- margin-inline: calc(-1 * var(--container-padding)) var(--sp); /* Negative margin to break out of .container element. */
- padding-block: 0 var(--sp0-5);
- padding-inline-start: var(--container-padding);
- padding-inline-end: var(--container-padding);
- background-image: linear-gradient(160deg, var(--color--primary-50) 0%, var(--color--primary-40) 78.66%);
-
- @media (--sm) {
- min-height: var(--sp4);
- }
-
- @media (--md) {
- min-width: calc((4 * var(--grid-col-width)) + (4 * var(--grid-gap)) + var(--container-padding)); /* Span minimum of 4 column widths. */
- min-height: var(--sp6);
- padding-block-end: var(--sp);
- }
-
- @media (--lg) {
- min-width: calc((2 * var(--grid-col-width)) + (2 * var(--grid-gap)) + var(--container-padding)); /* Span minimum of 2 column widths. */
- }
-
- @media (--nav) {
- min-height: var(--site-header-height-wide);
- margin-inline-start: calc(-1 * var(--container-padding));
- padding-block: 0;
- }
-}
-
-[dir="rtl"] .site-branding {
- background-image: linear-gradient(-160deg, var(--color--primary-50) 0%, var(--color--primary-40) 78.66%);
-}
-
-.site-branding--bg-gray {
- background: var(--color--gray-100);
-}
-
-.site-branding--bg-white {
- background: var(--color--white);
-}
-
-.site-branding__inner {
- display: flex;
- align-items: center;
-
- & a {
- text-decoration: none;
- }
-
- @media (--nav) {
- height: var(--header-height-wide-when-fixed);
- padding-block: var(--sp0-5);
- padding-inline-start: 0;
- padding-inline-end: 0;
- }
-}
-
-.site-branding__logo {
- flex-shrink: 0;
- max-width: 100%;
-
- & img {
- width: auto;
- max-width: 100%;
- max-height: var(--sp2);
-
- @media (--sm) {
- max-height: var(--sp3);
- }
-
- @media (--md) {
- max-height: var(--sp4);
- }
-
- @media (--nav) {
- max-height: calc(var(--header-height-wide-when-fixed) - var(--sp));
- }
- }
-}
-
-.site-branding__text {
- color: var(--color--white);
- font-size: 18px;
- font-weight: bold;
-
- & a {
- color: inherit;
- }
-
- @media (--md) {
- font-size: 28px;
- line-height: 28px;
- }
-
- @media (--nav) {
- letter-spacing: 0.02em;
- font-size: 32px;
- line-height: var(--sp2);
- }
-}
-
-.site-branding--bg-gray .site-branding__text,
-.site-branding--bg-white .site-branding__text {
- color: var(--color--primary-50);
-}
-
-.site-branding__logo + .site-branding__text {
- margin-inline-start: 12px;
-}
diff --git a/css/components/pcss/header-sticky-toggle.pcss.css b/css/components/pcss/header-sticky-toggle.pcss.css
deleted file mode 100755
index de527ec..0000000
--- a/css/components/pcss/header-sticky-toggle.pcss.css
+++ /dev/null
@@ -1,91 +0,0 @@
-/**
- * @file
- * Sticky Header Toggle Button.
- *
- * This button shows on the left hand side of the header (in LTR layouts), and
- * toggles fixing the header to the top of the viewport.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.sticky-header-toggle {
- display: none;
-
- @media (--nav) {
- display: flex;
- flex-shrink: 0;
- align-items: center;
- justify-content: center;
- width: var(--content-left);
- height: var(--sp6);
- pointer-events: none;
- opacity: 0;
- border: 0;
- outline: 0;
- background-color: var(--color--primary-50);
-
- &:focus {
- cursor: pointer;
- pointer-events: auto;
- opacity: 1;
- outline: solid 2px var(--color--white);
- outline-offset: -4px;
- }
- }
-}
-
-body:not(.is-always-mobile-nav) .is-fixed .sticky-header-toggle {
- @media (--nav) {
- visibility: visible;
- }
-}
-
-body.is-always-mobile-nav .sticky-header-toggle {
- @media (--nav) {
- visibility: hidden;
- }
-}
-
-.sticky-header-toggle__icon {
- --icon-bar-height: 3px;
- --icon-bar-space: 7px;
-
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- width: var(--sp2);
- height: calc((var(--icon-bar-height) * 3) + (var(--icon-bar-space) * 2));
- /* Height = 3 bars + 2 spaces */
- transition: opacity 0.2s;
- pointer-events: none;
- transform-style: preserve-3d;
-
- & > span {
- display: block;
- width: 100%;
- height: var(--icon-bar-height);
- transition: transform 0.2s;
- transform-origin: center;
- background-color: var(--color--white);
- }
-}
-
-.is-fixed .sticky-header-toggle {
- cursor: pointer;
- pointer-events: auto;
- opacity: 1;
-}
-
-[aria-checked="true"] .sticky-header-toggle__icon {
- & > span:nth-child(1) {
- transform: translateY(calc(var(--icon-bar-height) + var(--icon-bar-space))) rotate(-45deg);
- }
-
- & > span:nth-child(2) {
- opacity: 0;
- }
-
- & > span:nth-child(3) {
- transform: translateY(calc(0px - var(--icon-bar-height) - var(--icon-bar-space))) rotate(45deg);
- }
-}
diff --git a/css/components/pcss/hero.pcss.css b/css/components/pcss/hero.pcss.css
deleted file mode 100755
index 34ec1f4..0000000
--- a/css/components/pcss/hero.pcss.css
+++ /dev/null
@@ -1,43 +0,0 @@
-/**
- * @file
- * Main Hero.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.hero__content {
- grid-column: 1 / 7;
-
- @media (--grid-md) { /* 700px */
- grid-column: 3 / 13;
- }
-
- @media (--lg) {
- grid-column: 3 / 11;
- }
-}
-
-.hero__img {
- grid-column: 1 / 7;
- margin-block-start: var(--sp2);
- margin-block-end: var(--sp2);
-
- & img {
- width: 100%;
- }
-
- @media (--sm) {
- margin-block-start: var(--sp3);
- margin-block-end: var(--sp3);
- }
-
- @media (--grid-md) {
- grid-column: 1 / 15;
- margin-block-start: var(--sp4);
- margin-block-end: var(--sp4);
- }
-
- @media (--lg) {
- grid-column: 2 / 14;
- }
-}
diff --git a/css/components/pcss/links.pcss.css b/css/components/pcss/links.pcss.css
deleted file mode 100755
index 1848b79..0000000
--- a/css/components/pcss/links.pcss.css
+++ /dev/null
@@ -1,28 +0,0 @@
-/**
- * @file
- * Links component.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.links.inline {
- margin-inline-start: 0;
- padding-block: 0;
- padding-inline-start: 0;
- padding-inline-end: 0;
- list-style: none;
-
- & > * {
- display: inline;
-
- &:not(:last-child) {
- padding-inline-end: 1em;
- }
- }
-}
-
-.node--type-book .links.inline {
- @media (--md) {
- text-align: end;
- }
-}
diff --git a/css/components/pcss/maintenance-page.pcss.css b/css/components/pcss/maintenance-page.pcss.css
deleted file mode 100755
index 9d39b6a..0000000
--- a/css/components/pcss/maintenance-page.pcss.css
+++ /dev/null
@@ -1,27 +0,0 @@
-/**
- * @file
- * Maintenance page.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.maintenance-page {
- & .site-header__initial {
- @media (--nav) {
- flex-shrink: 0;
- width: var(--content-left);
- }
- }
-
- & .main-content {
- min-height: 80vh;
- }
-}
-.maintenance-page-icon {
- display: block;
- margin-block: var(--sp3);
-
- & path {
- fill: var(--color--primary-50);
- }
-}
diff --git a/css/components/pcss/messages.pcss.css b/css/components/pcss/messages.pcss.css
deleted file mode 100755
index cb2538b..0000000
--- a/css/components/pcss/messages.pcss.css
+++ /dev/null
@@ -1,159 +0,0 @@
-/**
- * @file
- * Messages.
- */
-
-@import "../base/media-queries.pcss.css";
-
-:root {
- --messages-icon-size: 32px;
-}
-
-.messages-list {
- margin-block: var(--sp1);
- padding-block: 0;
- padding-inline-start: 0;
- padding-inline-end: 0;
- list-style: none;
-}
-
-.messages {
- min-height: calc(var(--messages-icon-size) + 2 * var(--sp1));
- padding-block: var(--sp1);
- padding-inline-start: var(--sp1-5);
- padding-inline-end: var(--sp1-5);
- color: var(--color--white);
- outline: solid 1px transparent;
- background-color: var(--color--gray-5);
-
- & * {
- color: inherit;
- }
-
- /* Additional specificity to override contrib modules. */
- &.messages-list__item {
- background-image: none;
- }
-}
-
-.messages__list {
- margin-block: 0;
- margin-inline-start: 0;
- margin-inline-end: 0;
- padding-block: 0;
- padding-inline-start: 0;
- padding-inline-end: 0;
- list-style: none;
-}
-
-.messages:not(.hidden) ~ .messages {
- margin-block-start: var(--sp1);
-}
-
-.messages__item + .messages__item {
- margin-block-start: var(--sp0-5);
-}
-
-.messages__container {
- display: flex;
-}
-
-.messages__header {
- flex-shrink: 0;
- margin-inline-end: var(--sp1);
-
- &.no-icon {
- margin-inline-end: 0;
- }
-}
-
-.messages__content {
- overflow: auto; /* Ensure large code blocks can be scrolled to. */
- flex: 1;
- padding-block-start: 3px;
-}
-
-.messages__button {
- flex-shrink: 0;
- margin-inline-start: var(--sp1);
- padding-block-start: 3px;
-}
-
-.messages__close {
- position: relative;
- width: 25px;
- height: 25px;
- padding-block: 0;
- padding-inline-start: 0;
- padding-inline-end: 0;
- cursor: pointer;
- vertical-align: top;
- border: 0;
- background: none;
- appearance: none;
-
- &::before,
- &::after {
- position: absolute;
- top: 50%;
- left: 50%;
- display: block;
- width: 33px;
- height: 0;
- content: "";
- border-top: solid 2px var(--color--gray-60);
- }
-
- &::before {
- transform: translate(-50%, -50%) rotate(45deg);
- }
-
- &::after {
- transform: translate(-50%, -50%) rotate(-45deg);
- }
-
- &:hover {
- &::before,
- &::after {
- border-color: var(--color--white);
- }
- }
-
- &:focus {
- outline: 2px solid var(--color--primary-60);
- outline-offset: 2px;
- }
-}
-
-.messages__icon svg {
- vertical-align: top;
-}
-
-.messages--error .messages__icon svg {
- fill: var(--color--red);
-}
-
-.messages--warning .messages__icon svg {
- fill: var(--color--gold);
-}
-
-.messages--status .messages__icon svg {
- fill: var(--color--green);
-}
-
-.messages--info .messages__icon svg {
- fill: var(--color--primary-60);
-}
-
-.messages a {
- color: var(--color--white);
-}
-
-.messages pre {
- margin: 0;
-}
-
-.js-form-managed-file .messages {
- margin-block-end: var(--sp1);
- border-inline-start: solid 6px var(--color--red);
-}
diff --git a/css/components/pcss/node-preview-container.pcss.css b/css/components/pcss/node-preview-container.pcss.css
deleted file mode 100755
index 4321c52..0000000
--- a/css/components/pcss/node-preview-container.pcss.css
+++ /dev/null
@@ -1,34 +0,0 @@
-/**
- * @file
- * Node preview container styling.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.node-preview-container {
- padding-block: 0;
- padding-inline-start: var(--sp0-5);
- padding-inline-end: var(--sp0-5);
- background: var(--color--white);
- box-shadow: -36px 1px 36px rgba(0, 0, 0, 0.08); /* LTR */
-}
-
-[dir="rtl"] .node-preview-container {
- box-shadow: 36px 1px 36px rgba(0, 0, 0, 0.08);
-}
-
-.toolbar-vertical.toolbar-tray-open .node-preview-container {
- max-width: calc(100vw - var(--toolbar-tray-vertical-width) - var(--scrollbar-width));
-}
-
-.node-preview-form-select {
- display: flex;
- flex-wrap: wrap;
- align-items: center;
-}
-
-.node-preview-backlink {
- margin-block: var(--sp0-5);
- margin-inline-start: 0;
- margin-inline-end: auto;
-}
diff --git a/css/components/pcss/node-teaser.pcss.css b/css/components/pcss/node-teaser.pcss.css
deleted file mode 100755
index 6f956af..0000000
--- a/css/components/pcss/node-teaser.pcss.css
+++ /dev/null
@@ -1,116 +0,0 @@
-/**
- * @file
- * Node Teaser specific styles.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.node--view-mode-teaser {
- position: relative; /* Anchor after pseudo-element. */
- margin-block-end: var(--sp1-5);
-
- &::after {
- position: absolute;
- inset-block-end: 0;
- width: var(--sp3);
- height: 0;
- content: "";
- /* Intentionally not using CSS logical properties. */
- border-top: solid 2px var(--color--gray-95);
- }
-
- & .node__meta {
- margin-block-end: var(--sp);
-
- & a {
- color: var(--color-text-primary-medium);
- font-weight: bold;
- }
- }
-
- & .node__top-wrapper {
- display: flex;
- flex-wrap: wrap;
- align-items: center;
- margin: 0;
-
- @media (--lg) {
- position: relative; /* Anchor the image */
- }
- }
-
- & .primary-image {
- flex-shrink: 0;
- margin: 0;
- margin-block-end: var(--sp1);
- margin-inline-end: var(--sp1);
-
- /* Ensure title does not wrap under image until necessary. */
- & + .node__title {
- flex-basis: calc(100% - calc(4.5 * var(--sp)));
-
- @media (--lg) {
- flex-basis: auto;
- }
- }
-
- & a {
- display: block;
- }
-
- & img {
- width: calc(3.5 * var(--sp));
- height: calc(3.5 * var(--sp));
- object-fit: cover;
- border-radius: 50%;
-
- @media (--lg) {
- width: var(--grid-col-width);
- height: var(--grid-col-width);
- }
- }
-
- @media (--lg) {
- position: absolute;
- inset-block-start: 0;
- inset-inline-start: calc(-1 * ((var(--grid-col-width) + var(--grid-gap))));
- margin: 0;
- }
- }
-
- & .node__title {
- margin: 0;
- margin-block-end: var(--sp1);
- color: var(--color-text-neutral-loud);
- font-size: 24px;
- line-height: var(--line-height-base);
-
- @media (--lg) {
- font-size: var(--sp2);
- line-height: var(--sp3);
- }
- }
-
- & .field--tag-ref {
- margin-block-start: var(--sp1);
- margin-block-end: 0;
- margin-inline-start: 0;
- margin-inline-end: 0;
- padding-block: 0;
- padding-inline-start: 0;
- padding-inline-end: 0;
- background-color: transparent;
-
- @media (--lg) {
- margin-block-start: var(--sp2);
- }
- }
-
- @media (--lg) {
- margin-block-end: var(--sp3);
- }
-}
-
-.views-row:last-child .node--view-mode-teaser {
- margin-block-end: 0;
-}
diff --git a/css/components/pcss/node.pcss.css b/css/components/pcss/node.pcss.css
deleted file mode 100755
index 1f6c7cc..0000000
--- a/css/components/pcss/node.pcss.css
+++ /dev/null
@@ -1,67 +0,0 @@
-/**
- * @file
- * Node specific styles.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.node__meta {
- display: flex;
- align-items: center;
- margin-block-end: var(--sp1);
- color: var(--color-text-neutral-soft);
- font-size: 14px;
- line-height: var(--sp);
-
- & a {
- font-weight: bold;
- }
-
- @media (--sm) {
- margin-block-end: var(--sp2);
- }
-}
-
-.node__author-image img {
- width: var(--sp2-5);
- height: var(--sp2-5);
- margin-inline-end: var(--sp0-5);
- object-fit: cover;
- border-radius: 50%;
-}
-
-.node__title {
- & a {
- padding-block-end: 3px;
- transition: background-size 0.2s, color 0.2s;
- text-decoration: none;
- color: var(--color-text-neutral-loud);
- background-color: transparent;
- background-image: linear-gradient(var(--color--primary-50), var(--color--primary-50)); /* Two values are needed for IE11 support. */
- background-repeat: no-repeat;
- background-position: bottom left; /* LTR */
- background-size: 0 3px;
-
- &:hover,
- &:focus {
- color: var(--color-text-primary-medium);
- }
- }
-}
-
-[dir="rtl"] .node__title {
- background-position: bottom right;
-}
-
-.node__content {
- padding-block-end: var(--sp1-5);
-
- @media (--lg) {
- padding-block-end: var(--sp3);
- }
-}
-
-.node--unpublished {
- /* There is no variable for the color - #fff4f4. */
- background-color: #fff4f4;
-}
diff --git a/css/components/pcss/page-title.pcss.css b/css/components/pcss/page-title.pcss.css
deleted file mode 100755
index 1f66a2c..0000000
--- a/css/components/pcss/page-title.pcss.css
+++ /dev/null
@@ -1,14 +0,0 @@
-/**
- * @file
- * Page title.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.page-title {
- /*
- Necessary to properly display the star icon from core's shortcut
- module.
- */
- display: inline;
-}
diff --git a/css/components/pcss/pager.pcss.css b/css/components/pcss/pager.pcss.css
deleted file mode 100755
index 3355f7d..0000000
--- a/css/components/pcss/pager.pcss.css
+++ /dev/null
@@ -1,82 +0,0 @@
-/**
- * @file
- * Styles for pagination.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.pager__items {
- display: flex;
- flex-wrap: wrap;
- align-items: flex-end;
- margin-block: 0;
- margin-inline-start: 0;
- padding-block: 0;
- padding-inline-start: 0;
- padding-inline-end: 0;
- list-style: none;
- font-weight: bold;
-}
-
-.pager__item {
- display: flex;
- align-items: center;
- justify-content: center;
- width: var(--sp2-5);
- height: var(--sp2-5);
- cursor: default;
- color: var(--color-text-neutral-soft);
- background-color: var(--color--white);
-
- @media (--sm) {
- width: var(--sp3);
- height: var(--sp3);
- }
-}
-
-[dir="rtl"] .pager__item--control {
- transform: scaleX(-1);
-}
-
-.pager__item--active {
- color: var(--color--white);
- background-color: var(--color--primary-40);
-}
-
-.pager__item--control {
- @media (forced-colors: active) {
- & path {
- fill: linktext;
- }
- }
-}
-
-.pager__link {
- display: flex;
- align-items: center;
- justify-content: center;
- width: 100%;
- height: 100%;
- text-decoration: none;
- color: var(--color-text-neutral-soft);
-}
-
-.pager__link:hover {
- background-color: var(--color--gray-95);
-}
-
-.pager__link:focus {
- color: var(--color-text-primary-medium);
- outline: solid 2px currentColor;
- outline-offset: -2px;
-}
-
-.pager__item svg {
- display: block;
- fill: currentColor;
-}
-
-.pager__item--next svg,
-.pager__item--last svg {
- transform: rotate(180deg);
-}
diff --git a/css/components/pcss/powered-by-block.pcss.css b/css/components/pcss/powered-by-block.pcss.css
deleted file mode 100755
index cda5dc7..0000000
--- a/css/components/pcss/powered-by-block.pcss.css
+++ /dev/null
@@ -1,44 +0,0 @@
-/**
- * @file
- * Powered by block specific styles.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.block-system-powered-by-block {
- letter-spacing: 0.02em;
- font-size: 14px;
- line-height: var(--sp);
-
- & a {
- text-decoration: underline;
-
- &:hover,
- &:focus {
- text-decoration: none;
- }
- }
-
- & .drupal-logo {
- display: inline-block;
- margin-block-start: calc(-1 * var(--sp) / 4);
- margin-inline-start: calc(var(--sp) / 4);
- }
-
- & svg {
- width: 0.875rem; /* 14 */
- height: 1.1875rem; /* 19 */
- vertical-align: top;
- fill: currentColor;
- }
-}
-
-.site-footer .block-system-powered-by-block {
- & a {
- color: var(--color--white);
- }
-
- & svg path {
- fill: var(--color--white);
- }
-}
diff --git a/css/components/pcss/progress.pcss.css b/css/components/pcss/progress.pcss.css
deleted file mode 100755
index d4e058e..0000000
--- a/css/components/pcss/progress.pcss.css
+++ /dev/null
@@ -1,22 +0,0 @@
-/**
- * @file
- * Progress bar specific styles.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.progress__track {
- overflow: hidden;
- height: var(--sp);
- border: 1px solid var(--color--primary-40);
- border-radius: var(--border-radius);
-}
-
-.progress__bar {
- height: var(--sp);
- background-color: var(--color--primary-40);
-}
-
-.progress__percentage {
- margin-inline-start: 1rem;
-}
diff --git a/css/components/pcss/search-results.pcss.css b/css/components/pcss/search-results.pcss.css
deleted file mode 100755
index e2382e0..0000000
--- a/css/components/pcss/search-results.pcss.css
+++ /dev/null
@@ -1,97 +0,0 @@
-/**
- * @file
- * Search results specific styles.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.search-results {
- margin-block-end: var(--sp2);
- padding-block: 0;
- padding-inline-start: 0;
- padding-inline-end: 0;
- list-style: none;
-
- @media (--md) {
- margin-block-end: var(--sp3);
- }
-}
-
-.search-result__title {
- margin-block: 0;
- margin-inline-start: 0;
- margin-inline-end: 0;
- color: var(--color-text-neutral-loud);
- font-size: 20px;
- line-height: var(--line-height-base);
-
- & a {
- padding-block-end: 3px;
- transition: background-size 0.2s, color 0.2s;
- text-decoration: none;
- background-color: transparent;
- background-image: linear-gradient(var(--color--primary-50), var(--color--primary-50)); /* Two values are needed for IE11 support. */
- background-repeat: no-repeat;
- background-position: bottom left; /* LTR */
- background-size: 0 3px;
-
- &:hover {
- color: var(--color-text-primary-medium);
- }
- }
-
- @media (--lg) {
- margin-block-end: var(--sp1);
- font-size: 30px;
- line-height: var(--sp3);
- }
-}
-
-[dir="rtl"] .search-result__title a {
- background-position: bottom right;
-}
-
-.search-result__snippet {
- padding-block-end: calc(var(--sp1-5) - 2px);
-
- @media (--lg) {
- padding-block-end: var(--sp3);
- }
-}
-
-.search-result__meta {
- display: flex;
- align-items: center;
- margin-block-end: var(--sp1);
- color: var(--color-text-neutral-soft);
- font-size: 14px;
- line-height: var(--sp);
-
- & a {
- color: var(--color-text-primary-medium);
- font-weight: bold;
- }
-}
-
-.search-results__item {
- position: relative; /* Anchor after pseudo-element. */
- margin-block-end: var(--sp1-5);
-
- &::after {
- position: absolute;
- inset-block-end: 0;
- width: var(--sp3);
- height: 0;
- content: "";
- /* Intentionally not using CSS logical properties. */
- border-top: solid 2px var(--color--gray-95);
- }
-
- &:last-child {
- margin-block-end: 0;
- }
-
- @media (--lg) {
- margin-block-end: var(--sp3);
- }
-}
diff --git a/css/components/pcss/site-header.pcss.css b/css/components/pcss/site-header.pcss.css
deleted file mode 100755
index 1ab7251..0000000
--- a/css/components/pcss/site-header.pcss.css
+++ /dev/null
@@ -1,104 +0,0 @@
-/**
- * @file
- * Site header.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.site-header {
- position: relative;
- /**
- * Ensure mobile site header is always above other elements including
- * contextual links, and Tour.
- */
- z-index: 101;
-
- @media (--nav) {
- /* Necessary to keep the content from jumping up when header transitions to fixed. */
- min-height: var(--site-header-height-wide);
- border-block-end: solid 1px transparent; /* Will show in Windows high contrast mode. */
- }
-}
-
-.site-header__initial {
- position: relative;
- z-index: 102;
- display: flex;
- align-items: flex-end;
- align-self: stretch;
- background-color: var(--color--primary-50);
-}
-
-.site-header__fixable {
- display: flex;
- align-items: flex-end;
- transition: all 0.5s;
-
- &.is-fixed {
- @media (--nav) {
- &:not(.is-expanded) {
- pointer-events: none;
- }
- }
- }
-}
-
-@media (--nav) {
- body:not(.is-always-mobile-nav) {
- & .site-header__fixable.is-fixed {
- position: fixed;
- z-index: 102; /* Appear above body content that is position: relative */
- inset-block-start: calc(var(--drupal-displace-offset-top, 0px) - var(--sp4));
- max-width: var(--max-bg-color);
- }
- }
-}
-
-.site-header__inner {
- position: relative;
- z-index: 1; /* Appear in front of Drupal's tabs. */
- flex-grow: 1;
- width: calc(100vw - var(--content-left) - var(--drupal-displace-offset-left, 0px) - var(--drupal-displace-offset-right, 0px));
- background: var(--color--white);
-}
-
-/*
- * Only apply transition styles when JS is loaded. This
- * works around https://bugs.chromium.org/p/chromium/issues/detail?id=332189
- */
-html.js body:not(.is-always-mobile-nav) .site-header__inner {
- @media (--nav) {
- transition: opacity 0.3s, transform 0.3s, box-shadow 0.3s;
- }
-}
-
-.site-header__fixable.is-expanded .site-header__inner {
- @media (--nav) {
- box-shadow: -36px 1px 36px rgba(0, 0, 0, 0.08); /* LTR */
- }
-}
-
-[dir="rtl"] .site-header__fixable.is-expanded .site-header__inner {
- @media (--nav) {
- box-shadow: 36px 1px 36px rgba(0, 0, 0, 0.08);
- }
-}
-
-/* Hide the desktop nav when it's fixed and not active. */
-body:not(.is-always-mobile-nav) .site-header__fixable.is-fixed:not(.is-expanded) .site-header__inner {
- @media (--nav) {
- transform: translateX(-101%); /* LTR */
- opacity: 0;
- }
-}
-
-[dir="rtl"] body:not(.is-always-mobile-nav) .site-header__fixable.is-fixed:not(.is-expanded) .site-header__inner {
- @media (--nav) {
- transform: translateX(101%);
- }
-}
-
-.site-header__inner__container {
- display: flex;
- justify-content: space-between;
-}
diff --git a/css/components/pcss/skip-link.pcss.css b/css/components/pcss/skip-link.pcss.css
deleted file mode 100755
index 7a422ae..0000000
--- a/css/components/pcss/skip-link.pcss.css
+++ /dev/null
@@ -1,38 +0,0 @@
-/**
- * @file
- * Skip link
- *
- * Allows keyboard users to quickly skip to the main content of the page.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.skip-link {
- display: block;
- width: 100%;
- max-width: var(--max-bg-color);
- padding-block: var(--sp0-5);
- padding-inline-start: var(--sp);
- padding-inline-end: var(--sp);
- text-decoration: none;
- color: var(--color--white);
- outline: 0;
- background-color: var(--color--gray-5);
-
- &:hover {
- text-decoration: underline;
- color: var(--color--white);
- }
-
- &::after {
- content: "\0020 ➔";
- }
-}
-
-.skip-link.focusable:focus {
- position: absolute !important; /* Override position from module file. */
- z-index: 503;
- width: 100%;
- height: 40px;
- outline: none;
-}
diff --git a/css/components/pcss/table.pcss.css b/css/components/pcss/table.pcss.css
deleted file mode 100755
index 19c5b93..0000000
--- a/css/components/pcss/table.pcss.css
+++ /dev/null
@@ -1,93 +0,0 @@
-/**
- * @file
- * User generated tables.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.forum table,
-.text-content table,
-.views-table,
-.draggable-table {
- margin-block-start: var(--sp2);
- margin-block-end: var(--sp2);
- border-spacing: 0;
- color: var(--color-text-neutral-medium);
- border: 0;
- border-collapse: collapse;
- font-family: var(--font-sans);
- font-size: 16px;
- line-height: var(--sp1-5);
-
- & caption {
- margin-block-end: var(--sp1);
- text-align: start;
- color: var(--color-text-neutral-medium);
- font-family: var(--font-serif);
- font-size: 14px;
- font-style: italic;
- line-height: var(--sp);
- }
-
- & tr {
- &:last-child {
- & td {
- border-block-end: 0;
- }
- }
- }
-
- & td,
- & th {
- padding-block: var(--sp1);
- padding-inline-start: 0;
- padding-inline-end: var(--sp1);
- vertical-align: top;
- }
-
- & th {
- margin-block: 0;
- margin-inline-start: 0;
- margin-inline-end: 0;
- text-align: start;
- letter-spacing: 0.02em;
- color: var(--color-text-neutral-loud);
- border-block-end: 2px solid var(--color--primary-50);
- font-family: var(--font-sans);
- font-size: 14px;
- line-height: var(--sp);
- }
-
- & td {
- white-space: normal;
- border-block-end: 2px solid var(--color--gray-65);
- }
-
- & th.checkbox,
- & td.checkbox {
- text-align: center;
- }
-}
-
-.draggable-table {
- width: 100%;
-}
-
-.draggable-table .form-item {
- margin-top: 0;
-}
-
-.tablesort {
- vertical-align: middle;
-}
-
-.sticky-header {
- z-index: 0;
- margin: 0;
- border-block-end: 4px solid var(--color--primary-50);
-}
-
-/* Properly align VBO checkboxes. */
-.views-field-node-bulk-form .form-item {
- margin: 0;
-}
diff --git a/css/components/pcss/tabledrag.pcss.css b/css/components/pcss/tabledrag.pcss.css
deleted file mode 100755
index 54d17bd..0000000
--- a/css/components/pcss/tabledrag.pcss.css
+++ /dev/null
@@ -1,54 +0,0 @@
-/**
- * @file
- * Styles for tabledrag.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.draggable:hover {
- background-color: var(--color--gray-100);
-}
-
-.draggable.drag {
- background-color: var(--color--gray-100);
-}
-
-.draggable.drag-previous {
- background-color: var(--color--gray-95);
-}
-
-.drag-previous a {
- color: var(--color-text-neutral-medium); /* Ensure proper contrast. */
-}
-
-a.tabledrag-handle,
-.touchevents a.tabledrag-handle {
- width: 36px;
- height: 36px;
-}
-
-.draggable a.tabledrag-handle {
- margin-inline-start: 0;
-}
-
-a.tabledrag-handle .handle {
- width: var(--sp2);
- height: var(--sp2);
- margin: 0;
- background-position: 50% 5px;
-}
-
-.touchevents a.tabledrag-handle .handle {
- height: var(--sp2);
- background-position: 50% 5px;
-}
-
-.touchevents .draggable td {
- padding-block: var(--sp0-5);
- padding-inline-start: 0;
- padding-inline-end: var(--sp0-5);
-}
-
-.touchevents .draggable .menu-item__link {
- padding: 0;
-}
diff --git a/css/components/pcss/tabs.pcss.css b/css/components/pcss/tabs.pcss.css
deleted file mode 100755
index 17dbf19..0000000
--- a/css/components/pcss/tabs.pcss.css
+++ /dev/null
@@ -1,205 +0,0 @@
-@import "../base/media-queries.pcss.css";
-
-/* Breakpoint where tabs switch between vertical and horizontal layouts. */
-@custom-media --tabs-layout-switch (--md);
-
-.tabs {
- --tabs-height: var(--sp3);
- --tabs-padding-inline: var(--sp1-5);
- --tabs-active-border-size: 6px;
- --tabs-highlight-color: var(--color--primary-50); /* Minimum 3:1 contrast ratio against --tabs-background-color and --tabs-background-color-hover. */
- --tabs-text-color: var(--color-text-neutral-soft); /* Minimum 4.5:1 contrast ratio against --tabs-background-color and --tabs-background-color-hover. */
- --tabs-text-color-active: var(--color--gray-5); /* Minimum 4.5:1 contrast ratio against --tabs-background-color and --tabs-background-color-hover. */
- --tabs-letter-spacing: 1px;
- --tabs-font-size: var(--font-size-s);
- --tabs-background-color: var(--color--gray-100);
- --tabs-background-color-hover: var(--color--gray-95);
- --tabs-border-width: 1px;
- --tabs-border-color: var(--color--gray-95);
- --tabs-transition-duration: 0.2s;
-
- display: flex;
- flex-direction: column;
- width: 100%;
- margin: 0;
- margin-inline-start: 0; /* Override [dir] attribute in base in compiled CSS. */
- padding: 0;
- list-style: none;
-
- @media (--tabs-layout-switch) {
- flex-direction: row;
- flex-wrap: wrap;
- }
-}
-
-.tabs__tab {
- display: none;
- margin: 0;
- margin-block-end: calc(-1 * var(--tabs-border-width));
-
- &.is-active {
- display: flex;
- }
-
- @media (--tabs-layout-switch) {
- display: flex;
- margin-block-end: 0;
- margin-inline-start: calc(-1 * var(--tabs-border-width));
- }
-
- /* Show tabs when JavaScript disabled. */
- @nest html:not(.js) & {
- display: flex;
- }
-
- /* Show tabs when tabs-expanded class is present. */
- @nest .tabs.is-expanded & {
- display: flex;
- }
-
- /* Secondary tabs will always be expanded. */
- @nest .tabs--secondary & {
- display: block;
-
- @media (--tabs-layout-switch) {
- display: flex;
- }
- }
-}
-
-.tabs__link {
- display: flex;
- flex-grow: 1;
- align-items: center;
- height: var(--tabs-height);
- padding-block: 0;
- padding-inline: var(--tabs-padding-inline);
- transition: background-color var(--tabs-transition-duration);
- text-decoration: none;
- letter-spacing: var(--tabs-letter-spacing);
- color: var(--tabs-text-color);
- border: var(--tabs-border-width) solid var(--tabs-border-color);
- background-color: var(--tabs-background-color);
- font-size: var(--tabs-font-size);
-
- &:hover {
- color: var(--tabs-text-color-active);
- background-color: var(--tabs-background-color-hover);
- }
-
- &:focus {
- position: relative;
- outline: solid 3px var(--tabs-highlight-color);
- outline-offset: -3px;
- }
-
- &.is-active {
- position: relative; /* Anchor ::after pseudo-element. */
- color: var(--tabs-text-color-active);
- font-weight: 600;
-
- /*
- * We use ::after pseudo-element in place of border so edges do not appear
- * diagonally cut off due to other edges with transparent borders.
- */
- &::after {
- position: absolute;
- inset-block-start: calc(-1 * var(--tabs-border-width));
- inset-inline-start: calc(-1 * var(--tabs-border-width));
- height: calc(100% + var(--tabs-border-width) * 2);
- content: "";
- border-inline-start: var(--tabs-active-border-size) solid var(--tabs-highlight-color);
-
- @media (--tabs-layout-switch) {
- inset-block: auto calc(-1 * var(--tabs-border-width));
- width: calc(100% + 2 * var(--tabs-border-width));
- height: 0;
- border-block-start: var(--tabs-active-border-size) solid var(--tabs-highlight-color);
- border-inline-start: 0;
- }
- }
- }
-
- /* No regular borders or background color for secondary tab links. */
- @nest .tabs--secondary & {
- @media (--tabs-layout-switch) {
- border-color: transparent;
- background-color: transparent;
- }
- }
-}
-
-/* Button that opens and closes primary tabs at narrow viewports. */
-.tabs__trigger {
- display: flex;
- align-items: center;
- justify-content: center;
- width: var(--tabs-height);
- margin-block: 0;
- margin-inline: calc(-1 * var(--tabs-border-width)) 0;
- cursor: pointer;
- border: solid var(--tabs-border-width) var(--tabs-border-color);
- background-color: var(--tabs-background-color);
-
- &:hover {
- background-color: var(--tabs-background-color-hover);
- }
-
- &:focus {
- position: relative;
- border-color: var(--tabs-highlight-color);
- outline: none;
- }
-
- /* Button will not work when JavaScript is disabled, so we hide it. */
- @nest html:not(.js) & {
- display: none;
- }
-
- @media (--tabs-layout-switch) {
- display: none;
- }
-}
-
-.tabs__trigger-icon {
- position: relative;
- display: block;
- width: var(--sp);
- height: 10px;
- margin-block-start: calc(-2 * var(--tabs-border-width));
-
- & > span {
- position: absolute;
- inset-inline-start: 0;
- display: block;
- width: 100%;
- transition: transform var(--tabs-transition-duration), opacity var(--tabs-transition-duration), top var(--tabs-transition-duration);
- border-block-start: solid 2px var(--tabs-highlight-color);
-
- &:nth-child(1) {
- inset-block-start: 0;
-
- @nest .tabs__trigger[aria-expanded="true"] & {
- inset-block-start: calc(50% + 1px);
- transform: rotate(45deg);
- }
- }
-
- &:nth-child(2) {
- inset-block-start: calc(50% + 1px);
-
- @nest .tabs__trigger[aria-expanded="true"] & {
- opacity: 0;
- }
- }
-
- &:nth-child(3) {
- inset-block-start: calc(100% + 2px);
-
- @nest .tabs__trigger[aria-expanded="true"] & {
- inset-block-start: calc(50% + 1px);
- transform: rotate(-45deg);
- }
- }
- }
-}
diff --git a/css/components/pcss/tags.pcss.css b/css/components/pcss/tags.pcss.css
deleted file mode 100755
index ca3711c..0000000
--- a/css/components/pcss/tags.pcss.css
+++ /dev/null
@@ -1,83 +0,0 @@
-/**
- * @file
- * Tags field styling.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.field--tags {
- display: flex;
- font-family: var(--font-sans);
-}
-
-.field--tags__label {
- margin: 0;
- margin-inline-end: calc(var(--sp1-5) - (var(--sp0-5) / 2));
- letter-spacing: 0.02em;
- color: var(--color-text-neutral-soft);
- font-size: var(--font-size-s);
- font-weight: 600;
- line-height: 1.6;
-
- &::after {
- content: ":";
- }
-
- @media (--md) {
- line-height: 2;
- }
-}
-
-.field--label-inline .field--tags__label {
- padding-block: 0;
- padding-inline-start: 0;
- padding-inline-end: 0;
-}
-
-.field--tags__items {
- display: flex;
- flex-wrap: wrap;
- margin-block: calc((var(--sp0-5) / 2) * -1);
- margin-inline-start: calc((var(--sp0-5) / 2) * -1);
- margin-inline-end: calc((var(--sp0-5) / 2) * -1);
- padding-block: 0;
- padding-inline-start: 0;
- padding-inline-end: 0;
- list-style: none;
-}
-
-.field--tags__item {
- display: flex;
- margin-block: calc(var(--sp0-5) / 2);
- margin-inline-start: calc(var(--sp0-5) / 2);
- margin-inline-end: calc(var(--sp0-5) / 2);
-}
-
-.field--tags__item:nth-last-child(n+2)::after {
- content: ",";
- font-size: var(--font-size-base);
- line-height: 1.5;
-}
-
-.field--tags__item a {
- position: relative;
- display: flex;
- align-items: center;
- text-decoration: none;
- letter-spacing: 0.02em;
- color: var(--color-text-primary-medium);
- font-size: var(--font-size-base);
- font-weight: 700;
- line-height: 1.5;
-}
-
-.node--view-mode-full {
- & .field--tags {
- margin-block-start: var(--sp4);
- margin-block-end: var(--sp4);
- padding-block: var(--sp1-5);
- padding-inline-start: var(--sp2);
- padding-inline-end: var(--sp2);
- background-color: var(--color--gray-100);
- }
-}
diff --git a/css/components/pcss/text-content.pcss.css b/css/components/pcss/text-content.pcss.css
deleted file mode 100755
index 840087b..0000000
--- a/css/components/pcss/text-content.pcss.css
+++ /dev/null
@@ -1,153 +0,0 @@
-/**
- * @file
- * Text Content.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.text-content,
-.cke_editable {
- color: var(--color-text-neutral-medium);
- font-family: var(--font-serif);
- line-height: var(--sp1-5);
-
- /*
- @todo
-
- text-decoration-thickness is supported by FF & Safari
- text-underline-offset is supported by Safari
-
- text-decoration-color supported by Chrome, FF, & Safari
- */
-
- & a:where(:not(.button)) {
- color: var(--color-text-primary-medium);
- text-decoration-color: currentColor;
- text-decoration-thickness: 2px;
- overflow-wrap: break-word;
-
- @supports (box-shadow: none) {
- transition: box-shadow 0.3s cubic-bezier(0.55, 0.085, 0, 0.99);
- text-decoration: none;
- box-shadow: inset 0 -2px 0 0 var(--color--primary-50);
-
- &:hover {
- text-decoration: underline;
- color: var(--color--black);
- box-shadow: inset 0 -2em 0 0 var(--color--primary-80);
- text-decoration-color: var(--color--primary-80);
- }
- }
- }
-
- & p {
- margin-block-start: var(--sp);
- margin-block-end: var(--sp);
-
- &:first-child {
- margin-block-start: 0;
- }
-
- &:last-child {
- margin-block-end: 0;
- }
-
- @media (--md) {
- margin-block-start: var(--sp2);
- margin-block-end: var(--sp2);
- }
- }
-
- & code {
- background-color: var(--color--gray-100);
- }
-
- & pre code {
- display: block;
- overflow: auto;
- padding-block: var(--sp);
- padding-inline-start: var(--sp);
- padding-inline-end: var(--sp);
- color: var(--color-text-neutral-soft);
- }
-
- & blockquote {
- position: relative;
- margin-block: var(--sp2);
- margin-inline-start: 0;
- margin-inline-end: 0;
- padding-inline-start: var(--sp2);
- letter-spacing: -0.01em;
- font-family: var(--font-serif);
- font-size: 21px;
- line-height: var(--sp2);
-
- &::before {
- position: absolute;
- inset-block-start: 0;
- inset-inline-start: 0;
- content: "\201C";
- color: var(--color--primary-60);
- font-size: 54px;
- }
-
- &::after {
- position: absolute;
- inset-block-end: 0;
- inset-inline-start: 0;
- width: var(--sp0-5);
- height: calc(100% - 30px);
- margin-inline-start: 4px;
- content: "";
- background: var(--color--gray-100);
- }
-
- @media (--grid-md) {
- font-size: 32px;
- line-height: var(--sp3);
- }
-
- @media (--lg) {
- font-size: 40px;
- line-height: calc(3.5 * var(--sp));
- }
- }
-
- @media (--grid-md) {
- font-size: 18px;
- line-height: var(--sp2);
- }
-}
-
-/**
- * Special colors for footer that has a dark background.
- */
-.site-footer .text-content {
- color: inherit;
-
- & * {
- color: inherit;
- }
-
- & a {
- text-decoration: underline;
- color: var(--color--white);
- box-shadow: none;
-
- &:hover {
- text-decoration: none;
- color: var(--color--white);
- box-shadow: none;
- }
- }
-}
-
-/**
- * Decrease font-size for blockquote placed in sidebar region.
- */
-.region--sidebar .text-content blockquote {
- @media (--lg) {
- font-size: 24px;
- line-height: var(--sp2);
- }
-}
diff --git a/css/components/pcss/ui-dialog.pcss.css b/css/components/pcss/ui-dialog.pcss.css
deleted file mode 100755
index 1bfb025..0000000
--- a/css/components/pcss/ui-dialog.pcss.css
+++ /dev/null
@@ -1,30 +0,0 @@
-/**
- * @file
- * Styles for jQuery UI dialog.
- */
-
-.ui-dialog {
- & .ui-dialog-buttonpane {
- padding-inline-start: 0.2em;
- padding-inline-end: 0.2em;
-
- & .ui-dialog-buttonset {
- display: flex;
- float: none;
- flex-wrap: wrap;
- gap: 5px;
- }
-
- & button {
- margin: 0;
- }
- }
-}
-
-.ui-widget-overlay {
- z-index: 1259;
-}
-
-.ui-dialog {
- z-index: 1260;
-}
diff --git a/css/components/pcss/vertical-tabs.pcss.css b/css/components/pcss/vertical-tabs.pcss.css
deleted file mode 100755
index c6c64bf..0000000
--- a/css/components/pcss/vertical-tabs.pcss.css
+++ /dev/null
@@ -1,98 +0,0 @@
-/**
- * @file
- * Vertical Tabs.
- */
-
-@import "../base/media-queries.pcss.css";
-
-:root {
- --vertical-tabs-menu-width: 15rem;
- --vertical-tabs-menu-border-width: 1px;
-}
-
-.vertical-tabs {
- @media (--lg) {
- display: flex;
- }
-}
-
-.vertical-tabs__menu {
- position: relative;
- align-self: flex-start;
- margin: 0;
- margin-inline-start: 0;
- margin-inline-end: 0;
- list-style: none;
- border-width: var(--vertical-tabs-menu-border-width);
- border-style: solid;
- border-color: var(--color--gray-95);
-
- @media (--lg) {
- width: var(--vertical-tabs-menu-width);
- border-width: var(--vertical-tabs-menu-border-width) 0 var(--vertical-tabs-menu-border-width) var(--vertical-tabs-menu-border-width);
- }
-}
-
-.vertical-tabs__panes {
- margin-block-start: calc(var(--vertical-tabs-menu-border-width) * -1);
-
- @media (--lg) {
- width: calc(100% - var(--vertical-tabs-menu-width));
- margin-block-start: 0;
- }
-}
-
-.vertical-tabs__pane {
- @media (--lg) {
- min-height: 100%;
- }
-}
-
-.vertical-tabs__pane.olivesbooks-details {
- margin: 0;
- border-radius: 0;
- box-shadow: none;
-}
-
-.vertical-tabs__pane > summary {
- display: none;
-}
-
-.vertical-tabs__menu-item:nth-child(n+2) {
- border-block-start: var(--vertical-tabs-menu-border-width) solid var(--color--gray-95);
-}
-
-.vertical-tabs__menu-item a {
- display: block;
- padding-block: var(--sp0-5);
- padding-inline-start: var(--sp0-75);
- padding-inline-end: var(--sp0-75);
- text-decoration: none;
- color: var(--color-text-primary-loud);
- background-color: var(--color--gray-95);
-
- &:focus,
- &:hover,
- &:active {
- background-color: var(--color--gray-100);
- }
-}
-
-.vertical-tabs__menu-item.is-selected {
- background-color: var(--color--white);
-
- @media (--lg) {
- margin-inline-end: calc(var(--vertical-tabs-menu-border-width) * -1);
- padding-inline-end: var(--vertical-tabs-menu-border-width);
- }
-}
-
-.vertical-tabs__menu-item.is-selected a {
- background-color: transparent;
-}
-
-.vertical-tabs__menu-item-summary {
- display: block;
- font-size: var(--font-size-s);
- line-height: var(--line-height-s);
-}
diff --git a/css/components/pcss/wide-image.pcss.css b/css/components/pcss/wide-image.pcss.css
deleted file mode 100755
index 2413387..0000000
--- a/css/components/pcss/wide-image.pcss.css
+++ /dev/null
@@ -1,42 +0,0 @@
-/**
- * @file
- * Wide image component.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.wide-image {
- margin-block-start: var(--sp0-5);
- margin-block-end: var(--sp2);
- margin-inline-start: 0;
- margin-inline-end: 0;
-
- @media (--grid-md) {
- width: calc(var(--grid-col-count) * var(--grid-col-width) + var(--grid-gap-count) * var(--grid-gap));
- margin-block: var(--sp2) var(--sp4);
- margin-inline-start: calc(-1 * ((var(--grid-col-width) + var(--grid-gap))));
- }
-
- @media (--lg) {
- width: calc(12 * var(--grid-col-width) + 11 * var(--grid-gap));
- margin-inline-start: calc(-1 * (var(--grid-col-width) + var(--grid-gap)));
- }
-}
-
-/* Ensure that image doesn't overlap sidebar. */
-.sidebar-grid .wide-image {
- @media (--lg) {
- width: calc(9 * var(--grid-col-width) + 8 * var(--grid-gap));
- }
-
- @media (--xl) {
- width: calc(10 * var(--grid-col-width) + 9 * var(--grid-gap));
- }
-}
-
-/* Ensure that image doesn't overlap layout builder sections when editing layouts. */
-.layout-builder .wide-image {
- max-width: 100%;
- margin-inline-start: 0;
- margin-inline-end: 0;
-}
diff --git a/css/layout/pcss/grid.pcss.css b/css/layout/pcss/grid.pcss.css
deleted file mode 100755
index c4b586e..0000000
--- a/css/layout/pcss/grid.pcss.css
+++ /dev/null
@@ -1,50 +0,0 @@
-/**
- * @file
- * Grid system.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.grid-full {
- display: grid;
- grid-template-rows: 1fr;
- grid-template-columns: repeat(var(--grid-col-count), minmax(0, 1fr));
- grid-column-gap: var(--grid-gap);
-
- /* .grid-full classes nested 3 or more deep go full width. */
- & .grid-full .grid-full {
- display: block;
- }
-}
-
-/*
- If the .grid-full is nested within the following, apply the appropriate number of columns.
- - .layout--content-narrow class.
- - Element that's inheriting the layout--content-narrow styles from its parent region.
-*/
-.layout--content-narrow .grid-full,
-.layout--pass--content-narrow > * .grid-full {
- @media (--grid-md) {
- grid-template-columns: repeat(calc(var(--grid-col-count) - 2), minmax(0, 1fr));
- }
-
- @media (--lg) {
- grid-template-columns: repeat(calc(var(--grid-col-count) - 6), minmax(0, 1fr));
- }
-}
-
-/*
- If the .grid-full is nested within the following, apply the appropriate number of columns.
- - .layout--content-medium class.
- - Element that's inheriting the layout--content-medium styles from its parent region.
-*/
-.layout--content-medium .grid-full,
-.layout--pass--content-medium > * .grid-full {
- @media (--grid-md) {
- grid-template-columns: repeat(calc(var(--grid-col-count) - 2), minmax(0, 1fr));
- }
-
- @media (--lg) {
- grid-template-columns: repeat(calc(var(--grid-col-count) - 4), minmax(0, 1fr));
- }
-}
diff --git a/css/layout/pcss/layout-builder-fourcol-section.pcss.css b/css/layout/pcss/layout-builder-fourcol-section.pcss.css
deleted file mode 100755
index 012c243..0000000
--- a/css/layout/pcss/layout-builder-fourcol-section.pcss.css
+++ /dev/null
@@ -1,66 +0,0 @@
-/*
- * @file
- * Provides the layout styles for four-column layout section.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.layout--fourcol-section {
- display: flex;
- flex-wrap: wrap;
-
- & > .layout__region {
- flex: 1 0 100%;
- margin-block-end: var(--grid-gap);
-
- @media (--md) {
- flex-basis: calc(50% - (var(--grid-gap) * 0.5));
- flex-grow: 0;
- flex-shrink: 0;
- margin-block-end: 0;
- }
- }
-
- /* Two column layout. */
- @media (--md) {
- & > .layout__region--first,
- & > .layout__region--second {
- margin-block-end: var(--grid-gap);
- }
-
- & > .layout__region--first,
- & > .layout__region--third {
- margin-inline-end: calc(var(--grid-gap) * 0.5);
- }
-
- & > .layout__region--second,
- & > .layout__region--fourth {
- margin-inline-start: calc(var(--grid-gap) * 0.5);
- }
- }
-
- /* Four column layout. */
- @media (--lg) {
- & > .layout__region {
- flex-basis: calc(25% - (var(--grid-gap) * 0.75));
- }
-
- & > .layout__region--first,
- & > .layout__region--second {
- margin-block-end: 0;
- }
-
- & > .layout__region--first {
- margin-inline-end: calc(var(--grid-gap) * 0.5);
- }
-
- & > .layout__region--second,
- & > .layout__region--third {
- margin-inline: calc(var(--grid-gap) * 0.5);
- }
-
- & > .layout__region--fourth {
- margin-inline-start: calc(var(--grid-gap) * 0.5);
- }
- }
-}
diff --git a/css/layout/pcss/layout-builder-threecol-section.pcss.css b/css/layout/pcss/layout-builder-threecol-section.pcss.css
deleted file mode 100755
index afb669c..0000000
--- a/css/layout/pcss/layout-builder-threecol-section.pcss.css
+++ /dev/null
@@ -1,79 +0,0 @@
-/*
- * @file
- * Provides the layout styles for three-column layout section.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.layout--threecol-section {
- display: flex;
- flex-wrap: wrap;
-
- & > .layout__region {
- flex: 1 0 100%;
- margin-block-end: var(--grid-gap);
-
- @media (--lg) {
- flex-grow: 0;
- flex-shrink: 0;
- margin-block-end: 0;
- }
- }
-}
-
-@media (--lg) {
- .layout--threecol-section {
- & > .layout__region--first {
- margin-inline-end: calc(var(--grid-gap) * 0.5);
- }
-
- & > .layout__region--second {
- margin-inline: calc(var(--grid-gap) * 0.5);
- }
-
- & > .layout__region--third {
- margin-inline-start: calc(var(--grid-gap) * 0.5);
- }
- }
-
- .layout--threecol-section--25-50-25 {
- & > .layout__region--first,
- & > .layout__region--third {
- flex-basis: calc(25% - (var(--grid-gap) * 0.5));
- }
-
- & > .layout__region--second {
- flex-basis: calc(50% - var(--grid-gap));
- }
- }
-
- .layout--threecol-section--25-25-50 {
- & > .layout__region--first,
- & > .layout__region--second {
- flex-basis: calc(25% - (var(--grid-gap) * 0.5));
- }
-
- & > .layout__region--third {
- flex-basis: calc(50% - var(--grid-gap));
- }
- }
-
- .layout--threecol-section--50-25-25 {
- & > .layout__region--first {
- flex-basis: calc(50% - var(--grid-gap));
- }
-
- & > .layout__region--second,
- & > .layout__region--third {
- flex-basis: calc(25% - (var(--grid-gap) * 0.5));
- }
- }
-
- .layout--threecol-section--33-34-33 {
- & > .layout__region--first,
- & > .layout__region--second,
- & > .layout__region--third {
- flex-basis: calc(33.33% - (var(--grid-gap) * 0.667));
- }
- }
-}
diff --git a/css/layout/pcss/layout-builder-twocol-section.pcss.css b/css/layout/pcss/layout-builder-twocol-section.pcss.css
deleted file mode 100755
index ea05bc6..0000000
--- a/css/layout/pcss/layout-builder-twocol-section.pcss.css
+++ /dev/null
@@ -1,84 +0,0 @@
-/*
- * @file
- * Provides the layout styles for two-column layout section.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.layout--twocol-section {
- display: flex;
- flex-wrap: wrap;
-
- & > .layout__region {
- flex: 1 0 100%;
- margin-block-end: var(--grid-gap);
-
- @media (--md) {
- flex-grow: 0;
- flex-shrink: 0;
- margin-block-end: 0;
- }
- }
-}
-
-@media (--md) {
- .layout--twocol-section--50-50 {
- & > .layout__region--first {
- flex-basis: calc(50% - (var(--grid-gap) * 0.5));
- margin-inline-end: calc(var(--grid-gap) * 0.5);
- }
-
- & > .layout__region--second {
- flex-basis: calc(50% - (var(--grid-gap) * 0.5));
- margin-inline-start: calc(var(--grid-gap) * 0.5);
- }
- }
-
- .layout--twocol-section--33-67 {
- & > .layout__region--first {
- flex-basis: calc(33.33% - (var(--grid-gap) * 0.3333));
- margin-inline-end: calc(var(--grid-gap) * 0.3333);
- }
-
- & > .layout__region--second {
- flex-basis: calc(66.66% - (var(--grid-gap) * 0.6666));
- margin-inline-start: calc(var(--grid-gap) * 0.6666);
- }
- }
-
- .layout--twocol-section--67-33 {
- & > .layout__region--first {
- flex-basis: calc(66.66% - (var(--grid-gap) * 0.6666));
- margin-inline-end: calc(var(--grid-gap) * 0.6666);
- }
-
- & > .layout__region--second {
- flex-basis: calc(33.33% - (var(--grid-gap) * 0.3333));
- margin-inline-start: calc(var(--grid-gap) * 0.3333);
- }
- }
-
- .layout--twocol-section--25-75 {
- & > .layout__region--first {
- flex-basis: calc(25% - (var(--grid-gap) * 0.25));
- margin-inline-end: calc(var(--grid-gap) * 0.25);
- }
-
- & > .layout__region--second {
- flex-basis: calc(75% - (var(--grid-gap) * 0.75));
- margin-inline-start: calc(var(--grid-gap) * 0.75);
- }
- }
-
- .layout--twocol-section--75-25 {
- & > .layout__region--first {
- flex-basis: calc(75% - (var(--grid-gap) * 0.75));
- margin-inline-end: calc(var(--grid-gap) * 0.75);
- }
-
- & > .layout__region--second {
- flex-basis: calc(25% - (var(--grid-gap) * 0.25));
- margin-inline-start: calc(var(--grid-gap) * 0.25);
- }
- }
-}
diff --git a/css/layout/pcss/layout-content-medium.pcss.css b/css/layout/pcss/layout-content-medium.pcss.css
deleted file mode 100755
index fc9be63..0000000
--- a/css/layout/pcss/layout-content-medium.pcss.css
+++ /dev/null
@@ -1,39 +0,0 @@
-/**
- * @file
- * Grid system definition for the content wide layout.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.layout--content-medium,
-.layout--pass--content-medium > * {
- grid-column: 1 / 7;
- width: 100%;
-
- @media (--grid-md) {
- grid-column: 2 / 14;
- }
-
- @media (--lg) {
- grid-column: 3 / 13;
- }
-}
-
-/*
- If .layout--content-medium is nested within itself, or an element that's inheriting the
- layout--content-medium styles from its parent region, go full width within its
- parent .grid-full.
-*/
-.layout--pass--content-medium > *,
-.layout--content-medium {
- & .layout--content-medium,
- & .layout--pass--content-medium > * {
- @media (--grid-md) {
- grid-column: 1 / 13;
- }
-
- @media (--lg) {
- grid-column: 1 / 11;
- }
- }
-}
diff --git a/css/layout/pcss/layout-content-narrow.pcss.css b/css/layout/pcss/layout-content-narrow.pcss.css
deleted file mode 100755
index 86fc642..0000000
--- a/css/layout/pcss/layout-content-narrow.pcss.css
+++ /dev/null
@@ -1,105 +0,0 @@
-/**
- * @file
- * Grid system definition for the content narrow layout.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.layout--content-narrow,
-.layout--pass--content-narrow > * {
- grid-column: 1 / 7;
- width: 100%;
-
- @media (--grid-md) {
- grid-column: 2 / 14;
- }
-
- @media (--lg) {
- grid-column: 3 / 11;
- }
-}
-
-/*
- If .layout--content-narrow is nested within any of the following, allocate the appropriate
- amount of columns within its parent .grid-full.
- - .layout--content-narrow class.
- - Element that's inheriting the layout--content-narrow styles from its parent region.
- - .layout--content-medium class.
- - Element that's inheriting the layout--content-medium styles from its parent region.
-*/
-.layout--content-narrow,
-.layout--pass--content-narrow > *,
-.layout--content-medium,
-.layout--pass--content-medium > * {
- & .layout--content-narrow,
- & .layout--pass--content-narrow > * {
- @media (--grid-md) {
- grid-column: 1 / 13;
- }
-
- @media (--lg) {
- grid-column: 1 / 9;
- }
- }
-}
-
-/*
- Special grid-breaking treatment for text-content elements that
- reside in a content-narrow layout.
-*/
-.layout--content-narrow,
-.layout--pass--content-narrow > * {
- &.text-content,
- & .text-content {
- & blockquote {
- &::before {
- @media (--grid-md) {
- inset-inline-start: calc(-1 * (var(--grid-col-width) + var(--grid-gap)));
- }
- }
-
- &::after {
- @media (--grid-md) {
- inset-inline-start: calc(-1 * (var(--grid-col-width) + var(--grid-gap)));
- width: var(--sp);
- height: calc(100% - 45px);
- margin-inline-start: 2px;
- }
- }
-
- @media (--grid-md) {
- width: calc(10 * var(--grid-col-width) + 9 * var(--grid-gap));
- margin-block: var(--sp3);
- padding-inline-start: 0;
- }
- }
-
- & pre {
- @media (--grid-md) {
- margin-block: var(--sp3);
- }
-
- @media (--lg) {
- width: calc(12 * var(--grid-col-width) + 11 * var(--grid-gap));
- margin-inline-start: calc(-1 * (var(--grid-col-width) + var(--grid-gap)));
- }
- }
- }
-}
-
-/**
- *
and elements should not break containers and overflow
- * into sidebar region when present.
- */
-.sidebar-grid {
- & .layout--content-narrow,
- & .layout--pass--content-narrow > * {
- &.text-content,
- & .text-content {
- & blockquote,
- & pre {
- width: auto;
- }
- }
- }
-}
diff --git a/css/layout/pcss/layout-discovery-section-layout.pcss.css b/css/layout/pcss/layout-discovery-section-layout.pcss.css
deleted file mode 100755
index d5d3353..0000000
--- a/css/layout/pcss/layout-discovery-section-layout.pcss.css
+++ /dev/null
@@ -1,18 +0,0 @@
-/*
- * @file
- * Provides default layout styles for all layout sections.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.layout {
- margin-block-end: var(--sp);
-
- @media (--md) {
- margin-block-end: var(--sp2);
- }
-
- @media (--lg) {
- margin-block-end: var(--sp3);
- }
-}
diff --git a/css/layout/pcss/layout-footer.pcss.css b/css/layout/pcss/layout-footer.pcss.css
deleted file mode 100755
index 2e91e4f..0000000
--- a/css/layout/pcss/layout-footer.pcss.css
+++ /dev/null
@@ -1,44 +0,0 @@
-/**
- * @file
- * Grid system definition for the footer top and footer bottom layouts.
- */
-
-@import "../base/media-queries.pcss.css";
-
-/**
- * Creates stacking context ensuring that child elements can never appear in
- * front of mobile navigation.
- */
-.site-footer {
- position: relative;
- z-index: 1;
-}
-
-.site-footer__inner {
- padding-block: var(--sp2);
-
- @media (--nav) {
- padding-block: var(--sp4) calc(13 * var(--sp));
- }
-}
-
-.region--footer_top__inner,
-.region--footer_bottom__inner {
- & > * {
- margin-block-end: var(--sp2);
-
- @media (--md) {
- flex: 1;
- margin-block-end: 0;
-
- &:not(:last-child) {
- margin-inline-end: var(--sp2);
- }
- }
- }
-
- @media (--md) {
- display: flex;
- flex-wrap: wrap;
- }
-}
diff --git a/css/layout/pcss/layout-sidebar.pcss.css b/css/layout/pcss/layout-sidebar.pcss.css
deleted file mode 100755
index 6cd6c50..0000000
--- a/css/layout/pcss/layout-sidebar.pcss.css
+++ /dev/null
@@ -1,48 +0,0 @@
-/**
- * @file
- * Special grid system for sidebar.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.sidebar-grid {
- & > .site-main {
- grid-column: 1 / 7;
- align-self: flex-start;
-
- @media (--grid-md) {
- grid-column: 1 / 15;
- }
-
- @media (--lg) {
- display: grid;
- grid-template-columns: repeat(8, minmax(0, 1fr));
- grid-column: 3 / 11;
-
- & > .region--content-above,
- & > .region--content {
- grid-template-columns: repeat(8, minmax(0, 1fr));
- grid-column: 1 / 9;
- }
-
- & .layout--content-narrow,
- & .layout--pass--content-narrow > *,
- & .layout--content-medium,
- & .layout--pass--content-medium > * {
- grid-column: 1 / 9;
- }
- }
- }
-
- & .region--sidebar {
- grid-column: 1 / 7;
-
- @media (--grid-md) {
- grid-column: 3 / 13;
- }
-
- @media (--lg) {
- grid-column: 12 / 15;
- }
- }
-}
diff --git a/css/layout/pcss/layout-views-grid.pcss.css b/css/layout/pcss/layout-views-grid.pcss.css
deleted file mode 100755
index af26f8a..0000000
--- a/css/layout/pcss/layout-views-grid.pcss.css
+++ /dev/null
@@ -1,43 +0,0 @@
-/**
- * @file
- * Responsive styles for views grid horizontal layout.
- *
- * This creates the correct count of columns and automatically resizes the
- * grid-items to fit into it. The grid-items will flow onto the next row when
- * they reach the --views-grid-item--min-width value.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.views-view-grid {
- --views-grid--layout-gap: var(--sp);
- --views-grid--column-count: 4; /* Will be overridden by an inline style. */
- --views-grid-item--min-width: 100px;
-}
-
-.views-view-grid--horizontal {
- /**
- * Calculated values.
- */
- --views-grid--gap-count: calc(var(--views-grid--column-count) - 1);
- --views-grid--total-gap-width: calc(var(--views-grid--gap-count) * var(--views-grid--layout-gap));
- --views-grid-item--max-width: calc((100% - var(--views-grid--total-gap-width)) / var(--views-grid--column-count));
-
- display: grid;
- grid-template-columns: repeat(auto-fill, minmax(max(var(--views-grid-item--min-width), var(--views-grid-item--max-width)), 1fr));
- grid-gap: var(--views-grid--layout-gap);
-}
-
-.views-view-grid--vertical {
- margin-block-end: calc(-1 * var(--views-grid--layout-gap)); /* Offset the bottom row's padding. */
- column-width: var(--views-grid-item--min-width);
- column-count: var(--views-grid--column-count);
- column-gap: var(--views-grid--layout-gap);
-
- & .views-view-grid__item {
- & > * {
- padding-block-end: var(--views-grid--layout-gap);
- break-inside: avoid;
- }
- }
-}
diff --git a/css/layout/pcss/layout.pcss.css b/css/layout/pcss/layout.pcss.css
deleted file mode 100755
index ded782c..0000000
--- a/css/layout/pcss/layout.pcss.css
+++ /dev/null
@@ -1,57 +0,0 @@
-/**
- * @file
- * Base Layout.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.container {
- width: 100%;
- max-width: var(--max-width);
- padding-inline: var(--container-padding);
-
- /* This fixes an issue where if the toolbar is open in vertical mode, and
- * the mobile navigation is open, the "close" button gets pushed outside of
- * the viewport. */
- @nest body.is-fixed & {
- width: calc(100% - var(--drupal-displace-offset-left, 0px) - var(--drupal-displace-offset-right, 0px));
- }
-}
-
-.page-wrapper {
- max-width: var(--max-bg-color);
- background: var(--color--white);
-}
-
-/**
- * Creates stacking context ensuring that child elements can never appear in
- * front of mobile navigation.
- */
-.layout-main-wrapper {
- position: relative;
- z-index: 2; /* Ensure dropdown is not cut off by footer. */
-}
-
-/* Contains the social sidebar, and the primary content area. */
-.layout-main {
- @media (--nav) {
- display: flex;
- flex-direction: row-reverse;
- flex-wrap: wrap;
- }
-}
-
-.main-content {
- @media (--nav) {
- width: calc(100% - var(--content-left));
- margin-inline-end: auto;
- }
-}
-
-.main-content__container {
- padding-block-start: var(--sp3);
-
- @media (--md) {
- padding-block-start: var(--sp5);
- }
-}
diff --git a/css/layout/pcss/region-content-below.pcss.css b/css/layout/pcss/region-content-below.pcss.css
deleted file mode 100755
index 8fbc837..0000000
--- a/css/layout/pcss/region-content-below.pcss.css
+++ /dev/null
@@ -1,41 +0,0 @@
-/**
- * @file
- * Content below region layout.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.region--content-below {
- @media (--md) {
- display: flex;
- flex-wrap: wrap;
-
- & > * {
- flex-basis: calc(50% - (var(--grid-gap) / 2));
- flex-grow: 1;
- flex-shrink: 0;
- margin-inline-end: var(--grid-gap);
-
- &:nth-child(2n),
- &:last-child {
- margin-inline-end: 0;
- }
- }
- }
-
- @media (--md) {
- & > * {
- flex-basis: calc(33.33% - (var(--grid-gap) * 0.667));
-
- &:nth-child(2n),
- &:last-child {
- margin-inline-end: var(--grid-gap);
- }
-
- &:nth-child(3n),
- &:last-child {
- margin-inline-end: 0;
- }
- }
- }
-}
diff --git a/css/layout/pcss/region-content.pcss.css b/css/layout/pcss/region-content.pcss.css
deleted file mode 100755
index 4e1fddb..0000000
--- a/css/layout/pcss/region-content.pcss.css
+++ /dev/null
@@ -1,18 +0,0 @@
-/**
- * @file
- * Content region layout.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.region--content {
- margin-block-end: var(--sp);
-
- @media (--md) {
- margin-block-end: var(--sp2);
- }
-
- @media (--lg) {
- margin-block-end: var(--sp3);
- }
-}
diff --git a/css/layout/pcss/region-hero.pcss.css b/css/layout/pcss/region-hero.pcss.css
deleted file mode 100755
index 4e2526a..0000000
--- a/css/layout/pcss/region-hero.pcss.css
+++ /dev/null
@@ -1,12 +0,0 @@
-/**
- * @file
- * Region default layout.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.region--hero {
- & > *:last-child {
- margin-block-end: 0;
- }
-}
diff --git a/css/layout/pcss/region-secondary-menu.pcss.css b/css/layout/pcss/region-secondary-menu.pcss.css
deleted file mode 100755
index 2bb13ed..0000000
--- a/css/layout/pcss/region-secondary-menu.pcss.css
+++ /dev/null
@@ -1,30 +0,0 @@
-/**
- * @file
- * Secondary menu region layout styling.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.region--secondary-menu {
- display: flex;
- margin-block-start: var(--sp2);
- margin-block-end: var(--sp2);
-
- & > * {
- margin-block-end: 0;
- }
-}
-
-body:not(.is-always-mobile-nav) {
- @media (--nav) {
- & .region--secondary-menu {
- justify-content: flex-end;
- margin: 0;
-
- /* If the secondary nav is the first item within the header, it does not need left separator. */
- &:first-child .secondary-nav::before {
- content: none;
- }
- }
- }
-}
diff --git a/css/layout/pcss/region.pcss.css b/css/layout/pcss/region.pcss.css
deleted file mode 100755
index c04a060..0000000
--- a/css/layout/pcss/region.pcss.css
+++ /dev/null
@@ -1,18 +0,0 @@
-/**
- * @file
- * Region default layout.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.region > * {
- margin-block-end: var(--sp);
-
- @media (--md) {
- margin-block-end: var(--sp2);
- }
-
- @media (--lg) {
- margin-block-end: var(--sp3);
- }
-}
diff --git a/css/layout/pcss/social-bar.pcss.css b/css/layout/pcss/social-bar.pcss.css
deleted file mode 100755
index 4116e35..0000000
--- a/css/layout/pcss/social-bar.pcss.css
+++ /dev/null
@@ -1,105 +0,0 @@
-/**
- * @file
- * Social Bar Region
- .
- */
-
-@import "../base/media-queries.pcss.css";
-
-.social-bar {
- @media (--nav) {
- flex-shrink: 0;
- width: var(--content-left);
- background-color: var(--color--gray-100);
- }
-}
-
-.social-bar__inner {
- position: relative;
- padding-block: var(--sp0-5);
- padding-inline-start: var(--sp);
- padding-inline-end: var(--sp);
-
- @media (--nav) {
- position: relative;
- width: var(--content-left);
- padding-block: calc(5 * var(--sp));
- padding-inline-start: 0;
- padding-inline-end: 0;
-
- &.is-fixed {
- position: fixed;
- inset-block-start: var(--sp6);
- inset-inline-start: 0;
- height: calc(100vh - 6 * var(--sp));
- }
- }
-}
-
-.rotate {
- & > * {
- margin-block-end: var(--sp2);
-
- @media (--nav) {
- display: flex;
- align-items: center;
- margin-block-end: 0;
-
- &:not(:first-child) {
- margin-inline-end: var(--sp2);
- }
- }
- }
-
- & .contextual {
- @media (--nav) {
- inset-inline: 100% auto;
- transform: rotate(90deg); /* LTR */
- transform-origin: top left; /* LTR */
-
- & .trigger {
- float: left; /* LTR */
-
- /**
- * Chromium and Webkit do not yet support flow relative logical properties,
- * such as float: inline-end. However, PostCSS Logical does not compile this
- * value, so we accommodate by not using these.
- *
- * @see https://caniuse.com/mdn-css_properties_clear_flow_relative_values
- * @see https://github.com/csstools/postcss-plugins/issues/632
- */
- &:dir(rtl) {
- float: right;
- }
- }
- }
- }
-
- @media (--nav) {
- position: absolute;
- inset-inline-start: 50%;
- display: flex;
- flex-direction: row-reverse;
- width: 100vh;
- transform: rotate(-90deg) translateX(-100%); /* LTR */
- transform-origin: left; /* LTR */
-
- @supports (width: max-content) {
- width: max-content;
- }
- }
-}
-
-[dir="rtl"] {
- @media (--nav) {
- & .rotate {
- transform: rotate(90deg) translateX(100%);
- transform-origin: right;
-
- & .contextual {
- transform: rotate(-90deg);
- transform-origin: top right;
- }
- }
- }
-}
diff --git a/css/layout/pcss/views.pcss.css b/css/layout/pcss/views.pcss.css
deleted file mode 100755
index cbc6f03..0000000
--- a/css/layout/pcss/views.pcss.css
+++ /dev/null
@@ -1,20 +0,0 @@
-/**
- * @file
- * Styles for views.
- */
-
-@import "../base/media-queries.pcss.css";
-
-.view {
- & > * {
- margin-block-end: var(--sp2);
-
- &:last-child {
- margin-block-end: 0;
- }
-
- @media (--md) {
- margin-block-end: var(--sp3);
- }
- }
-}
diff --git a/css/theme/pcss/filter.theme.pcss.css b/css/theme/pcss/filter.theme.pcss.css
deleted file mode 100755
index 29ea34c..0000000
--- a/css/theme/pcss/filter.theme.pcss.css
+++ /dev/null
@@ -1,80 +0,0 @@
-/**
- * @file
- * Styling for the Filter module.
- */
-
-@import "../base/media-queries.pcss.css";
-
-/**
- * Filter information under field.
- */
-.text-full > .form-item {
- margin-block-end: 0;
-}
-.form-element--editor-format {
- vertical-align: top;
-}
-
-.filter-wrapper {
- margin-block: var(--sp1) var(--sp0-5);
-}
-
-.filter-wrapper .form-item {
- margin: 0;
-}
-
-.filter-help {
- float: right; /* LTR */
- padding-block: var(--sp0-5);
- font-size: var(--font-size-xxs);
-
- /**
- * Chromium and Webkit do not yet support flow relative logical properties,
- * such as float: inline-end. However, PostCSS Logical does not compile this
- * value, so we accommodate by not using these.
- *
- * @see https://caniuse.com/mdn-css_properties_clear_flow_relative_values
- * @see https://github.com/csstools/postcss-plugins/issues/632
- */
- &:dir(rtl) {
- float: left;
- }
-}
-
-/**
- * Compose tips.
- *
- * Wraps filter tips on page '/filter/tips[/name]'.
- */
-.compose-tips__item {
- margin-block: var(--sp1-5);
-}
-
-/**
- * Filter guidelines.
- */
-.filter-guidelines__item {
- margin-block-start: var(--sp1);
- font-size: var(--font-size-s);
- line-height: var(--line-height-s);
-}
-.filter-guidelines p {
- margin-block: var(--sp0-25) 0;
-}
-
-/**
- * Filter tips.
- *
- * Long is used on '/filter/tips[/name]', short is used for the filter tips
- * below a text format input.
- */
-.filter-tips--long {
- margin-block-end: var(--sp1-5);
-}
-.filter-tips__item,
-.filter-tips--long p {
- margin-block: var(--sp0-75);
-}
-.filter-tips__item--short {
- margin-block: var(--sp0-25) 0;
-}