diff --git a/src/keycloak-theme/resources/styles/scss/background.scss b/src/keycloak-theme/resources/styles/scss/background.scss new file mode 100644 index 0000000..41aef49 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/background.scss @@ -0,0 +1,28 @@ +.ps-background { + display: flex; + flex-wrap: wrap; + align-items: flex-start; + justify-content: space-between; + speak: none; + + &--logo { + width: 100px; + margin: 0.1rem; + } + + &--1312 { + transform: rotate(34deg); + transform-origin: center center; + color: #eee; + position: fixed; + z-index: 1; + top: -50vh; + left: -50vw; + font-weight: 900; + font-size: 7rem; + line-height: 6rem; + width: 200vw; + height: 200vh; + } +} + diff --git a/src/keycloak-theme/resources/styles/scss/button.scss b/src/keycloak-theme/resources/styles/scss/button.scss new file mode 100644 index 0000000..96ea290 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/button.scss @@ -0,0 +1,32 @@ +.ps-button { + font-size: 1rem; + padding: 0.5em 1em; + line-height: 1.2em; + border: 0.125em solid var(--foreground); + border-radius: 1.5em; + background-color: var(--background-darker-2); + cursor: pointer; + + &:hover, + &:focus { + border-color: var(--accent); + } + + &_primary { + border: 0.25em solid var(--foreground); + background-color: var(--background); + color: var(--foreground); + font-weight: bold; + + &:focus, + &:hover { + background-color: var(--foreground); + color: var(--background); + } + } + + &_small { + font-size: 0.8rem; + padding: 0.25em 0.7em; + } +} diff --git a/src/keycloak-theme/resources/styles/scss/card.scss b/src/keycloak-theme/resources/styles/scss/card.scss new file mode 100644 index 0000000..93d4766 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/card.scss @@ -0,0 +1,19 @@ +.ps-card { + background-color: var(--background); + display: flex; + flex-direction: column; + border: 1rem solid var(--foreground); + + &--header { + padding: 2rem; + } + + &--title { + margin: 0; + padding: 0; + } + + &--body { + padding: 0rem 2rem; + } +} diff --git a/src/keycloak-theme/resources/styles/scss/container.scss b/src/keycloak-theme/resources/styles/scss/container.scss new file mode 100644 index 0000000..464244b --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/container.scss @@ -0,0 +1,10 @@ +.ps-container { + display: flex; + flex-direction: column; + align-items: stretch; + + > * { + margin: 0; + margin-bottom: 1.25rem; + } +} diff --git a/src/keycloak-theme/resources/styles/scss/footer.scss b/src/keycloak-theme/resources/styles/scss/footer.scss new file mode 100644 index 0000000..f04c471 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/footer.scss @@ -0,0 +1,19 @@ +.ps-footer { + display: flex; + margin-top: auto; + z-index: 1; + + &--link { + &:hover { + text-shadow: 0.2vw 0px 0px var(--accent); + } + + @media screen and (min-width: 700px) { + font-size: 4rem; + } + + @media screen and (min-width: 1000px) { + font-size: 2rem; + } + } +} diff --git a/src/keycloak-theme/resources/styles/scss/form-group.scss b/src/keycloak-theme/resources/styles/scss/form-group.scss new file mode 100644 index 0000000..9aa6485 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/form-group.scss @@ -0,0 +1,21 @@ +.ps-form-group { + display: flex; + flex-direction: column; + + &--label { + margin-bottom: 0.5rem; + display: flex; + font-weight: bold; + } + + .ps-button { + align-self: flex-start; + } + + &--error { + margin-top: 0.25rem; + color: var(--accent); + font-weight: bold; + // font-family: monospace; + } +} diff --git a/src/keycloak-theme/resources/styles/scss/header.scss b/src/keycloak-theme/resources/styles/scss/header.scss new file mode 100644 index 0000000..dc30d80 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/header.scss @@ -0,0 +1,54 @@ +.ps-header { + display: flex; + justify-content: space-between; + padding: 0; + margin: 0; + overflow-x: auto; + z-index: 100; + + &--title { + font-size: 1.5rem; + padding: 0 1rem; + margin: 0; + border-bottom: 0.5rem solid var(--foreground); + background-color: var(--background); + border-right: 0.5rem solid var(--foreground); + pointer-events: all; + } + + &--i18n { + margin-left: auto; + } + + &--nav { + display: flex; + border-bottom: 0.5rem solid var(--foreground); + border-left: 0.5rem solid var(--foreground); + background-color: var(--background); + padding-left: 1rem; + pointer-events: all; + } + + &--nav-list { + display: flex; + justify-content: flex-end; + align-items: center; + list-style: none; + margin: 0; + padding: 0; + } + + &--nav-item { + margin: 0; + margin-right: 1rem; + + &-action { + color: var(--foreground); + text-decoration: none; + + &:hover { + color: var(--accent); + } + } + } +} diff --git a/src/keycloak-theme/resources/styles/scss/homelink.scss b/src/keycloak-theme/resources/styles/scss/homelink.scss new file mode 100644 index 0000000..76edf0c --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/homelink.scss @@ -0,0 +1,25 @@ +.ps-homelink { + pointer-events: all; + color: var(--foreground); + background: white; + text-decoration: none; + text-align: center; + font-weight: 900; + font-size: 24px; + padding: 8px; + line-height: 1em; + text-shadow: 0.15vw 0px 0px white; + transition: text-shadow 0.1s ease; + border: 12px solid black; + border-top: 0; + border-left: 0; + + &:hover { + text-shadow: 0.3vw 0px 0px var(--accent); + } + + @media screen and (min-width: 1200px) { + font-size: 32px; + padding: 12px; + } +} diff --git a/src/keycloak-theme/resources/styles/scss/i18n-links.scss b/src/keycloak-theme/resources/styles/scss/i18n-links.scss new file mode 100644 index 0000000..2c8856e --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/i18n-links.scss @@ -0,0 +1,18 @@ +.ps-i18n-links { + display: flex; + margin: 0; + pointer-events: all; + color: var(--foreground); + background: white; + text-decoration: none; + text-align: center; + font-weight: 900; + font-size: 24px; + padding: 8px; + line-height: 1em; + text-shadow: 0.15vw 0px 0px var(--background); + transition: text-shadow 0.1s ease; + border: 12px solid var(--foreground); + border-top: 0; + border-right: 0; +} diff --git a/src/keycloak-theme/resources/styles/scss/index.scss b/src/keycloak-theme/resources/styles/scss/index.scss new file mode 100644 index 0000000..7877add --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/index.scss @@ -0,0 +1,54 @@ +* { + box-sizing: border-box; +} + +html { + --accent: #ed1c24; + --foreground: #000; + --foreground-lighter-1: rgba(0, 0, 0, 0.7); + --foreground-lighter-2: rgba(0, 0, 0, 0.3); + --background: #fff; + --background-darker-1: #f5f5f5; + --background-darker-2: #eeeeee; + + font-family: 'Open Sans', Arial, sans-serif; + font-weight: 800; + background: var(--background); + color: var(--foreground); + -ms-text-size-adjust: 100%; + -webkit-text-size-adjust: 100%; + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + box-sizing: border-box; + width: 100vw; + height: 100vh; + margin: 0; + font-size: 16px; + + @media screen and (min-width: 1200px) { + font-size: 20px; + } +} + +*:focus-visible { + outline: 0.2rem solid var(--accent); +} + +@import './container'; +@import './link'; +@import './card'; +@import './button'; +@import './input'; +@import './table'; +@import './form-group'; + +@import './homelink'; +@import './i18n-links'; +@import './main'; +@import './header'; +@import './page'; +@import './login-flow-pre'; +@import './section-nav'; +@import './logo'; +@import './background'; +@import './footer'; diff --git a/src/keycloak-theme/resources/styles/scss/input.scss b/src/keycloak-theme/resources/styles/scss/input.scss new file mode 100644 index 0000000..5dafa75 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/input.scss @@ -0,0 +1,23 @@ +.ps-input { + padding: 0.5rem 0.5rem; + border: 2px solid var(--foreground-lighter-1); + font-size: 1.2rem; + + &:hover, + &:focus { + border-color: var(--accent); + } + + &:focus { + color: var(--background); + background-color: var(--foreground); + } + + &:disabled { + background-color: var(--background-darker-2); + + &:hover { + border-color: var(--foreground-lighter-1); + } + } +} diff --git a/src/keycloak-theme/resources/styles/scss/link.scss b/src/keycloak-theme/resources/styles/scss/link.scss new file mode 100644 index 0000000..b330599 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/link.scss @@ -0,0 +1,11 @@ +.ps-link { + cursor: pointer; + color: var(--accent); + border-bottom: 1px solid transparent; + transition: border-bottom 0.1s ease; + text-decoration: none; + + &:hover { + border-bottom: 4px solid var(--accent); + } +} diff --git a/src/keycloak-theme/resources/styles/scss/login-flow-pre.scss b/src/keycloak-theme/resources/styles/scss/login-flow-pre.scss new file mode 100644 index 0000000..6e34828 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/login-flow-pre.scss @@ -0,0 +1,16 @@ +.ps-login-flow-pre { + margin: 2rem; + display: flex; + + border-bottom: 0.25rem solid var(--foreground); + padding-bottom: 0.25rem; + + &--selected { + font-weight: bold; + margin-right: 1rem; + } + + &--cancel { + font-weight: normal; + } +} diff --git a/src/keycloak-theme/resources/styles/scss/logo.scss b/src/keycloak-theme/resources/styles/scss/logo.scss new file mode 100644 index 0000000..65fab19 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/logo.scss @@ -0,0 +1,45 @@ +.ps-logo { + display: flex; + align-items: center; + justify-content: center; + position: relative; + z-index: 1; + width: 100px; + + &--base { + animation-name: rotate; + animation-duration: 0.3s; + animation-timing-function: linear; + animation-play-state: paused; + animation-iteration-count: infinite; + + &:hover { + animation-play-state: running; + } + } + + &:nth-child(2n) &--base { animation-delay: -0.1s; } + &:nth-child(3n) &--base { animation-delay: -0.3s; } + &:nth-child(5n) &--base { animation-delay: -0.5s; } + &:nth-child(7n) &--base { animation-delay: -7s; } + &:nth-child(11n) &--base { animation-delay: -0.9s; } + &:nth-child(13n) &--base { animation-delay: -1s; } + + &--base::before { + position: absolute; + display: block; + content: ''; + width: 100%; + height: 100%; + border-radius: 50%; + } +} + +@keyframes rotate { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} diff --git a/src/keycloak-theme/resources/styles/scss/main.scss b/src/keycloak-theme/resources/styles/scss/main.scss new file mode 100644 index 0000000..f4e0a37 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/main.scss @@ -0,0 +1,37 @@ +.ps-main { + display: flex; + flex-direction: column; + align-items: stretch; + justify-content: space-between; + height: 100vh; + width: 100vw; + margin: 0; + padding-top: 10vw; + padding-bottom: 2vw; + overflow: auto; + position: relative; + + &--background { + position: fixed; + top: 0; + left: 0; + height: 100vh; + width: 100vw; + overflow: hidden; + } + + &--page { + z-index: 1; + } + + &_full { + padding: 0; + } + + &_full &--page { + @media screen and (min-width: 1200px) { + flex-direction: column; + flex-wrap: nowrap; + } + } +} diff --git a/src/keycloak-theme/resources/styles/scss/nav.scss b/src/keycloak-theme/resources/styles/scss/nav.scss new file mode 100644 index 0000000..44101d2 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/nav.scss @@ -0,0 +1,3 @@ +.ps-nav { + display: flex; +} diff --git a/src/keycloak-theme/resources/styles/scss/page.scss b/src/keycloak-theme/resources/styles/scss/page.scss new file mode 100644 index 0000000..31c9d3f --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/page.scss @@ -0,0 +1,150 @@ +.ps-page { + display: flex; + width: 100vw; + flex-direction: column; + align-items: center; + justify-content: flex-start; + padding: 0; + pointer-events: none; + padding-top: 4rem; + + @media screen and (min-width: 1200px) { + padding: 1vw; + padding-top: 4rem; + flex-direction: row; + align-items: flex-start; + } + + &_home { + flex-direction: row; + flex-wrap: wrap; + } + + &--header { + width: 100%; + top: 0; + left: 0; + right: 0; + height: auto; + position: fixed; + } + + &--title { + font-size: 2rem; + border-bottom: 0.5rem solid var(--foreground); + padding-bottom: 0.5rem; + margin: 2rem; + } + + &--section { + border: 12px solid black; + margin-top: 2rem; + margin-bottom: 2rem; + max-width: 700px; + flex-basis: 100%; + flex-shrink: 1; + pointer-events: all; + color: var(--foreground); + background: var(--background); + overflow-wrap: break-word; + hyphens: auto; + pointer-events: all; + + @media screen and (min-width: 1200px) { + margin: 1vw; + } + + &_home { + padding: 5vw; + } + + &_full { + max-width: unset; + width: calc(100vw - 1.6rem); + margin: 0.8rem; + + @media screen and (min-width: 1200px) { + width: 96vw; + margin: 1vw; + } + } + + a { + color: var(--accent); + border-bottom: 1px solid transparent; + transition: border-bottom 0.1s ease; + text-decoration: none; + + &:hover { + border-bottom: 4px solid var(--accent); + } + } + + img { + width: 230px; + margin-top: 1rem; + } + } + + &--section-link { + position: sticky; + top: 0; + background-color: var(--background); + padding: 1rem; + display: flex; + justify-content: flex-end; + align-items: center; + text-align: right; + padding-left: 132px; + + @media screen and (min-width: 1200px) { + display: none; + border-bottom: 0; + } + + &-icon { + margin-left: 8px; + } + } + + &--section-contents { + margin: 2rem; + margin-bottom: 0; + font-weight: 500; + line-height: 1.4; + + &:last-child { + margin-bottom: 5vw; + } + + pre, + code { + background-color: var(--background-darker-2); + border-radius: 4px; + padding: 4px; + } + + pre { + border: 1px solid var(--foreground-lighter-2); + } + + > * { + margin-bottom: 0; + margin-top: 0.5rem; + } + + > .ps-table { + margin-top: 1rem; + + + * { + margin-top: 1rem; + } + } + + > h2, h3, h4 { + margin-top: 1.5rem; + line-height: 1.5; + } + } +} + diff --git a/src/keycloak-theme/resources/styles/scss/section-nav.scss b/src/keycloak-theme/resources/styles/scss/section-nav.scss new file mode 100644 index 0000000..5d48b4a --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/section-nav.scss @@ -0,0 +1,38 @@ +.ps-section-nav { + display: flex; + justify-content: space-between; + flex-wrap: wrap; + position: sticky; + top: 0; + left: 0; + width: 100%; + background-color: var(--background); + border-bottom: 2px solid var(--foreground); + overflow-x: auto; + + &--list { + list-style: none; + display: flex; + position: sticky; + margin: 0 -0.5rem; + } + + &--link { + display: flex; + + a { + padding: 1rem 0.5rem; + } + + &_active { + a { + color: var(--foreground); + border-bottom: 4px solid var(--foreground); + + &:hover { + border-color: var(--foreground); + } + } + } + } +} diff --git a/src/keycloak-theme/resources/styles/scss/table.scss b/src/keycloak-theme/resources/styles/scss/table.scss new file mode 100644 index 0000000..196a946 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/table.scss @@ -0,0 +1,35 @@ +.ps-table { + overflow: auto; + border-collapse: collapse; + margin-left: -0.25rem; + width: calc(100% + 0.25rem); + + td, th { + padding: 0.1rem 0.25rem; + } + + tr { + border: 0; + border-left: 0.25rem solid transparent; + + &:nth-child(2n) { + background-color: var(--background-darker-1); + border-left: 0.25rem solid var(--background-darker-1); + } + + &:hover { + background-color: var(--background-darker-2); + border-color: var(--accent); + } + } + + thead tr { + border-bottom: 4px solid var(--foreground-lighter-1); + font-weight: bold; + text-align: center; + } + + thead td, th { + padding: 0.1rem 0.5rem; + } +} diff --git a/src/keycloak-theme/resources/styles/scss/typography.scss b/src/keycloak-theme/resources/styles/scss/typography.scss new file mode 100644 index 0000000..ec28e13 --- /dev/null +++ b/src/keycloak-theme/resources/styles/scss/typography.scss @@ -0,0 +1,322 @@ +/* To regenerate this file, run $ google-font-downloader 'https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,800;1,400;1,800&display=swap' */ + +/* cyrillic-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtE6FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; +// } +// /* cyrillic */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWvU6FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +// } +// /* greek-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtU6FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+1F00-1FFF; +// } +// /* greek */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuk6FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0370-03FF; +// } +// /* hebrew */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWu06FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; +// } +// /* vietnamese */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtk6FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB; +// } +// /* latin-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWt06FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +// } +// /* latin */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuU6FxZCJgg.woff2) format('woff2'); +// unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; +// } +// /* cyrillic-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtE6FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; +// } +// /* cyrillic */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWvU6FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +// } +// /* greek-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtU6FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+1F00-1FFF; +// } +// /* greek */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuk6FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0370-03FF; +// } +// /* hebrew */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWu06FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; +// } +// /* vietnamese */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtk6FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB; +// } +// /* latin-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWt06FxZCJgvAQ.woff2) format('woff2'); +// unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +// } +// /* latin */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: italic; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuU6FxZCJgg.woff2) format('woff2'); +// unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; +// } +// /* cyrillic-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSKmu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; +// } +// /* cyrillic */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSumu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +// } +// /* greek-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSOmu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+1F00-1FFF; +// } +// /* greek */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSymu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0370-03FF; +// } +// /* hebrew */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS2mu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; +// } +// /* vietnamese */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSCmu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB; +// } +// /* latin-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSGmu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +// } +// /* latin */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 400; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS-mu0SC55I.woff2) format('woff2'); +// unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; +// } +// /* cyrillic-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSKmu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; +// } +// /* cyrillic */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSumu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +// } +// /* greek-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSOmu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+1F00-1FFF; +// } +// /* greek */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSymu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0370-03FF; +// } +// /* hebrew */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS2mu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; +// } +// /* vietnamese */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSCmu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB; +// } +// /* latin-ext */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSGmu0SC55K5gw.woff2) format('woff2'); +// unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +// } +// /* latin */ +// @font-face { +// font-family: 'Open Sans'; +// font-style: normal; +// font-weight: 800; +// font-stretch: 100%; +// font-display: swap; +// src: url(fonts/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS-mu0SC55I.woff2) format('woff2'); +// unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; +// }