diff --git a/_data/nav.json b/_data/nav.json index 4965fdb9..474f7d60 100644 --- a/_data/nav.json +++ b/_data/nav.json @@ -14,11 +14,6 @@ "icon": "fa-solid fa-wand-magic-sparkles", "url": "/demo" }, - { - "title": "Services", - "icon": "fa-solid fa-puzzle-piece", - "url": "/services/" - }, { "title": "Login", "icon": "fa-solid fa-right-from-bracket", diff --git a/_data/nav_footer.json b/_data/nav_footer.json index 66f2b240..4ab7c059 100644 --- a/_data/nav_footer.json +++ b/_data/nav_footer.json @@ -42,10 +42,6 @@ "title": "Demo", "url": "/demo" }, - { - "title": "Services", - "url": "/services" - }, { "title": "What they say", "url": "/what-they-say/" diff --git a/_includes/feedback.html b/_includes/feedback.html new file mode 100644 index 00000000..821a69b3 --- /dev/null +++ b/_includes/feedback.html @@ -0,0 +1,23 @@ + + Get ScanGov + + \ No newline at end of file diff --git a/_includes/footer.html b/_includes/footer.html index f8084ad2..1c297ed5 100644 --- a/_includes/footer.html +++ b/_includes/footer.html @@ -14,15 +14,12 @@ {% endfor %} -
+
-
-

+

+

Built with - + by ScanGov

@@ -30,12 +27,21 @@
+{% include "analytics.html" %} +{% include "js.html" %} +{% include "feedback.html" %} {% include "analytics.html" %} + if(document.getElementById('dropdownMenuButton')) { + document.getElementById('dropdownMenuButton').addEventListener('click',function(e) { + let el = document.querySelector('[aria-labelledby="'+this.id+'"]') + el.classList.toggle('show'); + }) + } + {% getBundle "fontawesome" %} \ No newline at end of file diff --git a/_includes/header.html b/_includes/header.html index 82682d5d..e2a0021f 100644 --- a/_includes/header.html +++ b/_includes/header.html @@ -60,9 +60,16 @@ {% include "favicon.html" %} {% include "style.html" %} + - - + + diff --git a/_includes/js.html b/_includes/js.html index e69de29b..57e7d665 100644 --- a/_includes/js.html +++ b/_includes/js.html @@ -0,0 +1,11 @@ + \ No newline at end of file diff --git a/_includes/layouts/redirect.html b/_includes/layouts/redirect.html new file mode 100644 index 00000000..58623d9e --- /dev/null +++ b/_includes/layouts/redirect.html @@ -0,0 +1,13 @@ + + + + + + + Redirecting… + + + +

Redirecting… Click here if you are not redirected.

+ + diff --git a/_includes/style.html b/_includes/style.html index 63e3759e..8381b72d 100644 --- a/_includes/style.html +++ b/_includes/style.html @@ -1,5 +1,7 @@ - -{% set css %} {% include "public/css/style.css" %} {% endset %} - \ No newline at end of file + + + + + + + \ No newline at end of file diff --git a/content/index.html b/content/index.html index f71f4497..7b3dcb7b 100644 --- a/content/index.html +++ b/content/index.html @@ -11,7 +11,7 @@

Indicators

-

Holistically addressing government digital experience.

+

Holistically addressing digital experience.

{% include "indicator_list.html" %}

Indicators @@ -42,7 +42,6 @@

Why it matters

Who it's for

-

Everyone responsible for serving the public.

{% for item in who %}
@@ -105,34 +104,6 @@

GovX Awards

-
-
-

Showcase

-

Featured digital experience scorecards.

-
- {% for item in showcase %} -
- {% if item.feature %} -
-
-

- - {{ item.title }} -

-
-
- {% endif %} -
- {% endfor %} -
-

- Showcase -

-
-
@@ -148,7 +119,7 @@

Plans

Now scanning ...

-

ScanGov government digital experience reviews.

+

ScanGov digital experience reviews.

{% include "now_scanning_list.html" %}

Now scanning ... diff --git a/content/news/2025-11-23-scangov-website-rfp-builder.md b/content/news/2025-11-23-scangov-website-rfp-builder.md new file mode 100644 index 00000000..537d5c8a --- /dev/null +++ b/content/news/2025-11-23-scangov-website-rfp-builder.md @@ -0,0 +1,31 @@ +--- +title: "New ScanGov website RFP builder" +description: "Create website request for proposals based on ScanGov Standards." +date: 2025-11-23 +ogImage: pages/website-rfp-og.png +ogImageAlt: "Website RFP builder" +topics: + - ScanGov +--- + +ScanGov is proud to introduce our free [website request for proposal builder](https://scangov.com/rfp-builder/). + +You can now quickly create website RFPs based on [ScanGov Standards](https://standards.scangov.org) that include comprehensive compliance specifications for: + +* Accessibility +* AI-friendly +* Content +* Domain +* Security +* Search engine optimization +* Social media + +## How it works + +* Enter your organization/contact information +* Add general instructions (if any) +* Get your custom RFP + +## Get started + +[Build your website RFP.](https://scangov.com/rfp-builder/) diff --git a/content/plans.html b/content/plans.html index d661460d..0fe8924f 100644 --- a/content/plans.html +++ b/content/plans.html @@ -7,23 +7,6 @@ description: "ScanGov pricing." --- -

+
{% include "plans.html" %} -

* Need additional scans? Contact us for bulk discounts.

-

Need a free trial? Scan a few pages on your domain for free here.

- -
-
-
-
-

Questions?

-

Schedule demo - Contact us

-

Value added resellers

-

Making purchase for government partner?

-

Purchase enterprise with annual billing here.

-

Purchase enterprise max plan with annual billing with 2 months free here.

-
-
-
\ No newline at end of file diff --git a/content/services.html b/content/services.html deleted file mode 100644 index 1d26c16f..00000000 --- a/content/services.html +++ /dev/null @@ -1,53 +0,0 @@ ---- -layout: "layouts/default" -date: 2025-08-30 -modified: -author: ScanGov -title: Services -description: "Supporting government digital transformation." -ogImage: pages/services-og.png -ogImageAlt: "Puzzle piece icon centered with ScanGov logo bottom right" -img_caption: "File icon by Font Awesome" -img_link: https://fontawesome.com -type: ---- - -
-
-
- {% set category = "" %} - {% for service in services.services %} - {% if service.category != category %} - {% if category != "" %} -
- {# close card group #} - {% endif %} - {% set category = service.category %} -

{{ service.category }}

-
- {% endif %} -
-
-
-

{{ service.name }}

-
-

{{ service.description }}

-
    - {% for output in service.serviceOutput %} -
  • {{ output }}
  • - {% endfor %} -
- -
-
- -
-
- {% endfor %} -
-
-
\ No newline at end of file diff --git a/content/sso-setup-guide.md b/content/sso-setup-guide.md index 6a34931a..06a5fcd2 100644 --- a/content/sso-setup-guide.md +++ b/content/sso-setup-guide.md @@ -1,75 +1,5 @@ --- -layout: layouts/default-plain -date: 2026-02-10 -modified: 2026-02-10 -author: ScanGov -title: "SSO Setup Guide" -description: "Set up Single Sign-On (SSO) with Okta using OpenID Connect (OIDC) to let your team log in to ScanGov with their existing credentials." +layout: layouts/redirect +redirect_to: https://docs.scangov.org/single-sign-on +permalink: /sso-setup-guide/ --- - -ScanGov supports Single Sign-On (SSO) via Okta using the OpenID Connect (OIDC) protocol. This allows your team members to log in to ScanGov using their existing Okta credentials. - -## Prerequisites - -- A ScanGov organization account with a paid enterprise plan -- An Okta administrator account with permission to create applications - -## Step 1: Create an OIDC Application in Okta - -1. Log in to your Okta Admin Console -2. Go to **Applications** > **Applications** > **Create App Integration** -3. Select **OIDC - OpenID Connect** as the sign-in method -4. Select **Web Application** as the application type -5. Click **Next** - -Configure the application with the following settings: - -| Setting | Value | -|---------|-------| -| App integration name | ScanGov | -| Grant type | Authorization Code | -| Sign-in redirect URI | `https://my.scangov.com/auth/callback` | -| Sign-out redirect URI | (leave blank) | -| Controlled access | Assign to the groups or people who should have access | - -6. Click **Save** - -After saving, Okta will display your **Client ID** and **Client Secret**. You will need these in the next step. - -Also note your **Okta domain**, which looks like `https://your-org.okta.com`. You can find this in the top-right corner of the Okta Admin Console. - -## Step 2: Configure SSO in ScanGov - -1. Log in to ScanGov at [my.scangov.com](https://my.scangov.com) -2. Go to your organization settings and click **SSO** in the sidebar -3. Enter the following values: - - **Email Domain** — The email domain your team uses (e.g., `acme.gov`). Users with this email domain will be routed to your Okta for SSO login. - - **Okta Domain** — Your Okta org URL (e.g., `https://your-org.okta.com`) - - **Client ID** — The Client ID from your Okta application - - **Client Secret** — The Client Secret from your Okta application -4. Click **Save** - -## Step 3: Log In with SSO - -Once configured, team members can log in via SSO: - -1. Go to [my.scangov.com](https://my.scangov.com) and click **Sign in with SSO** -2. Enter your email address and click **Continue** -3. You will be redirected to your organization's Okta login page -4. Authenticate with Okta -5. You will be redirected back to ScanGov and logged in - -## FAQ - -**Can team members still log in with a password?** -Yes. Password login remains available for users who were directly invited and setup a password. SSO is an additional login method. - -**What happens if I update the Client Secret in Okta?** -You will need to update the Client Secret in ScanGov's SSO configuration page to match. - -**Who can configure SSO in ScanGov?** -Any logged-in member of your organization with a paid plan can access the SSO configuration page. - -## Support - -If you run into any issues setting up SSO, contact us at support@scangov.com. diff --git a/public/assets/img/pages/website-rfp-og.png b/public/assets/img/pages/website-rfp-og.png index 576b134f..3283b49a 100644 Binary files a/public/assets/img/pages/website-rfp-og.png and b/public/assets/img/pages/website-rfp-og.png differ diff --git a/public/css/scangov.css b/public/css/scangov.css index 58e49ac4..ea6e3b9d 100644 --- a/public/css/scangov.css +++ b/public/css/scangov.css @@ -1,98 +1,1207 @@ /* This file is maintaned in https://github.com/ScanGov/components and copied to multiple projects during startup */ -/* Root */ +/* Fonts */ -:root, [data-bs-theme=dark], [data-bs-theme=light] { +@font-face { + font-family: "Public Sans ExtraBold"; + src: url("/assets/fonts/public-sans/ttf/PublicSans-ExtraBold.ttf") format("truetype"); +} + +@font-face { + font-family: "Public Sans Bold"; + src: url("/assets/fonts/public-sans/ttf/PublicSans-Bold.ttf") format("truetype"); +} + +@font-face { + font-family: "Public Sans Regular"; + src: url("/assets/fonts/public-sans/ttf/PublicSans-Regular.ttf") format("truetype"); +} + +@font-face { + font-family: "Public Sans Light"; + src: url("/assets/fonts/public-sans/ttf/PublicSans-Light.ttf") format("truetype"); +} + +@font-face { + font-family: "Public Sans Thin"; + src: url("/assets/fonts/public-sans/ttf/PublicSans-Thin.ttf") format("truetype"); +} + +@font-face { + font-family: "JetBrains Mono Medium"; + src: url("/assets/fonts/jetbrains-mono/JetBrainsMono-Medium.ttf") format("truetype"); +} + +@font-face { + font-family: "JetBrains Mono ExtraBold"; + src: url("/assets/fonts/jetbrains-mono/JetBrainsMono-ExtraBold.ttf") format("truetype"); +} + +/* Dark mode (default) */ + +:root, [data-bs-theme=dark] { + color-scheme: dark; + --bs-primary: #70e17b; + --bs-primary-rgb: 112, 225, 123; + --bs-primary-text: #13171f; --bs-body-color: #fff; --bs-body-color-rgb: 255, 255, 255; --bs-body-bg: #13171f; --bs-body-bg-rgb: 19, 23, 31; - --scangov-green: #70e17b; - --scangov-green-rgb: 112, 225, 123; - --bs-link-color: var(--scangov-green); - --bs-link-color-rgb: var(--scangov-green-rgb); - --bs-success-rgb: var(--scangov-green-rgb); + --bs-body-secondary-bg: #0f1218; + --bs-link-color: #70e17b; + --bs-link-color-rgb: 112, 225, 123; --bs-link-hover-color: var(--bs-link-color); --bs-link-hover-color-rgb: 112, 225, 123; - --bs-selection-bg: var(--bs-link-color); - --bs-selection-color: var(--bs-body-bg); + --bs-link-hover-decoration: none; + --bs-highlight-bg: var(--bs-primary); + --bs-highlight-color: var(--bs-primary-text); + --bs-selection-bg: var(--bs-primary); + --bs-selection-color: var(--bs-primary-text); + --bs-btn-primary: var(--bs-primary); + --bs-btn-primary-color: var(--bs-primary-text); + --bs-btn-primary-border-color: var(--bs-primary); + --bs-btn-primary-focus-shadow-rgb: 112, 225, 123; + --bs-btn-primary-active-shadow-rgb: 112, 225, 123; + --bs-btn-primary-active-color: var(--bs-primary-text); + --bs-btn-primary-active-bg: var(--bs-primary); + --bs-btn-primary-bg: var(--bs-primary); + --bs-btn-bg: var(--bs-primary); + --bs-btn-border-color: var(--bs-primary); + --bs-btn-color: var(--bs-primary-text); + --bs-btn-hover-bg: var(--bs-primary); + --bs-btn-hover-border-color: var(--bs-primary); + --bs-btn-hover-color: var(--bs-primary-text); + --bs-nav-link-color: var(--bs-body-color); + --bs-nav-link-hover-color: var(--bs-link-color); + --bs-border-color: #252f3e; + --bs-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1); + --bs-card-shadow: var(--bs-shadow); + --bs-box-shadow: var(--bs-shadow); + --bs-box-shadow-md: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.5); + --bs-secondary: var(--bs-body-color); + --bs-text-secondary: var(--bs-secondary); + --bs-badge-bg: var(--bs-primary); + --bs-badge-font-weight: 300; + --bs-border-radius-sm: .25rem; + /* WCAG 2.2 AA: #face00 on #13171f = 11.87:1 ✓ */ + --bs-text-bg-primary: #face00; + --bs-info-text-emphasis: var(--bs-body-color); + --bs-info-bg-subtle: var(--bs-body-secondary-bg); + --bs-info-border-subtle: var(--bs-border-color); + --bs-text-muted: var(--bs-body-color); --bs-font-monospace: "JetBrains Mono Medium", monospace; --bs-font-light: "Public Sans Light", sans-serif; --bs-font-bold: "Public Sans Bold", sans-serif; --bs-font-regular: "Public Sans Regular", sans-serif; - --bs-font-serif: "Merriweather Light", sans-serif; - --bs-font-thin: "Public Sans Thin", sans-serif; - --bs-font-extra-bold: "Public Sans ExtraBold", sans-serif; --bs-font-sans-serif: "Public Sans Regular", sans-serif; + --bs-text-opacity: .5; + --bs-emphasis-color: var(--bs-body-color); + --bs-form-control-color: var(--bs-body-color); + --bs-form-control-bg: var(--bs-body-bg); + --bs-form-control-border-color: var(--bs-border-color); + --bs-form-control-focus-border-color: var(--bs-primary); + --bs-form-control-focus-box-shadow: 0 0 0 0.25rem rgba(112, 225, 123, 0.25); + --bs-form-control-focus-color: var(--bs-body-color); + --bs-card-focus-box-shadow: 0 0 0 0.25rem rgba(112, 225, 123, 0.25); + /* Status colors */ + --bs-bg-success: #70e17b; + --bs-bg-success-rgb: 112, 225, 123; + --bs-border-success: #70e17b; + --bs-text-warning: #000000; + --bs-bg-warning: #face00; + --bs-bg-warning-rgb: 250, 206, 0; + --bs-border-warning: #face00; + --bs-text-danger: #ffffff; + --bs-bg-danger: #e41d3d; + --bs-bg-danger-rgb: 228, 29, 61; + --bs-border-danger: #e41d3d; +} + +/* Light mode */ + +[data-bs-theme=light] { + color-scheme: light; + --bs-primary: #70e17b; + --bs-primary-rgb: 112, 225, 123; + --bs-primary-text: #13171f; + --bs-body-color: #13171f; + --bs-body-color-rgb: 19, 23, 31; + --bs-body-bg: #ffffff; + --bs-body-bg-rgb: 255, 255, 255; + --bs-body-secondary-bg: #f4f6f9; + /* WCAG 2.2 AA: #2563eb on #fff = 4.66:1 ✓ */ + --bs-link-color: #2563eb; + --bs-link-color-rgb: 37, 99, 235; + --bs-link-hover-color: var(--bs-link-color); + --bs-link-hover-color-rgb: 37, 99, 235; + --bs-link-hover-decoration: none; + --bs-highlight-bg: var(--bs-primary); + --bs-highlight-color: var(--bs-primary-text); + --bs-selection-bg: var(--bs-primary); + --bs-selection-color: var(--bs-primary-text); + --bs-btn-primary: var(--bs-primary); + --bs-btn-primary-color: var(--bs-primary-text); + --bs-btn-primary-border-color: var(--bs-primary); + --bs-btn-primary-focus-shadow-rgb: 112, 225, 123; + --bs-btn-primary-active-shadow-rgb: 112, 225, 123; + --bs-btn-primary-active-color: var(--bs-primary-text); + --bs-btn-primary-active-bg: var(--bs-primary); + --bs-btn-primary-bg: var(--bs-primary); + --bs-btn-bg: var(--bs-primary); + --bs-btn-border-color: var(--bs-primary); + --bs-btn-color: var(--bs-primary-text); + --bs-btn-hover-bg: var(--bs-primary); + --bs-btn-hover-border-color: var(--bs-primary); + --bs-btn-hover-color: var(--bs-primary-text); + --bs-nav-link-color: var(--bs-body-color); + --bs-nav-link-hover-color: var(--bs-link-color); + --bs-border-color: #d5dce8; + --bs-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.06); + --bs-card-shadow: var(--bs-shadow); + --bs-box-shadow: var(--bs-shadow); + --bs-box-shadow-md: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.15); + --bs-secondary: var(--bs-body-color); + --bs-text-secondary: var(--bs-secondary); + --bs-badge-bg: var(--bs-primary); + --bs-badge-font-weight: 300; + --bs-border-radius-sm: .25rem; + /* WCAG 2.2 AA: #8a6500 on #fff = 5.33:1 ✓ */ + --bs-text-bg-primary: #8a6500; + --bs-info-text-emphasis: var(--bs-body-color); + --bs-info-bg-subtle: var(--bs-body-secondary-bg); + --bs-info-border-subtle: var(--bs-border-color); + /* WCAG 2.2 AA: #4a5568 on #fff = 7.53:1 ✓ */ + --bs-text-muted: #4a5568; + --bs-text-opacity: .5; + --bs-emphasis-color: var(--bs-body-color); + --bs-form-control-color: var(--bs-body-color); + --bs-form-control-bg: var(--bs-body-bg); + --bs-form-control-border-color: var(--bs-border-color); + --bs-form-control-focus-border-color: var(--bs-primary); + --bs-form-control-focus-box-shadow: 0 0 0 0.25rem rgba(112, 225, 123, 0.25); + --bs-form-control-focus-color: var(--bs-body-color); + --bs-card-focus-box-shadow: 0 0 0 0.25rem rgba(112, 225, 123, 0.25); + /* font vars, status colors inherited from :root */ +} + +/* Status badge overrides */ + +/* WCAG 2.2 AA: #13171f on #70e17b = 8.19:1 ✓ */ +.text-bg-success { + color: #13171f !important; + background-color: #70e17b !important; +} + +/* WCAG 2.2 AA: #000 on #face00 = 15.18:1 ✓ */ +.text-bg-warning { + color: #000000 !important; + background-color: #face00 !important; +} + +/* WCAG 2.2 AA: #fff on #e41d3d = 4.73:1 ✓ */ +.text-bg-danger { + color: #ffffff !important; + background-color: #e41d3d !important; +} + +.text-bg-primary { + background-color: var(--bs-text-bg-primary) !important; + color: var(--bs-body-bg) !important; +} + +/* Theme-dependent: logo/image invert */ + +:root body footer img, +:root body ul.navbar-nav img, +[data-bs-theme=dark] body footer img, +[data-bs-theme=dark] body ul.navbar-nav img { + filter: invert(1); +} + +[data-bs-theme=light] body footer img, +[data-bs-theme=light] body ul.navbar-nav img { + filter: none; +} + +/* Theme-dependent: navbar toggler icon */ + +[data-bs-theme="light"] .navbar-toggler-icon { + --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2819, 23, 31, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); +} + +[data-bs-theme="dark"] .navbar-toggler-icon { + --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); +} + +/* Theme-dependent: text-secondary */ + +.text-secondary { + color: rgba(19, 23, 31, var(--bs-text-opacity)) !important; +} + +[data-bs-theme=dark] .text-secondary { + color: rgba(255, 255, 255, var(--bs-text-opacity)) !important; +} + +/* General */ + +blockquote { + padding: 1rem 1rem .5rem 1rem; + margin: 1rem 0 1rem 1.5rem; + border-left: 0.25rem solid var(--bs-border-color); +} + +.text-muted { + color: var(--bs-body-color) !important; +} + +body { + color: var(--bs-body-color); + background-color: var(--bs-body-bg) !important; + font-family: var(--bs-font-sans-serif); + line-height: 1.5; +} + +strong { + font-family: var(--bs-font-bold); +} + +.navbar-brand, +h1, h2, h3, h4, h5, h6, +.h1, .h2, .h3, .h4, .h5, .h6, +.display-1, .display-2, .display-3, .display-4 { + font-family: var(--bs-font-bold); + letter-spacing: -.01rem; +} + +body.docs h2, +body.page h2, +body.docs h3, +body.page h3 { + margin-bottom: 1rem; + margin-top: 3rem; +} + +/* Lead */ + +.lead { + font-family: var(--bs-font-regular) !important; + font-size: 1.25rem; + font-weight: 300; + color: var(--bs-body-color); +} + +/* Selection */ + +::selection { + background-color: var(--bs-selection-bg); + color: var(--bs-selection-color); +} + +/* Accessibility */ + +/* Focus indicators (WCAG 2.4.7, 2.4.11) */ +:focus-visible { + outline: 3px solid var(--bs-link-color); + outline-offset: 2px; + border-radius: 2px; +} + +/* Remove outline on mouse/touch click, keep for keyboard (WCAG 2.4.7) */ +:focus:not(:focus-visible) { + outline: none; +} + +/* Minimum touch target size (WCAG 2.5.8) — exclude card children to avoid layout shift */ +a:not(.card):not(.card *):not(.stretched-link), +button:not(.card *) { + min-height: 24px; + min-width: 24px; +} + +/* Reduced motion (WCAG 2.3.3) */ +@media (prefers-reduced-motion: reduce) { + *, *::before, *::after { + animation-duration: 0.01ms !important; + animation-iteration-count: 1 !important; + transition-duration: 0.01ms !important; + scroll-behavior: auto !important; + } +} + +/* High contrast mode (WCAG 1.4.11) */ +@media (forced-colors: active) { + * { + forced-color-adjust: auto; + } +} + +/* Skip link — visible on focus for keyboard users (WCAG 2.4.1) */ +.skip-link { + position: absolute; + top: -100%; + left: 0; +} + +.skip-link:focus { + top: 0; +} + +/* Navbar */ + +#logo { + max-width: 35px; + width: 100%; + height: 100%; +} + +.navbar { + box-shadow: var(--bs-shadow); + transition: box-shadow 0.25s ease; + --bs-navbar-padding-y: 0.5rem; + --bs-navbar-padding-x: 0; + --bs-nav-link-padding-y: 0.5rem; + --bs-nav-link-padding-x: 1rem; + --bs-nav-link-font-size: 1.1em; +} + +.navbar-brand { + font-family: var(--bs-font-bold); + color: var(--bs-body-color) !important; +} + +.navbar-brand>svg { + fill: var(--bs-body-color) !important; +} + +.navbar-brand:hover { + color: var(--bs-link-color) !important; +} + +.navbar-brand:hover>svg { + fill: var(--bs-link-color) !important; +} + +.navbar-toggler-icon { + color: var(--bs-body-color) !important; +} + +.navbar-nav, +.navbar-nav .nav-link:not(.active), +a.list-group-item { + color: var(--bs-body-color) !important; + font-family: "Public Sans Regular", sans-serif !important; +} + +.nav-link { + font-family: "Public Sans Regular", sans-serif !important; +} + +.navbar-nav .nav-link:not(.active):hover, +a.list-group-item:hover { + color: var(--bs-link-color) !important; +} + +a.list-group-item:hover { + background-color: var(--bs-body-secondary-bg); +} + +.border-end { + box-shadow: var(--bs-shadow); +} + +/* Social links */ + +.social a, .social a:visited { + color: var(--bs-body-color); + display: inline-block; + margin-right: .75rem; +} + +.social a:hover { + color: var(--bs-link-color); +} + +/* External link icon (post content only) */ + +.post-content a[href^="http"]:not([href^="https://scangov.org"]):not([href^="https://standards.scangov.org"]):not([href^="https://scangov.com"]):not([href^="https://data.scangov.org"]):not([href^="http://localhost:4000/"]):not([href^="https://docs.scangov.org"])::after { + content: "\f35d"; + font-family: "Font Awesome 5 Free"; + font-weight: 900; + margin-left: 5px; + font-size: 0.8em; + display: inline-block; +} + +.social a[href^="http"]:not([href^="https://scangov.org"]):not([href^="https://scangov.com"]):not([href^="http://localhost:4000/"]):not([href^="https://docs.scangov.org"])::after { + display: none !important; +} + +/* Breadcrumb */ + +.breadcrumb-item a, .breadcrumb-item a:visited { + color: var(--bs-link-color); + font-family: var(--bs-font-bold); + text-decoration: none; +} + +/* Links / Buttons */ + +a:hover { + text-decoration: var(--bs-link-hover-decoration); + color: var(--bs-link-hover-color); +} + +a.btn-primary, a.btn-primary:visited, .btn-primary { + background-color: var(--bs-primary) !important; + color: var(--bs-primary-text) !important; + border-radius: var(--bs-border-radius); + border: 1px solid var(--bs-primary) !important; + box-shadow: var(--bs-shadow); + cursor: pointer; + font-family: var(--bs-font-bold); + padding: .55rem; + transition: filter 0.25s ease, box-shadow 0.25s ease; +} + +a.btn-primary-outline { + background-color: var(--bs-body-bg); + color: var(--bs-body-color); + border-radius: var(--bs-border-radius-sm); + border: 1px solid var(--bs-border-color); + box-shadow: var(--bs-shadow); + cursor: pointer; + font-family: var(--bs-font-sans-serif); + padding: .55rem; + transition: filter 0.25s ease, box-shadow 0.25s ease; +} + +a.btn-primary:hover, a.btn-primary:focus, +input[type="submit"].btn-primary:hover, input[type="submit"].btn-primary:focus { + filter: brightness(1.3); + box-shadow: var(--bs-box-shadow-md); + background-color: var(--bs-primary) !important; + color: var(--bs-primary-text) !important; + border: 1px solid var(--bs-primary) !important; +} + +a.btn-primary-outline:not(.active):hover, .btn-primary-outline:not(.active):hover, +a.btn-primary-outline:not(.active):focus { + filter: brightness(1.3); + box-shadow: var(--bs-box-shadow-md); + border: 1px solid var(--bs-border-color); +} + +.feedback { + opacity: 0; + pointer-events: none; + visibility: hidden; + background-color: var(--bs-primary); + color: var(--bs-primary-text) !important; + border-radius: var(--bs-border-radius); + border: 1px solid var(--bs-primary); + box-shadow: var(--bs-shadow); + cursor: pointer; + font-family: var(--bs-font-bold); + padding: .55rem; + position: fixed; + bottom: 2rem; + right: 2rem; + z-index: 1000; + text-decoration: none; + transition: opacity 0.25s ease, visibility 0.25s ease, filter 0.25s ease, box-shadow 0.25s ease; +} + +.feedback.is-visible { + opacity: 1; + pointer-events: auto; + visibility: visible; +} + +.feedback svg, a.btn svg { + transition: filter 0.25s ease; +} + +.feedback:hover, .feedback:focus, +a.btn:hover, a.btn:focus, +.btn-primary:hover, .btn-primary:focus { + filter: brightness(1.3); + box-shadow: var(--bs-box-shadow-md); + background-color: var(--bs-primary) !important; + color: var(--bs-primary-text) !important; + border-color: var(--bs-primary) !important; +} + +/* js-triggered Bootstrap classes */ +.btn-check:checked+.btn, +.btn.active:not(.nav-link), +.btn.show, +.btn:first-child:active, +:not(.btn-check)+.btn:active { + color: var(--bs-btn-active-color); + background-color: var(--bs-btn-active-bg); + border-color: var(--bs-btn-active-border-color); +} + +/* Nav pills */ + +.nav-pills { + --bs-nav-pills-link-active-bg: var(--bs-primary); + --bs-nav-link-hover-border-color: #1a2130; +} + +[data-bs-theme=light] .nav-pills { + --bs-nav-link-hover-border-color: #b0bac8; +} + +.nav-pills .nav-link svg { + flex-shrink: 0; + width: 1em; + height: 1em; +} + +.nav-pills .nav-link { + border: 1px solid var(--bs-border-color); + box-shadow: var(--bs-shadow); + font-family: "Public Sans Regular", sans-serif !important; + color: var(--bs-body-color); + background-color: var(--bs-body-bg); + transition: filter 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; + padding-top: 0.25rem; + padding-bottom: 0.25rem; + margin-top: 0.35rem; + margin-bottom: 0.35rem; + display: inline-flex !important; + align-items: center; + width: auto; + flex-shrink: 0; +} + +.nav-pills .nav-link:not(.active):hover, +.nav-pills a.btn-primary-outline:not(.active):hover { + filter: brightness(1.3); + box-shadow: var(--bs-box-shadow-md); + border: 1px solid var(--bs-nav-link-hover-border-color); +} + +/* Nav pills active — #13171f on #70e17b = 8.19:1 ✓ (both themes) */ +.nav-pills .nav-link.active, +.nav-pills .nav-link.active:focus, +.nav-pills a.btn-primary-outline.active, +.nav-pills a.btn-primary-outline.active:focus, +[data-bs-theme=light] .nav-pills .nav-link.active, +[data-bs-theme=light] .nav-pills .nav-link.active:focus, +[data-bs-theme=light] .nav-pills a.btn-primary-outline.active, +[data-bs-theme=light] .nav-pills a.btn-primary-outline.active:focus { + background-color: #70e17b !important; + color: #13171f !important; + border-color: #70e17b !important; + box-shadow: var(--bs-shadow); +} + +.nav-pills .nav-link.active:hover, +.nav-pills a.btn-primary-outline.active:hover, +[data-bs-theme=light] .nav-pills .nav-link.active:hover, +[data-bs-theme=light] .nav-pills a.btn-primary-outline.active:hover { + background-color: #70e17b !important; + color: #13171f !important; + border-color: #70e17b !important; + filter: brightness(1.3); + box-shadow: var(--bs-box-shadow-md); +} + +.nav-pills .nav-link.active i, +.nav-pills .nav-link.active svg, +.nav-pills a.btn-primary-outline.active i, +.nav-pills a.btn-primary-outline.active svg, +[data-bs-theme=light] .nav-pills .nav-link.active i, +[data-bs-theme=light] .nav-pills .nav-link.active svg, +[data-bs-theme=light] .nav-pills a.btn-primary-outline.active i, +[data-bs-theme=light] .nav-pills a.btn-primary-outline.active svg { + color: #13171f !important; +} + +.nav-pills .active { + --bs-link-color: var(--bs-body-bg); +} + +/* Pagination */ + +.active>.page-link, .page-link.active { + z-index: 3; + color: var(--bs-pagination-active-color); + background-color: var(--bs-pagination-active-bg); + border-color: var(--bs-pagination-active-border-color); +} + +/* Dropdown */ + +.dropdown-toggle::after { + display: none; +} + +.dropdown-toggle svg { + color: var(--bs-btn-color) !important; + transition: 0.15s color; +} + +.dropdown-toggle:hover svg, +.dropdown-toggle:focus svg { + color: var(--bs-btn-hover-color) !important; +} + +.dropdown-menu.show { + display: block; +} + +/* Badge */ + +.badge { + font-family: "Public Sans Regular", sans-serif !important; + padding: .55rem !important; + font-size: .8rem !important; + font-weight: 300; + border-radius: var(--bs-border-radius-sm) !important; +} + +.badge-primary:hover { + background-color: #fee685 !important; + /* WCAG 2.2 AA: #13171f on #fee685 = 14.42:1 ✓ */ + color: #13171f !important; +} + +/* Cards */ + +.card { + border: 1px solid var(--bs-border-color); + box-shadow: var(--bs-shadow); + width: 100%; + transition: filter 0.25s ease, box-shadow 0.25s ease; +} + +.card:focus, +.card:focus-within { + box-shadow: var(--bs-card-focus-box-shadow); +} + +a.card { + text-decoration: none; +} + +.card:not(.text-bg-success):not(.text-bg-warning):not(.text-bg-danger):hover { + filter: brightness(1.3); + box-shadow: var(--bs-box-shadow-md); +} + +.card-header>a, +.card-header>a>svg { + color: inherit !important; +} + +.card-hover { + transition: filter 0.25s ease, box-shadow 0.25s ease; +} + +.card-hover:hover { + filter: brightness(1.3); + box-shadow: var(--bs-box-shadow-md); +} + +/* Status cards — consistent across themes */ + +.text-bg-success.card { + border-color: #70e17b !important; +} + +.text-bg-warning.card { + border-color: #face00 !important; +} + +.text-bg-danger.card { + border-color: #e41d3d !important; +} + +.text-bg-success.card:hover, +.text-bg-warning.card:hover, +.text-bg-danger.card:hover { + filter: brightness(1.3); + box-shadow: var(--bs-box-shadow-md); +} + +/* Icons and links inside status cards match card text color */ +.card.text-bg-success i, .card.text-bg-success svg, +.card.text-bg-success a, .card.text-bg-success a:visited, .card.text-bg-success a:hover, +.card.text-bg-warning i, .card.text-bg-warning svg, +.card.text-bg-warning a, .card.text-bg-warning a:visited, .card.text-bg-warning a:hover { + color: #13171f !important; + fill: #13171f !important; +} + +.card.text-bg-danger i, .card.text-bg-danger svg, +.card.text-bg-danger a, .card.text-bg-danger a:visited, .card.text-bg-danger a:hover { + color: #ffffff !important; + fill: #ffffff !important; +} + +.text-bg-success .card-header, +.text-bg-warning .card-header, +.text-bg-danger .card-header { + background-color: rgba(255, 255, 255, 0.15) !important; + border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important; + padding: 0.75rem 1rem; + font-family: var(--bs-font-regular); + --bs-card-cap-bg: rgba(255, 255, 255, 0.15); +} + +.text-bg-success .card-body, +.text-bg-warning .card-body, +.text-bg-danger .card-body { + padding: 1rem; +} + +/* Forms */ + +.form-control { + color: var(--bs-body-color) !important; + border: 1px solid var(--bs-border-color); + box-shadow: var(--bs-shadow); + transition: filter 0.25s ease, box-shadow 0.25s ease; +} + +.form-control:hover { + filter: brightness(1.05); + box-shadow: var(--bs-box-shadow-md); +} + +.form-control:focus { + border-color: var(--bs-primary); + box-shadow: var(--bs-form-control-focus-box-shadow); + filter: none; +} + +::placeholder, ::-ms-input-placeholder { + color: var(--bs-body-color); + opacity: var(--bs-text-opacity); +} + +input[type="submit"] { + min-width: 80px; +} + +/* SVG */ + +svg { + display: inline-block; + height: 1em; + overflow: visible; + vertical-align: -.125em; + margin: 0 .3rem; + flex-shrink: 0; + width: 1em; +} + +svg.sizeicon-xl { + height: 1.5em; + max-width: 1.5em; + line-height: .04167em; +} + +table td svg { + margin: 0; +} + +/* FA size classes override the default 1em height */ +.fa-2xs svg { + height: 0.625em; +} + +.fa-xs svg { + height: 0.75em; +} + +.fa-sm svg { + height: 0.875em; +} + +.fa-lg svg { + height: 1.25em; +} + +.fa-xl svg { + height: 1.5em; +} + +.fa-2xl svg { + height: 2em; +} + +.fa-2x svg { + height: 2em; +} + +.fa-3x svg { + height: 3em; +} + +.fa-4x svg { + height: 4em; +} + +.fa-5x svg { + height: 5em; +} + +.fa-6x svg { + height: 6em; +} + +.fa-7x svg { + height: 7em; +} + +.fa-8x svg { + height: 8em; +} + +.fa-9x svg { + height: 9em; +} + +.fa-10x svg { + height: 10em; +} + +svg.fa-circle-check { + fill: var(--bs-success); +} + +svg.fa-circle-xmark { + fill: var(--bs-danger); +} + +svg.fa-circle-exclamation { + fill: var(--bs-warning); +} + +svg.fa-circle-right { + fill: var(--bs-info); +} + +/* Images */ + +main#home img { + display: block; + margin: auto; + margin-bottom: 0.5rem; +} + +/* Accessibility utilities */ + +.fa-sr-only, .fa-sr-only-focusable:not(:focus), .sr-only, .sr-only-focusable:not(:focus) { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: nowrap; + border-width: 0; +} + +.d-none { + display: none; +} + +.biggest { + width: 50%; +} + +/* Timeline */ + +.timeline { + border-left: 1px solid hsl(0, 0%, 90%); + position: relative; + list-style: none; +} + +.timeline .timeline-item { + position: relative; +} + +.timeline .timeline-item:after { + position: absolute; + display: block; + top: 0; + background-color: hsl(0, 0%, 90%); + left: -38px; + border-radius: 50%; + height: 11px; + width: 11px; + content: ''; +} + +.timeline-domain { + margin-bottom: 0.25rem; +} + +.timeline-date { + font-family: var(--bs-font-bold); +} + +/* Anchor links */ + +h2 a#heading-hashtag, +h3 a#heading-hashtag { + display: none; +} + +h2:hover a#heading-hashtag, +h3:hover a#heading-hashtag { + display: revert; +} + +/* iframe */ + +iframe { + border: 1px solid var(--bs-border-color) !important; +} + +/* News posts */ + +.post-content h2 { + margin-top: 2.75rem; +} + +.post-content ul, .post-content p { + margin-bottom: 1.75rem; +} + +/* Autocomplete search */ + +.awesomplete [hidden] { + display: none; +} + +.awesomplete .visually-hidden { + position: absolute; + clip: rect(0, 0, 0, 0); +} + +.awesomplete { + display: block; + position: relative; +} + +.awesomplete>input { + display: block; +} + +.awesomplete>ul { + position: absolute; + left: 0; + z-index: 1; + min-width: 100%; + box-sizing: border-box; + list-style: none; + padding: 0; + margin: 0.2em 0 0; + color: var(--bs-body-color); + background-color: var(--bs-body-bg); + border: var(--bs-border-width) solid var(--bs-border-color); + border-radius: var(--bs-border-radius); + box-shadow: 0.05em 0.2em 0.6em rgba(0, 0, 0, 0.2); + text-shadow: none; +} + +.awesomplete>ul:empty { + display: none; +} + +@supports (transform: scale(0)) { + .awesomplete>ul { + transition: 0.3s cubic-bezier(0.4, 0.2, 0.5, 1.4); + } + + .awesomplete>ul[hidden], + .awesomplete>ul:empty { + opacity: 0; + transform: scale(0); + display: block; + visibility: hidden; + transition-timing-function: ease; + } +} + +.awesomplete>ul>li { + position: relative; + padding: 0.7em 1em; + cursor: pointer; +} + +.awesomplete>ul>li:hover { + background: hsl(200, 40%, 80%); + color: black; +} + +.awesomplete>ul>li[aria-selected='true'] { + background: hsl(205, 40%, 40%); + color: white; +} + +.awesomplete mark { + background: hsl(65, 100%, 50%); +} + +.awesomplete li:hover mark { + background: hsl(68, 100%, 41%); +} + +.awesomplete li[aria-selected='true'] mark { + background: hsl(86, 100%, 21%); + color: inherit; +} + +/* File types */ + +a[href$=".doc"]::after, +a[href$=".docx"]::after, +a[href$=".ppt"]::after, +a[href$=".pptx"]::after, +a[href$=".xls"]::after, +a[href$=".xlsx"]::after, +a[href$=".pdf"]::after, +a[href$=".mp3"]::after, +a[href$=".mp4"]::after, +a[href$=".avi"]::after, +a[href$=".mpg"]::after, +a[href$=".mpeg"]::after, +a[href$=".mov"]::after, +a[href$=".wmv"]::after, +a[href$=".mkv"]::after, +a[href$=".jpg"]::after, +a[href$=".jpeg"]::after, +a[href$=".png"]::after, +a[href$=".gif"]::after { + content: ""; + display: inline-block; + width: 1em; + height: 1em; + margin-left: 0.5rem; + background-size: contain; + background-repeat: no-repeat; +} + +a[href$=".doc"]::after, +a[href$=".docx"]::after { + background-image: url(/assets/font-awesome/svgs/solid/file-word.svg); +} + +a[href$=".ppt"]::after, +a[href$=".pptx"]::after { + background-image: url(/assets/font-awesome/svgs/solid/file-powerpoint.svg); +} + +a[href$=".xls"]::after, +a[href$=".xlsx"]::after { + background-image: url(/assets/font-awesome/svgs/solid/file-excel.svg); +} + +a[href$=".pdf"]::after { + background-image: url(/assets/font-awesome/svgs/solid/file-pdf.svg); +} + +a[href$=".mp3"]::after { + background-image: url(/assets/font-awesome/svgs/solid/file-audio.svg); +} + +a[href$=".mp4"]::after { + background-image: url(/assets/font-awesome/svgs/solid/file-video.svg); +} + +.fa-bluesky { + color: #96abee !important; +} + +.fa-mastodon { + color: #f8b9c5 !important; +} + +.fa-book-open-reader { + color: #c3ebfa !important; +} + +.fa-check { + color: #e7f434 !important; } -/* General */ +.fa-circle-exclamation { + color: #f8b9c5 !important; +} -body { - color: var(--bs-body-color); - background: var(--bs-body-bg); - background-color: var(--bs-body-bg); - font-family: var(--bs-font-sans-serif); +.fa-circle-plus { + color: #70e17b !important; } -strong { - font-family: var(--bs-font-bold); +.fa-circle-dot { + color: #f3bf90 !important; } -h1, -h2, -h3, -h4, -h5, -h6, -.h1, -.h2, -.h3, -.h4, -.h5, -.h6, -.display-1, -.display-2, -.display-3, -.display-4 { - font-family: var(--bs-font-bold); +.fa-circle-down { + color: #e41d3d !important; } -.text-bg-success { - color: #000 !important; +.fa-circle-up { + color: #21c834 !important; } -/* Selection */ +.fa-comments { + color: #c5c5f3 !important; +} -::selection { - background-color: var(--bs-selection-bg); - color: var(--bs-selection-color); +.fa-dolly { + color: #f5fbc1 !important; } -/* Navbar */ +.fa-file-contract { + color: #fee685 !important; +} -#logo { - max-width: 35px; - width: 100%; - height: 100%; +.fa-file-pdf { + color: #f8b9c5 !important; } -/* Breadcrumb */ +.fa-filter-circle-xmark { + color: #f8b9c5 !important; +} -.breadcrumb-item a, .breadcrumb-item a:visited { - color: var(--bs-link-color); - font-family: var(--bs-font-bold); - text-decoration: none; +.fa-fire { + color: #ffbc78 !important; } -/* Icons */ +.fa-highlighter { + color: #e7f434 !important; +} -/* Brands */ +.fa-plug-circle-bolt { + color: #fff5c2 !important; +} -.fa-bluesky { - color: #96abee !important; +.fa-puzzle-piece { + color: #98d035 !important; +} + +.fa-rotate { + color: #c5ee93 !important; +} + +.fa-share-from-square { + color: #f8b9c5 !important; } +/* Icons — dark mode (vibrant pastels on dark bg) */ + .fa-github { color: #96abee !important; } @@ -105,20 +1214,22 @@ h6, color: #c3ebfa !important; } -.fa-mastodon { - color: #f8b9c5 !important; -} - .fa-youtube { color: #fd8ba0 !important; } -/* General */ - -.fa-rotate, .fa-arrows-rotate { +.fa-arrows-rotate { color: #c5ee93 !important; } +.fa-arrow-right-to-bracket { + color: #70e17b !important; +} + +.fa-bars-progress { + color: #ffbc78; +} + .fa-bell { color: #29e1cb !important; } @@ -131,10 +1242,6 @@ h6, color: #face00 !important; } -.fa-book-open-reader { - color: #c3ebfa !important; -} - .fa-brain { color: #fdb8ae !important; } @@ -155,55 +1262,29 @@ h6, color: #ffbe2e !important; } -.fa-check { - color: #e7f434 !important; -} - .fa-check-to-slot { color: #ffb4cf !important; } -.fa-circle { - color: #97d4ea !important; -} - .fa-circle-check { color: #70e17b !important; } -.fa-circle-exclamation { - color: #f8b9c5 !important; -} - -.fa-circle-plus { - color: #70e17b !important; -} - -.fa-circle-dot { - color: #f3bf90 !important; -} - -.fa-circle-down { - color: #e41d3d !important; -} - .fa-circle-nodes { color: #c3ebfa; } -.fa-circle-up { - color: #21c834 !important; +.fa-circle-notch { + color: #e6e6e6 !important; } -/* -.fa-circle-info { - color: #b8d293 !important; +.fa-circle-question { + color: #97d4ea; } -.fa-circle-question { - color: #97d4ea !important; +.fa-circle-info { + color: #b8d293 !important; } -*/ .fa-code { color: #bbc8f5 !important; @@ -213,10 +1294,6 @@ h6, color: #c5c5f3 !important; } -.fa-comments { - color: #c5c5f3 !important; -} - .fa-crown { color: #ffe396 !important; } @@ -229,10 +1306,6 @@ h6, color: #7efbe1 !important; } -.fa-dolly { - color: #f5fbc1 !important; -} - .fa-envelope-open-text { color: #7efbe1 !important; } @@ -253,26 +1326,10 @@ h6, color: #a8f2ff; } -.fa-file-contract { - color: #fee685; -} - -.fa-file-pdf { - color: #F8B9C5; -} - .fa-filter { color: #cbc4f2; } -.fa-filter-circle-xmark { - color: #f8b9c5; -} - -.fa-fire { - color: #ffbc78 !important; -} - .fa-flag { color: #f45d79; } @@ -293,7 +1350,11 @@ h6, color: #c7efe2; } -.fa-hand, .fa-hands, .fa-hands-clapping, .fa-handshake-simple, .fa-handshake-angle, .fa-hand-peace, .fa-hand-pointer, .fa-hand-point-up, .fa-hand-point-down, .fa-hand-point-right, .fa-hand-point-left { +.fa-hand, .fa-hands, .fa-hands-clapping, +.fa-handshake-simple, .fa-handshake-angle, +.fa-hand-peace, .fa-hand-pointer, +.fa-hand-point-up, .fa-hand-point-down, +.fa-hand-point-right, .fa-hand-point-left { color: #face00; } @@ -305,14 +1366,14 @@ h6, color: #ff8d7b; } -.fa-highlighter { - color: #e7f434; -} - .fa-house { color: #f4b2ff; } +.fa-key { + color: #f8b9c5; +} + .fa-laptop { color: #9bd4cf; } @@ -325,10 +1386,6 @@ h6, color: #ffe396; } -.fa-key { - color: #f8b9c5; -} - .fa-link { color: #7efbe1; } @@ -357,14 +1414,6 @@ h6, color: #a8f2ff; } -.fa-plug-circle-bolt { - color: #fff5c2; -} - -.fa-puzzle-piece { - color: #98D035; -} - .fa-ranking-star { color: #83fcd4; } @@ -378,7 +1427,7 @@ h6, } .fa-robot { - color: #e7f434; + color: #e6e6e6; } .fa-rocket { @@ -393,14 +1442,14 @@ h6, color: #c3ebfa !important; } -.fa-scroll { - color: #fee685 !important; -} - .fa-scale-balanced { color: #e6c74c; } +.fa-scroll { + color: #fee685 !important; +} + .fa-seedling { color: #c5ee93; } @@ -409,22 +1458,12 @@ h6, color: #fbbaa7; } -.fa-share-from-square { - color: #f8b9c5; -} - .fa-share-nodes { color: #ffb4cf; } -/* -.fa-sort { - color: #fff; -} -*/ - .fa-spray-can-sparkles { - color: #f8b9c5; + color: #d0b4f5; } .fa-square-check { @@ -436,7 +1475,7 @@ h6, } .fa-table { - color: #f8b9c5; + color: #7efbe1; } .fa-timeline { @@ -452,7 +1491,7 @@ h6, } .fa-user-group { - color: #f8b9c5; + color: #96abee; } .fa-user-shield { @@ -460,160 +1499,342 @@ h6, } .fa-wand-magic-sparkles { - color: #f8b9c5; + color: #ffe396; } .fa-window-maximize { color: #ffcdd5; } -/* Buttons */ +/* Icons — light mode overrides (WCAG 2.2 AA compliant, min 4.5:1 on #fff) */ + +[data-bs-theme=light] .fa-arrow-right-to-bracket, +[data-bs-theme=light] .fa-arrows-rotate, +[data-bs-theme=light] .fa-building, +[data-bs-theme=light] .fa-circle-check, +[data-bs-theme=light] .fa-circle-info, +[data-bs-theme=light] .fa-circle-plus, +[data-bs-theme=light] .fa-puzzle-piece, +[data-bs-theme=light] .fa-rotate, +[data-bs-theme=light] .fa-seedling { + /* → #2d7a3a = 5.31:1 ✓ */ + color: #2d7a3a !important; +} + +[data-bs-theme=light] .fa-bell, +[data-bs-theme=light] .fa-diagram-project, +[data-bs-theme=light] .fa-envelope-open-text, +[data-bs-theme=light] .fa-graduation-cap, +[data-bs-theme=light] .fa-link, +[data-bs-theme=light] .fa-ranking-star, +[data-bs-theme=light] .fa-table { + /* → #0d7a6e = 5.22:1 ✓ */ + color: #0d7a6e !important; +} + +[data-bs-theme=light] .fa-bell-concierge, +[data-bs-theme=light] .fa-brain, +[data-bs-theme=light] .fa-map, +[data-bs-theme=light] .fa-server { + /* → #8a5e2d = 5.65:1 ✓ */ + color: #8a5e2d !important; +} + +[data-bs-theme=light] .fa-bolt, +[data-bs-theme=light] .fa-certificate, +[data-bs-theme=light] .fa-check, +[data-bs-theme=light] .fa-crown, +[data-bs-theme=light] .fa-dolly, +[data-bs-theme=light] .fa-face-smile, +[data-bs-theme=light] .fa-file-contract, +[data-bs-theme=light] .fa-hand, [data-bs-theme=light] .fa-hands, +[data-bs-theme=light] .fa-hands-clapping, +[data-bs-theme=light] .fa-handshake-simple, +[data-bs-theme=light] .fa-handshake-angle, +[data-bs-theme=light] .fa-hand-peace, +[data-bs-theme=light] .fa-hand-pointer, +[data-bs-theme=light] .fa-hand-point-up, +[data-bs-theme=light] .fa-hand-point-down, +[data-bs-theme=light] .fa-hand-point-right, +[data-bs-theme=light] .fa-hand-point-left, +[data-bs-theme=light] .fa-highlighter, +[data-bs-theme=light] .fa-lightbulb, +[data-bs-theme=light] .fa-magnifying-glass, +[data-bs-theme=light] .fa-plug-circle-bolt, +[data-bs-theme=light] .fa-scale-balanced, +[data-bs-theme=light] .fa-scroll, +[data-bs-theme=light] .fa-star, +[data-bs-theme=light] .fa-wand-magic-sparkles { + /* → #8a6500 = 5.33:1 ✓ */ + color: #8a6500 !important; +} + +[data-bs-theme=light] .fa-bars-progress, +[data-bs-theme=light] .fa-dashboard, +[data-bs-theme=light] .fa-fire, +[data-bs-theme=light] .fa-gauge-simple, +[data-bs-theme=light] .fa-gauge-high, +[data-bs-theme=light] .fa-rss { + /* → #8a4f00 = 6.56:1 ✓ */ + color: #8a4f00 !important; +} + +[data-bs-theme=light] .fa-book-open-reader, +[data-bs-theme=light] .fa-circle-nodes, +[data-bs-theme=light] .fa-file, +[data-bs-theme=light] .fa-file-lines, +[data-bs-theme=light] .fa-linkedin, +[data-bs-theme=light] .fa-paper-plane, +[data-bs-theme=light] .fa-percent, +[data-bs-theme=light] .fa-satellite-dish, +[data-bs-theme=light] .fa-square-check, +[data-bs-theme=light] .fa-universal-access { + /* → #1a6fa0 = 5.49:1 ✓ */ + color: #1a6fa0 !important; +} + +[data-bs-theme=light] .fa-bluesky, +[data-bs-theme=light] .fa-code, +[data-bs-theme=light] .fa-bullhorn, +[data-bs-theme=light] .fa-github, +[data-bs-theme=light] .fa-user-group { + /* → #4a6bb5 = 5.17:1 ✓ */ + color: #4a6bb5 !important; +} + +[data-bs-theme=light] .fa-comment, +[data-bs-theme=light] .fa-comments, +[data-bs-theme=light] .fa-filter, +[data-bs-theme=light] .fa-rocket { + /* → #5b4ea0 = 6.90:1 ✓ */ + color: #5b4ea0 !important; +} + +[data-bs-theme=light] .fa-circle-notch, +[data-bs-theme=light] .fa-robot { + /* → #5a5a5a = 6.90:1 ✓ */ + color: #5a5a5a !important; +} + +[data-bs-theme=light] .fa-circle-question { + /* → #1a6fa0 = 5.49:1 ✓ */ + color: #1a6fa0; +} + +[data-bs-theme=light] .fa-discord, +[data-bs-theme=light] .fa-calendar, +[data-bs-theme=light] .fa-circle-exclamation, +[data-bs-theme=light] .fa-eye, +[data-bs-theme=light] .fa-file-pdf, +[data-bs-theme=light] .fa-filter-circle-xmark, +[data-bs-theme=light] .fa-key, +[data-bs-theme=light] .fa-mastodon, +[data-bs-theme=light] .fa-newspaper, +[data-bs-theme=light] .fa-rectangle-list, +[data-bs-theme=light] .fa-share-from-square, +[data-bs-theme=light] .fa-user-astronaut { + /* → #b5476a = 5.15:1 ✓ */ + color: #b5476a !important; +} + +[data-bs-theme=light] .fa-circle-down, +[data-bs-theme=light] .fa-flag { + /* → #b52040 = 6.47:1 ✓ */ + color: #b52040 !important; +} + +[data-bs-theme=light] .fa-circle-up { + /* → #1a7a2a = 5.10:1 ✓ */ + color: #1a7a2a !important; +} + +[data-bs-theme=light] .fa-circle-dot, +[data-bs-theme=light] .fa-gear { + /* → #1a5e9e = 6.69:1 ✓ */ + color: #1a5e9e !important; +} + +[data-bs-theme=light] .fa-heart, +[data-bs-theme=light] .fa-heart-crack, +[data-bs-theme=light] .fa-lock, +[data-bs-theme=light] .fa-right-from-bracket { + /* → #c0392b = 5.44:1 ✓ */ + color: #c0392b !important; +} + +[data-bs-theme=light] .fa-house { + /* → #7a2ea0 = 7.70:1 ✓ */ + color: #7a2ea0 !important; +} + +[data-bs-theme=light] .fa-laptop { + /* → #1a6e6a = 6.03:1 ✓ */ + color: #1a6e6a !important; +} + +[data-bs-theme=light] .fa-landmark { + /* → #3a3a3a = 11.37:1 ✓ */ + color: #3a3a3a !important; +} -.btn-primary, -a.btn-primary, -a.btn-primary:visited { - background-color: var(--bs-link-color); - color: var(--bs-body-bg); - border-radius: var(--bs-border-radius); - border: 1px solid var(--bs-border-color); - box-shadow: var(--bs-card-shadow); - cursor: pointer; - font-family: var(--bs-font-bold); - padding: 0.55rem; +[data-bs-theme=light] .fa-share-nodes, +[data-bs-theme=light] .fa-check-to-slot, +[data-bs-theme=light] .fa-timeline { + /* → #9e2060 = 7.42:1 ✓ */ + color: #9e2060 !important; +} + +[data-bs-theme=light] .fa-spray-can-sparkles { + /* → #6b3fa0 = 7.38:1 ✓ */ + color: #6b3fa0 !important; } -a.btn-primary-outline { - background-color: var(--bs-body-bg); - color: var(--bs-body-color); - border-radius: var(--bs-border-radius-sm); - border: 1px solid var(--bs-border-color); - box-shadow: var(--bs-card-shadow); - cursor: pointer; - font-family: var(--bs-font-sans-serif); - padding: 0.55rem; +[data-bs-theme=light] .fa-user-shield { + /* → #8a4e00 = 6.62:1 ✓ */ + color: #8a4e00 !important; } -.btn-primary-outline:not(.active):hover, -a.btn-primary-outline:not(.active):hover { - background-color: var(--bs-btn-bg) !important; - color: var(--bs-body-bg); - border: 1px solid var(--bs-border-color); - box-shadow: var(--bs-box-shadow-md) !important +[data-bs-theme=light] .fa-window-maximize { + /* → #a03050 = 6.92:1 ✓ */ + color: #a03050 !important; } -a.btn:not(.active):hover svg, .nav-link:not(.active):hover svg { - color: var(--bs-link-color) !important; +[data-bs-theme=light] .fa-youtube { + /* → #c0392b = 5.44:1 ✓ */ + color: #c0392b !important; } -/* Cards */ - -.card-hover { - transition: 0.5s filter; +/* Status card icons — must come last to beat FA light mode overrides */ +[data-bs-theme=light] .card.text-bg-success, +[data-bs-theme=light] .card.text-bg-success a, +[data-bs-theme=light] .card.text-bg-success a:link, +[data-bs-theme=light] .card.text-bg-success a:visited, +[data-bs-theme=light] .card.text-bg-success a:hover, +[data-bs-theme=light] .card.text-bg-success a:focus, +[data-bs-theme=light] .card.text-bg-success i, +[data-bs-theme=light] .card.text-bg-success svg, +[data-bs-theme=light] .card.text-bg-success a i, +[data-bs-theme=light] .card.text-bg-success a svg, +[data-bs-theme=light] .card.text-bg-warning, +[data-bs-theme=light] .card.text-bg-warning a, +[data-bs-theme=light] .card.text-bg-warning a:link, +[data-bs-theme=light] .card.text-bg-warning a:visited, +[data-bs-theme=light] .card.text-bg-warning a:hover, +[data-bs-theme=light] .card.text-bg-warning a:focus, +[data-bs-theme=light] .card.text-bg-warning i, +[data-bs-theme=light] .card.text-bg-warning svg, +[data-bs-theme=light] .card.text-bg-warning a i, +[data-bs-theme=light] .card.text-bg-warning a svg { + color: #13171f !important; + fill: #13171f !important; } -.card-hover:hover { - filter: brightness(1.3); +[data-bs-theme=light] .card.text-bg-danger, +[data-bs-theme=light] .card.text-bg-danger a, +[data-bs-theme=light] .card.text-bg-danger a:link, +[data-bs-theme=light] .card.text-bg-danger a:visited, +[data-bs-theme=light] .card.text-bg-danger a:hover, +[data-bs-theme=light] .card.text-bg-danger a:focus, +[data-bs-theme=light] .card.text-bg-danger i, +[data-bs-theme=light] .card.text-bg-danger svg, +[data-bs-theme=light] .card.text-bg-danger a i, +[data-bs-theme=light] .card.text-bg-danger a svg { + color: #ffffff !important; + fill: #ffffff !important; +} + +/* text-bg-dark card icons match white text */ +.card.text-bg-dark a, +.card.text-bg-dark a:link, +.card.text-bg-dark a:visited, +.card.text-bg-dark a:hover, +.card.text-bg-dark a:focus, +.card.text-bg-dark i, +.card.text-bg-dark svg, +.card.text-bg-dark a i, +.card.text-bg-dark a svg { + color: #ffffff !important; + fill: #ffffff !important; } -/* iframe */ - -iframe { - border: 1px solid var(--bs-border-color) !important; +/* Question mark help icons inherit text color via href targeting */ +a[href*="docs.scangov.org"] svg, +a[href*="docs.scangov.org"] i { + color: inherit !important; + fill: currentColor !important; } -/* Forms */ +/* Font Awesome size utilities */ +.fa-2xs { + font-size: 0.625em; +} -.form-control:focus { - border-color: var(--bs-link-color); +.fa-xs { + font-size: 0.75em; } -/* Anchor links */ +.fa-sm { + font-size: 0.875em; +} -h2 a#heading-hashtag, -h3 a#heading-hashtag { - display: none; +.fa-lg { + font-size: 1.25em; } -h2:hover a#heading-hashtag, -h3:hover a#heading-hashtag { - display: revert; +.fa-xl { + font-size: 1.5em; } -/* Bootstrap */ +.fa-2xl { + font-size: 2em; +} -.badge { - border-radius: .25rem; - font-family: 'Public Sans Light', sans-serif !important; +.fa-1x { + font-size: 1em; } -/* News posts */ +.fa-2x { + font-size: 2em; +} -.post-content h2 { - margin-top: 2.75rem; +.fa-3x { + font-size: 3em; } -.post-content ul, .post-content p { - margin-bottom: 1.75rem; +.fa-4x { + font-size: 4em; } -/* File types */ -a[href$=".doc"]::after, -a[href$=".docx"]::after, -a[href$=".ppt"]::after, -a[href$=".pptx"]::after, -a[href$=".xls"]::after, -a[href$=".xlsx"]::after, -a[href$=".pdf"]::after, -a[href$=".mp3"]::after, -a[href$=".mp4"]::after, -a[href$=".avi"]::after, -a[href$=".mpg"]::after, -a[href$=".mpeg"]::after, -a[href$=".mov"]::after, -a[href$=".wmv"]::after, -a[href$=".mkv"]::after, -a[href$=".jpg"]::after, -a[href$=".jpeg"]::after, -a[href$=".png"]::after, -a[href$=".gif"]::after { - content: ""; - display: inline-block; - width: 1em; - height: 1em; - margin-left: 0.5rem; - background-size: contain; - background-repeat: no-repeat; +.fa-5x { + font-size: 5em; } -/* Doc */ -a[href$=".doc"]::after, -a[href$=".docx"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-word.svg); +.fa-6x { + font-size: 6em; } -/* PowerPoint */ -a[href$=".ppt"]::after, -a[href$=".pptx"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-powerpoint.svg); +.fa-7x { + font-size: 7em; } -/* Excel */ -a[href$=".xls"]::after, -a[href$=".xlsx"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-excel.svg); +.fa-8x { + font-size: 8em; } -/* PDF */ -a[href$=".pdf"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-pdf.svg); +.fa-9x { + font-size: 9em; } -/* MP3 */ -a[href$=".mp3"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-audio.svg); +.fa-10x { + font-size: 10em; } -/* MP4 */ -a[href$=".mp4"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-video.svg); +/* Table header icons match text color */ +th a i, th a svg, +th a:link i, th a:link svg, +th a:visited i, th a:visited svg, +th a:hover i, th a:hover svg, +th a:focus i, th a:focus svg { + color: var(--bs-body-color) !important; + fill: var(--bs-body-color) !important; } \ No newline at end of file diff --git a/public/css/style.css b/public/css/style.css index 33f50176..e69de29b 100644 --- a/public/css/style.css +++ b/public/css/style.css @@ -1,652 +0,0 @@ -@font-face { - font-family: "Public Sans ExtraBold"; - font-display: swap; - src: url("/assets/fonts/public-sans/ttf/PublicSans-ExtraBold.ttf") format("truetype"); -} - -@font-face { - font-family: "Public Sans Bold"; - font-display: swap; - src: url("/assets/fonts/public-sans/ttf/PublicSans-Bold.ttf") format("truetype"); -} - -@font-face { - font-family: "Public Sans Regular"; - font-display: swap; - src: url("/assets/fonts/public-sans/ttf/PublicSans-Regular.ttf") format("truetype"); -} - -@font-face { - font-family: "Public Sans Light"; - font-display: swap; - src: url("/assets/fonts/public-sans/ttf/PublicSans-Light.ttf") format("truetype"); -} - -@font-face { - font-family: "Public Sans Thin"; - font-display: swap; - src: url("/assets/fonts/public-sans/ttf/PublicSans-Thin.ttf") format("truetype"); -} - -@font-face { - font-family: "JetBrains Mono Medium"; - font-display: swap; - src: url("/assets/fonts/jetbrains-mono/JetBrainsMono-Medium.ttf") format("truetype"); -} - -@font-face { - font-family: "JetBrains Mono ExtraBold"; - font-display: swap; - src: url("/assets/fonts/jetbrains-mono/JetBrainsMono-ExtraBold.ttf") format("truetype"); -} - -@font-face { - font-family: "Playfair Display Regular"; - font-display: swap; - src: url("/assets/fonts/playfair-display/PlayfairDisplay-Regular.ttf") format("truetype"); -} - -@font-face { - font-family: "Source Serif Regular"; - font-display: swap; - src: url("/assets/fonts/source-serif/SourceSerifPro-Regular.ttf") format("truetype"); -} - -/* Dark mode - -[data-bs-theme=dark] { - color-scheme: dark;*/ -:root, [data-bs-theme=dark], [data-bs-theme=light] { - --bs-body-color: #fff; - --bs-body-color-rgb: 255, 255, 255; - --bs-body-bg: #13171f; - --bs-body-bg-rgb: 19, 23, 31; - --bs-body-secondary: red; - --bs-body-secondary-bg: #0f1218; - --bs-link-color: #70e17b; - --bs-link-color-rgb: 112, 225, 123; - --bs-link-hover-color: var(--bs-link-color); - --bs-link-hover-color-rgb: 112, 225, 123; - --bs-highlight-bg: var(--bs-link-color); - --bs-highlight-color: var(--bs-body-bg); - --bs-btn-primary: var(--bs-link-color); - --bs-btn-primary-color: var(--bs-link-color); - --bs-btn-primary-border-color: var(--bs-link-color); - --bs-btn-primary-focus-shadow-rgb: 112, 225, 123; - --bs-btn-primary-active-shadow-rgb: 112, 225, 123; - --bs-btn-primary-active-color: var(--bs-link-color); - --bs-btn-primary-active-bg: var(--bs-link-color); - --bs-btn-bg: var(--bs-link-color); - --bs-btn-border-color: var(--bs-link-color); - --bs-btn-color: var(--bs-body-bg); - --bs-btn-hover-bg: var(--bs-link-color); - --bs-btn-hover-border-color: var(--bs-link-color); - --bs-btn-hover-color: #0f1218; - --bs-btn-primary-bg: var(--bs-link-color); - --bs-nav-link-color: var(--bs-body-color); - --bs-border-color: #252f3e; - --bs-link-hover-decoration: none; - --bs-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1); - --bs-card-shadow: 0 0.25rem .5rem rgba(0, 0, 0, 0.1); - --bs-box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1); - --bs-shadow-md: 0 0.75rem 0.5rem rgba(255, 255, 255, .25); - --bs-font-monospace: "JetBrains Mono Medium", monospace; - --bs-font-light: "Public Sans Light", sans-serif; - --bs-heading-font-family: "Public Sans Bold", sans-serif; - --bs-font-bold: "Public Sans Bold", Helvetica; - --bs-font-regular: "Public Sans Regular", sans-serif; - --bs-font-serif: "Source Serif Regular", serif; - --bs-font-thin: "Public Sans Thin", sans-serif; - --bs-font-extra-bold: "Public Sans ExtraBold", sans-serif; - --bs-font-sans-serif: "Public Sans Regular", sans-serif; - --bs-secondary: var(--bs-body-color); - --bs-nav-link-color: var(--bs-body-color); - --bs-nav-link-hover-color: var(--bs-link-color); - --bs-badge-bg: var(--bs-link-color); - --bs-border-radius: .25rem; - --bs-border-radius-sm: .25rem; - --bs-selection-bg: var(--bs-link-color); - --bs-selection-color: var(--bs-body-bg); - --bs-text-bg-primary: #face00; - --bs-text-bg-success: #4866ff; - --bs-card-hover-bg: #0f1218; - --bs-text-secondary: var(--bs-secondary); - --bs-form-control-color: var(--bs-body-color); - --bs-form-control-bg: var(--bs-body-bg); - --bs-form-control-border-color: var(--bs-border-color); - --bs-form-control-focus-border-color: var(--bs-link-color); - --bs-form-control-focus-box-shadow: 0 0 0 0.25rem rgba(0, 123, 255, 0.25); - --bs-form-control-focus-color: var(--bs-body-color); - --bs-text-opacity: .5; - --bs-nav-link-font-size: 1.1em; - --bs-info-text-emphasis: var(--bs-body-color); - --bs-info-bg-subtle: var(--bs-body-secondary-bg); - --bs-info-border-subtle: var(--bs-border-color); -} - -.form-control { - color: var(--bs-body-color) !important; -} - -.form-control:focus { - border-color: var(--bs-body-color); - box-shadow: 0 0.25rem 0.5rem #252f3e; -} - -::placeholder, ::-ms-input-placeholder { - color: var(--bs-body-color); - opacity: var(--bs-text-opacity); -} - -/* General */ - -body { - color: var(--bs-body-color); - background: var(--bs-body-bg); - background-color: var(--bs-body-bg); - font-family: var(--bs-font-sans-serif); -} - -h1, -h2, -h3, -h4, -h5, -h6, -.h1, -.h2, -.h3, -.h4, -.h5, -.h6, -.display-1, -.display-2, -.display-3, -.display-4 { - font-family: var(--bs-font-bold); -} - -h1, a.btn, .feedback, .nav-pills { - letter-spacing: -.01em; -} - -body.docs h2, -body.page h2, -body.docs h3, -body.page h3 { - margin-bottom: 1rem; - margin-top: 3rem; -} - -body footer a { - color: var(--bs-body-color); -} - -body footer img, -body ul.navbar-nav img { - filter: invert(1); -} - -blockquote { - border-left: 5px solid var(--bs-link-color); - margin: 0 0 1rem 0; - padding: 0 0 0 1.5rem; -} - -blockquote p { - font-family: var(--bs-font-light) !important; - font-size: 1.15rem !important; - line-height: 1.6; -} - -.lead { - font-family: var(--bs-font-regular) !important; -} - -strong { - font-family: var(--bs-font-bold); -} - -.text-secondary { - color: rgba(255, 255, 255, var(--bs-text-opacity)) !important; -} - -/* Selection */ - -::selection { - background-color: var(--bs-selection-bg); - color: var(--bs-selection-color); -} - -/* Links */ - -a:hover { - text-decoration: var(--bs-link-hover-decoration); - color: var(--bs-link-hover-color); -} - - -.social a[href^="http"]:not([href^="https://scangov.org"]):not([href^="https://scangov.com"]):not([href^="http://localhost:4000/"]):not([href^="https://docs.scangov.org"])::after { - display: none !important; -} - -.social a, .social a:visited { - color: var(--bs-body-color); - display: inline-block; - margin-right: .75rem; -} - -.social a:hover { - color: var(--bs-link-color); -} - -a.btn-primary, a.btn-primary:visited, .btn-primary { - background-color: var(--bs-link-color); - color: var(--bs-body-bg); - border-radius: var(--bs-border-radius); - border: 1px solid var(--bs-border-color); - box-shadow: var(--bs-card-shadow); - cursor: pointer; - font-family: var(--bs-font-bold); - padding: .55rem; - transition: opacity 0.5s ease-in-out; -} - -a.btn-primary-outline { - background-color: var(--bs-body-bg); - color: var(--bs-body-color); - border-radius: var(--bs-border-radius-sm); - border: 1px solid var(--bs-border-color); - box-shadow: var(--bs-card-shadow); - cursor: pointer; - font-family: var(--bs-font-sans-serif); - padding: .55rem; - transition: opacity 0.5s ease-in-out; -} - -a.btn-primary-outline:not(.active):hover, .btn-primary-outline:not(.active):hover { - background-color: var(--bs-btn-bg) !important; - color: var(--bs-body-bg); - border: 1px solid var(--bs-border-color); -} - -#feedback-container { - position: fixed; - bottom: 2rem; - width: 100%; - z-index: 1000; -} - -.feedback { - opacity: 0; - background-color: var(--bs-link-color); - color: var(--bs-body-bg); - border-radius: var(--bs-border-radius); - border: 1px solid var(--bs-border-color); - box-shadow: var(--bs-card-shadow); - cursor: pointer; - font-family: var(--bs-font-bold); - padding: .55rem; - text-decoration: none; - transition: opacity 0.5s ease-in-out; -} - -.feedback svg, a.btn svg { - transition: opacity 0.5s ease-in-out; -} - -.feedback:hover, a.btn:hover, .btn-primary:hover { - background-color: var(--bs-body-bg) !important; - box-shadow: var(--bs-box-shadow-md) !important; - border: 1px solid var(--bs-border-color); - color: var(--bs-body-color) !important; - transition: all 0.5s ease; -} - -.feedback:hover svg, a.btn:hover svg { - color: var(--bs-body-color) !important; - transition: all 0.5s ease; -} - -/* Navbar */ - -.navbar { - box-shadow: var(--bs-shadow); -} - -.navbar-brand { - font-family: var(--bs-font-bold); -} - -.navbar-brand { - color: var(--bs-body-color) !important; -} - -.navbar-nav, .nav-link, .navbar-nav .nav-link, a.list-group-item { - color: var(--bs-body-color) !important; -} - -.navbar-brand:hover, .navbar-nav:hover, .nav-link:hover, .navbar-nav .nav-link:hover, a.list-group-item:hover { - color: var(--bs-link-color) !important; -} - -.navbar-brand:hover>svg { - fill: var(--bs-link-color) !important; -} - -#logo { - fill: var(--bs-body-color); - width: 100%; - /* Use percentage or specific value as per your layout */ - max-width: 45px; - /* Sets a maximum width */ -} - -a.nav-link:hover, .nav-link:hover svg, a.navbar-brand:hover, a.navbar-brand:hover svg, .navbar-brand:hover, .navbar-brand:hover svg { - color: var(--bs-link-color); -} - -a.list-group-item:hover { - background-color: #0f1218; - color: var(--bs-body-color); -} - -.border-end { - box-shadow: var(--bs-shadow); -} - -/* Cards */ - -.card { - border: var(--bs-border-color) solid 1px; - box-shadow: var(--bs-card-shadow); - width: 100%; - transition: background-color 0.5s, box-shadow 0.5s, border 0.5s; -} - -a.card { - text-decoration: none; - transition: 0.25s filter; -} - -.card:hover { - background-color: var(--bs-body-secondary-bg) !important; - box-shadow: var(--bs-box-shadow-md) !important; -} - -.card-plans:hover { - background-color: var(--bs-body-secondary-bg) !important; - border: var(--bs-link-color) solid 1px; - box-shadow: var(--bs-box-shadow-md) !important; -} - -/* Badge */ - -.badge { - font-family: "Public Sans Regular", sans-serif !important; - padding: .55rem !important; - font-size: .8rem !important; - border-radius: var(--bs-border-radius-sm) !important; -} - -.badge-primary:hover { - background-color: #fee685 !important; - color: var(--bs-body-bg) !important; -} - -.text-bg-primary { - background-color: #face00 !important; - color: var(--bs-body-bg) !important; -} - -.text-bg-success { - background-color: var(--bs-text-bg-success) !important; - color: var(--bs-body-color) !important; -} - -/* Images */ - -main#home img { - display: block; - margin: auto; - margin-bottom: 0.5rem; -} - - - -svg.fa-circle-check { - fill: var(--bs-success); -} - -svg.fa-circle-xmark { - fill: var(--bs-danger); -} - -svg.fa-circle-exclamation { - fill: var(--bs-warning); -} - -svg.fa-circle-right { - fill: var(--bs-info); -} - -/* Toggle */ - -.dropdown-toggle::after { - display: none; -} - -.dropdown-toggle svg { - color: var(--bs-btn-color) !important; - transition: 0.15s color; -} - -.dropdown-toggle:hover svg, -.dropdown-toggle:focus svg { - color: var(--bs-btn-hover-color) !important; -} - -.navbar-toggler-icon { - color: var(--bs-body-color) !important; -} - -[data-bs-theme="dark"] .navbar-toggler-icon { - --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); -} - -/* Timeline */ - -.timeline { - border-left: 1px solid hsl(0, 0%, 90%); - position: relative; - list-style: none; -} - -.timeline .timeline-item { - position: relative; -} - -.timeline .timeline-item:after { - position: absolute; - display: block; - top: 0; -} - -.timeline .timeline-item:after { - background-color: hsl(0, 0%, 90%); - left: -38px; - border-radius: 50%; - height: 11px; - width: 11px; - content: ""; -} - -/* Anchor links */ - -h2 a#heading-hashtag, -h3 a#heading-hashtag { - display: none; -} - -h2:hover a#heading-hashtag, -h3:hover a#heading-hashtag { - display: revert; -} - -.post h2 { - margin: 1.25rem 0; -} - -.post ul, .post p { - margin-bottom: 1.75rem; -} - -/* File types */ -a[href$=".doc"]::after, -a[href$=".docx"]::after, -a[href$=".ppt"]::after, -a[href$=".pptx"]::after, -a[href$=".xls"]::after, -a[href$=".xlsx"]::after, -a[href$=".pdf"]::after, -a[href$=".mp3"]::after, -a[href$=".mp4"]::after, -a[href$=".avi"]::after, -a[href$=".mpg"]::after, -a[href$=".mpeg"]::after, -a[href$=".mov"]::after, -a[href$=".wmv"]::after, -a[href$=".mkv"]::after, -a[href$=".jpg"]::after, -a[href$=".jpeg"]::after, -a[href$=".png"]::after, -a[href$=".gif"]::after { - content: ""; - display: inline-block; - width: 1em; - height: 1em; - margin-left: 0.5rem; - background-size: contain; - background-repeat: no-repeat; -} - -/* Doc */ -a[href$=".doc"]::after, -a[href$=".docx"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-word.svg); -} - -/* PowerPoint */ -a[href$=".ppt"]::after, -a[href$=".pptx"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-powerpoint.svg); -} - -/* Excel */ -a[href$=".xls"]::after, -a[href$=".xlsx"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-excel.svg); -} - -/* PDF */ -a[href$=".pdf"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-pdf.svg); -} - -/* MP3 */ -a[href$=".mp3"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-audio.svg); -} - -/* MP4 */ -a[href$=".mp4"]::after { - background-image: url(/assets/font-awesome/svgs/solid/file-video.svg); -} - -/* Jumbotron */ - -h1 span.break { - display: block; -} - -h1 { - display: block; -} - -h1::after { - content: ""; -} - -h1::before { - content: ""; -} - -h1 { - word-wrap: break-word; -} - -h1 { - margin-bottom: 1em; -} - -h1::before { - content: ""; -} - -h1::after { - content: ""; -} - -/* add to components */ - -.active { - --bs-nav-pills-link-active-bg: var(--bs-btn-primary-bg) !important; - color: var(--bs-body-bg) !important; -} - -.nav-pills .active i, .nav-pills .active svg { - color: var(--bs-body-bg) !important; -} - -.nav-pills .active, .nav-pills .active i, .nav-pills .active svg { - --bs-link-color: var(--bs-body-bg); -} - -/* Cards */ - -.card-hover { - transition: 0.5s filter; -} - -.card-hover:hover { - filter: brightness(1.3); -} - -/* experimental svg size fixing after 11ty font awesome sprite switch */ -.nav-item svg { - max-width: 1rem; - display: inline-block; - height: 1em; - overflow: visible; - vertical-align: -.125em; -} - -/* above doesn't assign width because it messes up the who it's for section on homepage */ -.fa-solid, .fa-circle-check, .fa-5x.fa-solid, .fa-brands { - height: 1em; - width: 1em; -} - -/* Forms */ - -.form-control:focus { - border-color: var(--bs-link-color); -} - -.text-bg-danger a { - color: #fff; -} - -.text-bg-warning a { - color: #000; -} \ No newline at end of file