From d16e26d313e3107b88c2727bb50de599e2a4f0ae Mon Sep 17 00:00:00 2001 From: kevcenteno Date: Thu, 9 May 2024 00:10:05 -0400 Subject: [PATCH] Add homepage --- .gitignore | 3 +- assets/scss/_base.scss | 2 - assets/scss/_home.scss | 52 + assets/scss/_mixins.scss | 1 - assets/scss/_product-featured.scss | 103 ++ assets/scss/btn.scss | 46 + assets/scss/index.scss | 6 + layouts/index.html | 87 +- ...s_e4662de1a53858f70bce38ce429b67de.content | 925 ------------------ ...scss_e4662de1a53858f70bce38ce429b67de.json | 1 - 10 files changed, 295 insertions(+), 931 deletions(-) create mode 100644 assets/scss/_home.scss create mode 100644 assets/scss/_product-featured.scss create mode 100644 assets/scss/btn.scss delete mode 100644 resources/_gen/assets/scss/index.scss_e4662de1a53858f70bce38ce429b67de.content delete mode 100644 resources/_gen/assets/scss/index.scss_e4662de1a53858f70bce38ce429b67de.json diff --git a/.gitignore b/.gitignore index 681b53575..e1b4e1a23 100644 --- a/.gitignore +++ b/.gitignore @@ -55,7 +55,8 @@ typings/ # hugo files .sass-cache .hugo_build.lock -public +public/ +resources/ # Mac files .DS_Store diff --git a/assets/scss/_base.scss b/assets/scss/_base.scss index c1a7bde9d..b6e5e8c91 100644 --- a/assets/scss/_base.scss +++ b/assets/scss/_base.scss @@ -26,8 +26,6 @@ h1 { @include mixins.heading; font-size: 28px; font-weight: 700; - margin: var(--mm-spacing) 0 0; - padding-top: var(--mm-spacing); } h2 { diff --git a/assets/scss/_home.scss b/assets/scss/_home.scss new file mode 100644 index 000000000..a9f6e2a9b --- /dev/null +++ b/assets/scss/_home.scss @@ -0,0 +1,52 @@ +@use 'variables'; + +.home__callout { + color: var(--mm-color-primary-text); + padding: var(--mm-spacing) var(--mm-spacing) 0; + text-align: center; +} + +.home__callout-heading { + font-family: var(--mm-font-stack-display); + font-size: 20px; + font-weight: 700; + line-height: 1.2em; + margin-bottom: calc(var(--mm-spacing) / 2); + margin-top: 0; + + @include variables.breakpoint('lg') { + font-size: 35px; + } +} + +.home__callout-subheading { + font-family: var(--mm-font-stack-monospace); + font-size: 14px; + font-weight: 700; + + @include variables.breakpoint('lg') { + font-size: 20px; + } +} + +.home__products { + display: grid; + gap: var(--mm-spacing); + padding: calc(var(--mm-spacing)/2); + + @include variables.breakpoint('lg') { + grid-template-columns: repeat(2, minmax(0, 600px)); + justify-content: center; + } +} + +.home__signup { + padding: calc(var(--mm-spacing) / 2) var(--mm-spacing) var(--mm-spacing); +} + +.home__signup-btn { + display: block; + margin: 0 auto; + text-align: center; + max-width: 600px; +} diff --git a/assets/scss/_mixins.scss b/assets/scss/_mixins.scss index 10e28acbd..031969f3b 100644 --- a/assets/scss/_mixins.scss +++ b/assets/scss/_mixins.scss @@ -4,7 +4,6 @@ font-family: var(--mm-font-stack-display); font-weight: 500; line-height: 1.2em; - margin: calc(var(--mm-spacing) * 2) 0 calc(var(--mm-spacing) / 4); position: relative; scroll-margin-top: calc(var(--page-header-height) + var(--mm-spacing)); } diff --git a/assets/scss/_product-featured.scss b/assets/scss/_product-featured.scss new file mode 100644 index 000000000..5348d8df9 --- /dev/null +++ b/assets/scss/_product-featured.scss @@ -0,0 +1,103 @@ +@use 'variables'; + +.product-featured { + border: 1px solid var(--mm-color-border); + border-radius: var(--mm-border-radius); + box-shadow: rgba(0, 0, 0, 0.1) 0 10px 15px -3px, rgba(0, 0, 0, 0.05) 0 4px 6px -2px; + display: grid; + grid-template-areas: + 'header' + 'content' + 'links' + 'learnMore'; + position: relative; +} + +.product-featured__header { + grid-area: header; + padding: 0 var(--mm-spacing); + text-align: center; + +} + +.product-featured__heading { + font-family: var(--mm-font-stack-display); + font-size: 20px; + font-weight: 700; + grid-area: heading; + line-height: 1em; + margin-bottom: 0; + text-align: center; + + &--minfraud { + color: var(--mm-color-minfraud); + } + + &--geoip { + color: var(--mm-color-geoip); + } +} + +.product-featured__subheading { + font-family: var(--mm-font-stack-display); + font-size: 16px; + grid-area: subheading; + line-height: 1em; + margin: 8px 0 0; + text-align: center; +} + +.product-featured__content { + background-color: var(--mm-color-background); + font-size: 14px; + padding: calc(var(--mm-spacing) / 2); + text-align: center; + + & > p { + margin: 0; + } + + @include variables.breakpoint('lg') { + padding: calc(var(--mm-spacing) / 2) var(--mm-spacing); + text-align: left; + } +} + +.content * { + font-size: 14px; +} + +.product-featured__links { + background-color: var(--mm-color-sidebar); + border-top: 1px solid var(--mm-color-border); + display: grid; + gap: var(--mm-spacing); + grid-auto-flow: column; + grid-template-columns: repeat(2, max-content); + justify-content: center; + padding: calc(var(--mm-spacing) / 2); + + @include variables.breakpoint('lg') { + gap: calc(var(--mm-spacing) / 2); + } +} + +.product-featured__footer { + background-color: #f0f8ff; + border-top: 1px solid #cfdee8; + border-bottom-left-radius: var(--mm-border-radius); + border-bottom-right-radius: var(--mm-border-radius); + display: grid; + gap: calc(var(--mm-spacing) / 4); + grid-area: learnMore; + grid-auto-flow: column; + grid-template-columns: max-content max-content; + grid-template-rows: max-content; + justify-content: center; + padding: calc(var(--mm-spacing) / 2); + text-align: center; + + > * { + margin: 0; + } +} diff --git a/assets/scss/btn.scss b/assets/scss/btn.scss new file mode 100644 index 000000000..c23ad163e --- /dev/null +++ b/assets/scss/btn.scss @@ -0,0 +1,46 @@ +.btn { + border: 1px solid #ccc; + border-radius: 5px; + cursor: pointer; + display: inline-block; + padding: .375rem .75rem; + transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; + + &:active, &:focus, &:hover { + text-decoration: none; + } + + &:hover { + background-color: #f9f9f9; + } +} + +.btn--minfraud { + background-color: var(--mm-color-minfraud); + border-color: var(--mm-color-minfraud); + color: #fff; + + &:hover { + background-color: #8a3899; + } +} + +.btn--geoip { + background-color: var(--mm-color-geoip); + border-color: var(--mm-color-geoip); + color: #fff; + + &:hover { + background-color: #217e71; + } +} + +.btn--primary { + background-color: #4877bb; + border-color: #4877bb; + color: #fff; + + &:hover { + background-color: #385f98; + } +} diff --git a/assets/scss/index.scss b/assets/scss/index.scss index f8cccae5c..826e0b555 100644 --- a/assets/scss/index.scss +++ b/assets/scss/index.scss @@ -5,6 +5,10 @@ @import 'search'; @import 'search-results'; @import 'variables'; +@import 'btn'; + +@import 'home'; +@import 'product-featured'; :root { --mm-color-active-blue: #2b7ec6; @@ -16,6 +20,8 @@ --mm-color-logo-blue-dark: #005f83; --mm-color-primary-text: #595959; --mm-color-display-text: #005f83; + --mm-color-geoip: #2ca695; + --mm-color-minfraud: #aa48bc; --mm-border-radius: 6px; --mm-font-stack-default: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Ubuntu, sans-serif; --mm-font-stack-display: 'montserrat', var(--mm-font-stack-default); diff --git a/layouts/index.html b/layouts/index.html index d64dd310d..8ff0d11df 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -1,5 +1,90 @@ {{ define "main" }}
-

hello world

+
+

+ Welcome to the MaxMind Developer Portal! +

+

+ Develop applications using industry-leading IP intelligence and risk + scoring. +

+
+ +
+ + +
+ +
{{ end }} diff --git a/resources/_gen/assets/scss/index.scss_e4662de1a53858f70bce38ce429b67de.content b/resources/_gen/assets/scss/index.scss_e4662de1a53858f70bce38ce429b67de.content deleted file mode 100644 index 87aea8ed2..000000000 --- a/resources/_gen/assets/scss/index.scss_e4662de1a53858f70bce38ce429b67de.content +++ /dev/null @@ -1,925 +0,0 @@ -/***** Mixins *****/ -body { - background: var(--mm-color-background); - display: grid; - font-family: var(--mm-font-stack-default); - -webkit-font-smoothing: antialiased; - line-height: 1.5; - margin: 0; - min-height: 100vh; - padding: 0; -} - -.wrapper { - display: flex; - flex-direction: column; - min-height: 100vh; -} - -main { - flex-grow: 1; -} - -h1 { - color: #00374c; - font-family: var(--mm-font-stack-display); - font-weight: 500; - line-height: 1.2em; - margin: calc(var(--mm-spacing) * 2) 0 calc(var(--mm-spacing) / 4); - position: relative; - scroll-margin-top: calc(var(--page-header-height) + var(--mm-spacing)); - font-size: 28px; - font-weight: 700; - margin: var(--mm-spacing) 0 0; - padding-top: var(--mm-spacing); -} - -h2 { - color: #00374c; - font-family: var(--mm-font-stack-display); - font-weight: 500; - line-height: 1.2em; - margin: calc(var(--mm-spacing) * 2) 0 calc(var(--mm-spacing) / 4); - position: relative; - scroll-margin-top: calc(var(--page-header-height) + var(--mm-spacing)); - font-size: 24px; - font-weight: 700; -} - -h3 { - color: #00374c; - font-family: var(--mm-font-stack-display); - font-weight: 500; - line-height: 1.2em; - margin: calc(var(--mm-spacing) * 2) 0 calc(var(--mm-spacing) / 4); - position: relative; - scroll-margin-top: calc(var(--page-header-height) + var(--mm-spacing)); - font-size: 20px; -} - -h4 { - color: #00374c; - font-family: var(--mm-font-stack-display); - font-weight: 500; - line-height: 1.2em; - margin: calc(var(--mm-spacing) * 2) 0 calc(var(--mm-spacing) / 4); - position: relative; - scroll-margin-top: calc(var(--page-header-height) + var(--mm-spacing)); - font-size: 18px; -} - -h5 { - color: #00374c; - font-family: var(--mm-font-stack-display); - font-weight: 500; - line-height: 1.2em; - margin: calc(var(--mm-spacing) * 2) 0 calc(var(--mm-spacing) / 4); - position: relative; - scroll-margin-top: calc(var(--page-header-height) + var(--mm-spacing)); - font-size: 16px; -} - -h6 { - color: #00374c; - font-family: var(--mm-font-stack-display); - font-weight: 500; - line-height: 1.2em; - margin: calc(var(--mm-spacing) * 2) 0 calc(var(--mm-spacing) / 4); - position: relative; - scroll-margin-top: calc(var(--page-header-height) + var(--mm-spacing)); - font-size: 16px; - text-transform: uppercase; -} -h6 a { - color: rgba(57, 61, 100, 0.5) !important; -} - -p { - color: var(--mm-color-primary-text); - font-size: 16px; - line-height: 26px; - margin: calc(var(--mm-spacing) / 2) 0; -} - -a { - color: var(--mm-color-display-text); - text-decoration: none; -} -a:hover, a:active, a:focus { - text-decoration: underline; -} - -input, -textarea { - color: #000; - font-size: 100%; -} - -hr { - border: 0; - border-top: 1px dashed var(--mm-color-border); - height: 0; - margin: var(--mm-spacing) auto; - padding: 0 !important; - width: 200px; -} - -ul { - list-style-type: disc; - margin: var(--mm-spacing) 0 var(--mm-spacing) calc(var(--mm-spacing) / 2); - padding-left: calc(var(--mm-spacing) / 2); -} - -ul ul { - margin: calc(var(--mm-spacing) / 4) 0; -} - -ol { - list-style-type: decimal; - margin: calc(var(--mm-spacing) / 2) var(--mm-spacing); - padding-left: calc(var(--mm-spacing) / 2); -} - -ol ol { - margin: calc(var(--mm-spacing) / 4) 0; -} - -li { - color: var(--mm-color-primary-text); - font-size: 16px; - line-height: 26px; - margin-bottom: calc(var(--mm-spacing) / 3); -} - -li::marker { - color: #ccc; -} - -blockquote { - color: var(--mm-color-primary-text); - padding: var(--mm-spacing); - position: relative; - z-index: 3; -} -blockquote p { - font-family: var(--mm-font-stack-display); - font-size: 20px; - font-style: italic; - font-weight: 500; - line-height: 1.5em; - text-align: center; -} -blockquote > p:first-of-type { - margin-top: 0; -} -blockquote > p:last-of-type { - margin-bottom: 0; -} -blockquote blockquote:last-of-type { - margin-bottom: 0; -} - -code { - background: #fff; - border: 1px solid var(--mm-color-border); - border-radius: 4px; - color: var(--mm-color-display-text); - font-family: var(--mm-font-stack-monospace); - font-size: 14px; - font-weight: 700; - padding: 2px 6px; - transition: background-color 0.2s ease-out; -} - -a > code { - padding-bottom: 0; -} - -code:hover { - background: #f5f5f5; -} - -img { - display: block; - margin: calc(var(--mm-spacing) * 2) auto; - width: 80%; -} - -table { - font-size: 1rem; - line-height: 1rem; - overflow-x: auto; - width: 100%; -} - -td { - border-top: 1px solid #eee; - color: var(--mm-color-primary-text); - font-size: 12px !important; - line-height: 18px !important; - padding: 16px; -} - -td * { - font-size: 12px; - line-height: 2em; - margin: calc(var(--mm-spacing) / 4) 0; - max-width: initial !important; - min-width: initial !important; - width: auto !important; -} - -td > *:first-child { - margin-top: 0; -} - -td > *:last-child { - margin-bottom: 0; -} - -td [class^=Code-module] { - white-space: nowrap; -} - -th { - border-bottom: 1px solid var(--mm-color-border); - color: var(--mm-color-display-text); - font-family: var(--mm-font-stack-display); - font-size: 14px; - font-weight: 700; - padding: 16px; - position: sticky; - text-align: left; - white-space: nowrap; -} - -thead { - border-bottom: 1px solid var(--mm-color-border); -} - -thead tr th { - background: rgba(255, 255, 255, 0.7); -} - -tbody tr:nth-of-type(even) td { - background: rgba(255, 255, 255, 0.7); -} - -@media only screen and (min-width: 768px) { - h1 { - font-size: 42px; - } -} -/***** Mixins *****/ -/***** Header *****/ -.header-system-status { - background-color: #2e3a47; - display: none; -} - -.show-header-system-status { - display: block !important; - padding: 10px; -} - -.header-system-status-content { - align-items: center; - color: #c0d2e4; - display: grid; - font-size: 14px; - gap: 10px; - grid-auto-flow: column; - grid-gap: 10px; - justify-content: center; - position: relative; - z-index: 1; -} -.header-system-status-content a { - color: #fff; -} - -.header { - background: var(--mm-color-background); - box-shadow: 0 1px 13px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.06); - height: calc(var(--page-header-height) - 10px); - padding-top: 10px; - position: sticky; - top: 0; - width: 100%; - z-index: 10; -} -.header::before, .header::after { - display: block; - height: 10px !important; - overflow: hidden; -} -.header::before { - background-color: #00a7e5; - background-image: url("/images/bg-pattern.svg"); - background-position: center center; - background-size: 80px 140px; - content: " "; - height: 100%; - left: 0; - position: absolute; - top: 0; - transform: translateZ(0); - width: 100%; - will-change: transform; -} -.header::after { - background: rgb(0, 119, 194); - background: linear-gradient(90deg, rgba(0, 119, 194, 0.5) 0%, var(--page-type-color)); - content: " "; - height: 100%; - left: 0; - position: absolute; - top: 0; - width: 100%; -} - -.nav { - display: grid; - grid-template-areas: "logo search"; - grid-template-columns: max-content 1fr; - grid-template-rows: auto; - height: calc(var(--page-header-height) - 10px); - margin: 0 auto; - max-width: 800px; - padding: 0 var(--mm-spacing); -} - -.nav > * { - align-self: center; -} - -.logo { - display: grid; - grid-area: logo; - grid-template-areas: "svg site-name"; - grid-template-columns: auto; - padding: calc(var(--mm-spacing) / 4); - transform: translateX(calc(var(--mm-spacing) / -4)); -} -.logo:hover, .logo:active, .logo:focus { - text-decoration: none; -} - -.logo svg { - align-self: center; - grid-area: svg; - grid-column: 1; - grid-row: 1; - justify-content: center; - max-width: 125px; - width: 100%; -} - -.logo span { - align-self: center; - color: var(--mm-color-primary-text); - font-family: var(--mm-font-stack-display); - font-size: 10px; - font-style: italic; - font-weight: 600; - grid-area: site-name; - letter-spacing: 1px; - line-height: 1; - overflow: hidden; - padding-left: 9px; - position: relative; - text-transform: uppercase; -} - -.logo span::before { - background: #ccc; - content: " "; - display: block; - height: 100%; - left: 0; - position: absolute; - top: 50%; - transform: rotate(20deg) translateY(-50%); - width: 1px; -} - -@media only screen and (min-width: 320px) { - .logo { - gap: 8px; - grid-gap: 8px; - } -} -@media only screen and (min-width: 576px) { - .logo { - gap: 10px; - grid-gap: 10px; - grid-template-columns: auto; - } - .logo span { - padding-left: 18px; - } -} -@media only screen and (min-width: 992px) { - .header { - z-index: 30; - } - .logo svg { - max-width: 172px; - } - .logo span { - font-size: 12px; - } -} -@media only screen and (min-width: 768px) { - .nav { - margin: auto; - } -} -@media only screen and (min-width: 1200px) { - .nav { - padding: 0 var(--mm-spacing) 0; - } -} -/***** Mixins *****/ -/***** Footer *****/ -.footer__container { - grid-template-areas: "a b" "c d" "branding branding" "copyright copyright"; -} - -.footer__branding { - display: flex; - justify-content: space-between; -} - -.footer__logo { - display: inline-block; - margin-right: 10px; - width: 180px; -} - -.footer__copyright { - grid-area: copyright; - text-align: center; -} - -.footer__terms { - margin-top: calc(var(--mm-spacing) / 2); - text-align: center; -} - -@media only screen and (min-width: 768px) { - .footer__container { - grid-template-areas: "a b c d" "branding branding copyright copyright"; - grid-template-columns: 1fr 1fr 1fr 1fr; - grid-template-rows: max-content; - } - .footer__branding { - display: flex; - grid-column: span 2; - justify-content: left; - order: 1; - padding-bottom: var(--mm-spacing); - } - .footer__logo { - width: 200px; - } - .footer__copyright { - grid-column: 3/span 2; - text-align: right; - } - .footer__terms { - margin-top: calc(var(--mm-spacing) / 2); - text-align: right; - } -} -@media only screen and (min-width: 1200px) { - .footer__container { - grid-template-areas: "branding a b c d" "branding copyright copyright copyright copyright"; - grid-template-columns: var(--mm-layout-sidebar-width) 1fr 1fr 1fr 1fr; - } - .footer__branding { - align-content: flex-start; - border-top: 0; - display: grid; - grid-template-areas: "logo" "social"; - justify-content: center; - order: 0; - } - .footer__logo { - display: block; - grid-area: logo; - margin: 0 0 calc(var(--mm-spacing) / 4); - width: 200px; - } - .footer__social { - grid-area: social; - justify-content: center; - } - .footer__socialIcon:first-of-type { - margin-left: 0; - } - .footer__copyright { - display: grid; - font-weight: 400; - grid-area: copyright; - grid-column-gap: var(--mm-spacing); - grid-template-areas: "p terms"; - grid-template-columns: "3fr 1fr"; - text-align: left; - } - .footer__copyright p { - grid-area: p; - margin-top: 0; - } - .footer__terms { - grid-area: terms; - margin-top: 0; - } -} -@media only screen and (min-width: 1660px) { - .footer__container { - max-width: 1660px; - } -} -.footer { - position: relative; - background-color: #2e3a47; - color: var(--mm-color-background); - font-size: 14px; - z-index: 10; -} -.footer::before { - background-color: #00a7e5; - background-image: url("/images/bg-pattern.svg"); - background-position: center center; - background-size: 80px 140px; - content: " "; - height: 100%; - left: 0; - position: absolute; - top: 0; - transform: translateZ(0); - width: 100%; - will-change: transform; -} -.footer::after { - background: rgb(0, 119, 194); - background: linear-gradient(90deg, rgba(0, 119, 194, 0.5) 0%, var(--page-type-color)); - content: " "; - height: 100%; - left: 0; - position: absolute; - top: 0; - width: 100%; -} -.footer::after { - background: rgba(25, 19, 6, 0.7); - content: " "; - height: 100%; - left: 0; - position: absolute; - top: 0; - width: 100%; -} - -.footer__container { - column-gap: 0; - display: grid; - grid-column-gap: 0; - grid-row-gap: 0; - position: relative; - row-gap: 0; - z-index: 2; -} - -.footer__branding { - align-items: flex-end; - flex: 1 0 0; - grid-area: branding; - padding: var(--mm-spacing) var(--mm-spacing); -} - -.footer__social { - display: grid; - grid-template-areas: "a b c"; - height: 30px; - margin-bottom: 14px; -} - -.footer__socialIcon { - color: var(--mm-color-background); - display: inline-block; - font-size: 30px; - height: 30px; - margin-left: calc(var(--mm-spacing) / 4); -} - -.footer__group { - padding: var(--mm-spacing); - padding-bottom: 0; -} - -.footer__link { - color: var(--mm-color-background); - display: block; - font-family: var(--mm-font-stack-default); - font-weight: 400; - margin-bottom: 10px; - text-decoration: none; -} -.footer__link:hover { - text-decoration: underline; -} - -.footer__group__products { - grid-area: a; -} - -.footer__group__support { - grid-area: b; -} - -.footer__group__developers { - grid-area: c; -} - -.footer__group__company { - grid-area: d; -} - -.footer__heading { - color: #c0d2e4; - font-family: var(--mm-font-stack-display); - font-size: 16px; - font-weight: 500; - margin: 0 0 calc(var(--mm-spacing) / 2) 0; - margin-bottom: calc(var(--mm-spacing) / 2); -} - -.footer__copyright { - font-size: 12px; - grid-area: copyright; - padding: var(--mm-spacing) var(--mm-spacing) calc(var(--mm-spacing) * 2.5); -} - -.footer__copyright p { - grid-area: p; - margin: 0; -} - -.footer__terms { - grid-area: terms; - grid-column-gap: var(--mm-spacing); -} - -.footer__ccpa, -.footer__status { - position: relative; -} - -.footer__status-icon { - left: -10px; - position: absolute; - top: 50%; - transform: translate(-100%, -50%); -} - -.status-icon { - display: none; -} - -.show-status-icon { - display: block !important; -} - -.footer__ccpa-icon { - left: -10px; - position: absolute; - top: 57%; - transform: translate(-100%, -50%); -} -.footer__ccpa-icon svg { - height: 14px; -} - -.footer__termsLink { - color: var(--mm-color-background); - text-decoration: none; -} -.footer__termsLink:first-child::after { - color: rgba(255, 255, 255, 0.2); - content: "|"; - padding: 0 10px; -} - -/***** Mixins *****/ -/***** Mixins *****/ -.searchbar { - display: none; - position: relative; -} - -.mag svg { - color: var(--mm-color-primary-text); - left: calc(var(--mm-spacing) / 2); - position: absolute; - top: 50%; - transform: translateY(-50%); -} - -.searchbar__open { - display: inline-block; - left: calc(50% - 20px); - margin: 0 calc(var(--mm-spacing) / 2); - max-width: calc(var(--mm-max-width) - 80px); - position: absolute; - top: calc(50% + 5px); - transform: translate(-50%, -50%); - width: calc(100% - 2 * var(--mm-spacing)); - z-index: 100; -} - -.search { - position: relative; -} - -.search__button { - background: var(--mm-color-background); - border: 1px solid var(--mm-color-border); - border-radius: var(--mm-border-radius); - box-sizing: border-box; - color: var(--mm-color-primary-text); - cursor: pointer; - font-size: 12px; - height: 30px; - min-width: 30px; - padding: 0; - width: 30px; - float: right; -} -.search__button:hover { - background-color: var(--mm-color-sidebar); -} -@media only screen and (min-width: 420px) { - .search__button { - font-size: 16px; - height: 50px; - min-width: 50px; - width: 50px; - } -} - -.input { - appearance: none !important; - border: 1px solid var(--mm-color-border); - border-radius: var(--mm-border-radius); - color: var(--mm-color-primary-text); - padding: 12px 10px 12px calc(var(--mm-spacing) + 15px); - width: 100%; -} -.input::placeholder { - opacity: 0.5; -} -.input:focus { - box-shadow: 0 0 0 2px var(--mm-color-logo-blue-light); - outline: none; -} - -.hidden { - display: none; -} - -/* stylelint-disable no-descending-specificity */ -@media only screen and (max-width: 992px) { - .search-results__heading { - font-size: 20px; - } -} -@media only screen and (min-width: 992px) { - .search-results__heading { - font-size: 30px; - } -} -.search-results { - margin: auto; - max-width: 800px; - padding: 0 var(--mm-spacing) 0; -} - -.search-results__header { - margin-bottom: calc(var(--mm-spacing) / 2); -} -.search-results__header .search-results__heading { - color: #00374c; - font-family: var(--mm-font-stack-display); - font-weight: 700; - line-height: 1.2em; - margin: 0; - padding-top: var(--mm-spacing); - position: relative; - scroll-margin-top: calc(var(--page-header-height) + var(--mm-spacing)); -} -.search-results__header .search-results__count { - font-size: 14px; -} -.search-results__header a { - border-bottom: 2px dotted var(--mm-color-display-text); - color: var(--mm-color-display-text); -} -.search-results__header a:hover { - border-bottom-style: solid; - text-decoration: none; -} - -.search__result-list-item { - margin-bottom: calc(var(--mm-spacing) / 1.5); -} - -.search__result-title { - color: var(--mm-color-display-text); - display: inline-block; - font-size: 20px; - font-weight: 500; - margin-bottom: 3px; - text-decoration: none; -} -.search__result-title:hover { - cursor: pointer; - text-decoration: underline; -} - -.search__result-url { - display: block; - font-size: 12px; - margin-bottom: 3px; -} - -.search__result-description { - font-size: 16px; - font-weight: 400; - margin: 0; -} - -.search__result-heading { - border-top: 1px dashed var(--mm-color-border); - color: #00374c; - font-family: var(--mm-font-stack-display); - font-size: 20px; - font-weight: 500; - line-height: 1.2em; - margin: var(--mm-spacing) 0 calc(var(--mm-spacing) / 2) 0; - padding-top: var(--mm-spacing); -} - -.search__pagination { - padding-bottom: calc(var(--mm-spacing) * 2); -} -.search__pagination .search__next, -.search__pagination .search__previous { - border-bottom: 2px dotted var(--mm-color-display-text); - color: var(--mm-color-display-text); - font-size: 18px; - text-decoration: none; -} -.search__pagination .search__next:hover, -.search__pagination .search__previous:hover { - border-bottom: 2px solid var(--mm-color-display-text) !important; -} -.search__pagination .search__next { - display: none; - float: right; -} -.search__pagination .search__previous { - display: none; - float: left; -} - -:root { - --mm-color-active-blue: #2b7ec6; - --mm-color-background: #fff; - --mm-color-background-code: #274958; - --mm-color-sidebar: #f5f6f7; - --mm-color-border: #ddd; - --mm-color-logo-blue-light: #00aeef; - --mm-color-logo-blue-dark: #005f83; - --mm-color-primary-text: #595959; - --mm-color-display-text: #005f83; - --mm-border-radius: 6px; - --mm-font-stack-default: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Ubuntu, sans-serif; - --mm-font-stack-display: "montserrat", var(--mm-font-stack-default); - --mm-font-stack-monospace: "Source Code Pro", monospace; - --mm-layout-toc-width: 290px; - --mm-layout-sidebar-width: 350px; - --mm-max-width: 880px; - --mm-outline: 2px solid var(--mm-color-logo-blue-light); - --mm-overview-heading-drop-shadow: 1px 3px 0 rgba(0, 0, 0, 0.25); - --mm-spacing: 40px; - --page-header-height: 80px; - --page-type-color: rgba(255, 255, 255, 0.3); -} - -*:focus { - outline-color: var(--mm-color-logo-blue-light); - outline-style: solid; - outline-width: 2px; -} \ No newline at end of file diff --git a/resources/_gen/assets/scss/index.scss_e4662de1a53858f70bce38ce429b67de.json b/resources/_gen/assets/scss/index.scss_e4662de1a53858f70bce38ce429b67de.json deleted file mode 100644 index d866b8f67..000000000 --- a/resources/_gen/assets/scss/index.scss_e4662de1a53858f70bce38ce429b67de.json +++ /dev/null @@ -1 +0,0 @@ -{"Target":"/scss/index.css","MediaType":"text/css","Data":{}} \ No newline at end of file