From ac46c269b3833a100a9e15dae34b5b85301d8114 Mon Sep 17 00:00:00 2001 From: Christoph Haas Date: Sun, 16 Mar 2025 16:51:36 +0100 Subject: [PATCH] Fix CSS styling after Zurb update. Taken from old commit. --- app/assets/builds/application.css | 274 +++++++++++++------------- app/assets/stylesheets/_settings.scss | 71 +++---- bun.lockb | Bin 101165 -> 101165 bytes 3 files changed, 175 insertions(+), 170 deletions(-) diff --git a/app/assets/builds/application.css b/app/assets/builds/application.css index 853d0b6..7367ffa 100644 --- a/app/assets/builds/application.css +++ b/app/assets/builds/application.css @@ -221,8 +221,8 @@ html { body { margin: 0; padding: 0; - background: #fefefe; - font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; + background: #f2f2f2; + font-family: "Droid Sans", sans-serif; font-weight: normal; line-height: 1.5; color: #0a0a0a; @@ -610,7 +610,7 @@ h3, .h3, h4, .h4, h5, .h5, h6, .h6 { - font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; + font-family: "Droid Sans", sans-serif; font-style: normal; font-weight: normal; color: inherit; @@ -634,35 +634,35 @@ h1, .h1 { } h2, .h2 { - font-size: 1.25rem; + font-size: 1rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h3, .h3 { - font-size: 1.1875rem; + font-size: 0.875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h4, .h4 { - font-size: 1.125rem; + font-size: 0.8125rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h5, .h5 { - font-size: 1.0625rem; + font-size: 0.75rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h6, .h6 { - font-size: 1rem; + font-size: 0.6875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; @@ -670,32 +670,32 @@ h6, .h6 { @media print, screen and (min-width: 40em) { h1, .h1 { - font-size: 3rem; - } - h2, .h2 { font-size: 2.5rem; } + h2, .h2 { + font-size: 2rem; + } h3, .h3 { - font-size: 1.9375rem; + font-size: 1.75rem; } h4, .h4 { - font-size: 1.5625rem; + font-size: 1.625rem; } h5, .h5 { - font-size: 1.25rem; + font-size: 1.5rem; } h6, .h6 { - font-size: 1rem; + font-size: 1.375rem; } } a { line-height: inherit; - color: #1779ba; + color: #c70338; text-decoration: none; cursor: pointer; } a:hover, a:focus { - color: rgb(19.78, 104.06, 159.96); + color: rgb(171.14, 2.58, 48.16); } a img { border: 0; @@ -3005,7 +3005,7 @@ ul.no-bullet, ol.no-bullet { vertical-align: middle; margin: 0 0 1rem 0; border: 1px solid transparent; - border-radius: 0; + border-radius: 0.5rem; transition: background-color 0.25s ease-out, color 0.25s ease-out; font-family: inherit; font-size: 0.9rem; @@ -3034,19 +3034,19 @@ ul.no-bullet, ol.no-bullet { margin-left: 0; } .button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus { - background-color: #1779ba; + background-color: #c70338; color: #fefefe; } .button:hover, .button:focus { - background-color: rgb(19.55, 102.85, 158.1); + background-color: rgb(169.15, 2.55, 47.6); color: #fefefe; } .button.primary, .button.primary.disabled, .button.primary[disabled], .button.primary.disabled:hover, .button.primary[disabled]:hover, .button.primary.disabled:focus, .button.primary[disabled]:focus { - background-color: #1779ba; + background-color: #c70338; color: #fefefe; } .button.primary:hover, .button.primary:focus { - background-color: rgb(18.4, 96.8, 148.8); + background-color: rgb(159.2, 2.4, 44.8); color: #fefefe; } .button.secondary, .button.secondary.disabled, .button.secondary[disabled], .button.secondary.disabled:hover, .button.secondary[disabled]:hover, .button.secondary.disabled:focus, .button.secondary[disabled]:focus { @@ -3085,20 +3085,20 @@ ul.no-bullet, ol.no-bullet { background-color: transparent; } .button.hollow, .button.hollow.disabled, .button.hollow[disabled], .button.hollow.disabled:hover, .button.hollow[disabled]:hover, .button.hollow.disabled:focus, .button.hollow[disabled]:focus { - border: 1px solid #1779ba; - color: #1779ba; + border: 1px solid #c70338; + color: #c70338; } .button.hollow:hover, .button.hollow:focus { - border-color: rgb(11.5, 60.5, 93); - color: rgb(11.5, 60.5, 93); + border-color: rgb(99.5, 1.5, 28); + color: rgb(99.5, 1.5, 28); } .button.hollow.primary, .button.hollow.primary.disabled, .button.hollow.primary[disabled], .button.hollow.primary.disabled:hover, .button.hollow.primary[disabled]:hover, .button.hollow.primary.disabled:focus, .button.hollow.primary[disabled]:focus { - border: 1px solid #1779ba; - color: #1779ba; + border: 1px solid #c70338; + color: #c70338; } .button.hollow.primary:hover, .button.hollow.primary:focus { - border-color: rgb(11.5, 60.5, 93); - color: rgb(11.5, 60.5, 93); + border-color: rgb(99.5, 1.5, 28); + color: rgb(99.5, 1.5, 28); } .button.hollow.secondary, .button.hollow.secondary.disabled, .button.hollow.secondary[disabled], .button.hollow.secondary.disabled:hover, .button.hollow.secondary[disabled]:hover, .button.hollow.secondary.disabled:focus, .button.hollow.secondary[disabled]:focus { border: 1px solid #767676; @@ -3137,16 +3137,16 @@ ul.no-bullet, ol.no-bullet { background-color: transparent; } .button.clear, .button.clear.disabled, .button.clear[disabled], .button.clear.disabled:hover, .button.clear[disabled]:hover, .button.clear.disabled:focus, .button.clear[disabled]:focus { - color: #1779ba; + color: #c70338; } .button.clear:hover, .button.clear:focus { - color: rgb(11.5, 60.5, 93); + color: rgb(99.5, 1.5, 28); } .button.clear.primary, .button.clear.primary.disabled, .button.clear.primary[disabled], .button.clear.primary.disabled:hover, .button.clear.primary[disabled]:hover, .button.clear.primary.disabled:focus, .button.clear.primary[disabled]:focus { - color: #1779ba; + color: #c70338; } .button.clear.primary:hover, .button.clear.primary:focus { - color: rgb(11.5, 60.5, 93); + color: rgb(99.5, 1.5, 28); } .button.clear.secondary, .button.clear.secondary.disabled, .button.clear.secondary[disabled], .button.clear.secondary.disabled:hover, .button.clear.secondary[disabled]:hover, .button.clear.secondary.disabled:focus, .button.clear.secondary[disabled]:focus { color: #767676; @@ -3192,10 +3192,10 @@ ul.no-bullet, ol.no-bullet { margin-left: 1em; } .button.dropdown.hollow::after, .button.dropdown.clear::after { - border-top-color: #1779ba; + border-top-color: #c70338; } .button.dropdown.hollow.primary::after, .button.dropdown.clear.primary::after { - border-top-color: #1779ba; + border-top-color: #c70338; } .button.dropdown.hollow.secondary::after, .button.dropdown.clear.secondary::after { border-top-color: #767676; @@ -3261,11 +3261,11 @@ a.button:hover, a.button:focus { flex: 1 1 0px; } .button-group.primary .button, .button-group.primary .button.disabled, .button-group.primary .button[disabled], .button-group.primary .button.disabled:hover, .button-group.primary .button[disabled]:hover, .button-group.primary .button.disabled:focus, .button-group.primary .button[disabled]:focus { - background-color: #1779ba; + background-color: #c70338; color: #fefefe; } .button-group.primary .button:hover, .button-group.primary .button:focus { - background-color: rgb(18.4, 96.8, 148.8); + background-color: rgb(159.2, 2.4, 44.8); color: #fefefe; } .button-group.secondary .button, .button-group.secondary .button.disabled, .button-group.secondary .button[disabled], .button-group.secondary .button.disabled:hover, .button-group.secondary .button[disabled]:hover, .button-group.secondary .button.disabled:focus, .button-group.secondary .button[disabled]:focus { @@ -3304,20 +3304,20 @@ a.button:hover, a.button:focus { background-color: transparent; } .button-group.hollow .button, .button-group.hollow .button.disabled, .button-group.hollow .button[disabled], .button-group.hollow .button.disabled:hover, .button-group.hollow .button[disabled]:hover, .button-group.hollow .button.disabled:focus, .button-group.hollow .button[disabled]:focus { - border: 1px solid #1779ba; - color: #1779ba; + border: 1px solid #c70338; + color: #c70338; } .button-group.hollow .button:hover, .button-group.hollow .button:focus { - border-color: rgb(11.5, 60.5, 93); - color: rgb(11.5, 60.5, 93); + border-color: rgb(99.5, 1.5, 28); + color: rgb(99.5, 1.5, 28); } .button-group.hollow.primary .button, .button-group.hollow.primary .button.disabled, .button-group.hollow.primary .button[disabled], .button-group.hollow.primary .button.disabled:hover, .button-group.hollow.primary .button[disabled]:hover, .button-group.hollow.primary .button.disabled:focus, .button-group.hollow.primary .button[disabled]:focus, .button-group.hollow .button.primary, .button-group.hollow .button.primary.disabled, .button-group.hollow .button.primary[disabled], .button-group.hollow .button.primary.disabled:hover, .button-group.hollow .button.primary[disabled]:hover, .button-group.hollow .button.primary.disabled:focus, .button-group.hollow .button.primary[disabled]:focus { - border: 1px solid #1779ba; - color: #1779ba; + border: 1px solid #c70338; + color: #c70338; } .button-group.hollow.primary .button:hover, .button-group.hollow.primary .button:focus, .button-group.hollow .button.primary:hover, .button-group.hollow .button.primary:focus { - border-color: rgb(11.5, 60.5, 93); - color: rgb(11.5, 60.5, 93); + border-color: rgb(99.5, 1.5, 28); + color: rgb(99.5, 1.5, 28); } .button-group.hollow.secondary .button, .button-group.hollow.secondary .button.disabled, .button-group.hollow.secondary .button[disabled], .button-group.hollow.secondary .button.disabled:hover, .button-group.hollow.secondary .button[disabled]:hover, .button-group.hollow.secondary .button.disabled:focus, .button-group.hollow.secondary .button[disabled]:focus, .button-group.hollow .button.secondary, .button-group.hollow .button.secondary.disabled, .button-group.hollow .button.secondary[disabled], .button-group.hollow .button.secondary.disabled:hover, .button-group.hollow .button.secondary[disabled]:hover, .button-group.hollow .button.secondary.disabled:focus, .button-group.hollow .button.secondary[disabled]:focus { border: 1px solid #767676; @@ -3356,16 +3356,16 @@ a.button:hover, a.button:focus { background-color: transparent; } .button-group.clear .button, .button-group.clear .button.disabled, .button-group.clear .button[disabled], .button-group.clear .button.disabled:hover, .button-group.clear .button[disabled]:hover, .button-group.clear .button.disabled:focus, .button-group.clear .button[disabled]:focus { - color: #1779ba; + color: #c70338; } .button-group.clear .button:hover, .button-group.clear .button:focus { - color: rgb(11.5, 60.5, 93); + color: rgb(99.5, 1.5, 28); } .button-group.clear.primary .button, .button-group.clear.primary .button.disabled, .button-group.clear.primary .button[disabled], .button-group.clear.primary .button.disabled:hover, .button-group.clear.primary .button[disabled]:hover, .button-group.clear.primary .button.disabled:focus, .button-group.clear.primary .button[disabled]:focus, .button-group.clear .button.primary, .button-group.clear .button.primary.disabled, .button-group.clear .button.primary[disabled], .button-group.clear .button.primary.disabled:hover, .button-group.clear .button.primary[disabled]:hover, .button-group.clear .button.primary.disabled:focus, .button-group.clear .button.primary[disabled]:focus { - color: #1779ba; + color: #c70338; } .button-group.clear.primary .button:hover, .button-group.clear.primary .button:focus, .button-group.clear .button.primary:hover, .button-group.clear .button.primary:focus { - color: rgb(11.5, 60.5, 93); + color: rgb(99.5, 1.5, 28); } .button-group.clear.secondary .button, .button-group.clear.secondary .button.disabled, .button-group.clear.secondary .button[disabled], .button-group.clear.secondary .button.disabled:hover, .button-group.clear.secondary .button[disabled]:hover, .button-group.clear.secondary .button.disabled:focus, .button-group.clear.secondary .button[disabled]:focus, .button-group.clear .button.secondary, .button-group.clear .button.secondary.disabled, .button-group.clear .button.secondary[disabled], .button-group.clear .button.secondary.disabled:hover, .button-group.clear .button.secondary[disabled]:hover, .button-group.clear .button.secondary.disabled:focus, .button-group.clear .button.secondary[disabled]:focus { color: #767676; @@ -3474,11 +3474,11 @@ a.button:hover, a.button:focus { line-height: 1; white-space: nowrap; cursor: default; - background: #1779ba; + background: #c70338; color: #fefefe; } .label.primary { - background: #1779ba; + background: #c70338; color: #fefefe; } .label.secondary { @@ -3505,7 +3505,7 @@ a.button:hover, a.button:focus { background-color: #cacaca; } .progress.primary .progress-meter { - background-color: #1779ba; + background-color: #c70338; } .progress.secondary .progress-meter { background-color: #767676; @@ -3525,7 +3525,7 @@ a.button:hover, a.button:focus { display: block; width: 0%; height: 100%; - background-color: #1779ba; + background-color: #c70338; } .progress-meter-text { @@ -3573,7 +3573,7 @@ a.button:hover, a.button:focus { width: 1.4rem; height: 1.4rem; border-radius: 0; - background-color: #1779ba; + background-color: #c70338; transition: all 0.2s ease-in-out; touch-action: manipulation; position: absolute; @@ -3584,7 +3584,7 @@ a.button:hover, a.button:focus { outline: 0; } .slider-handle:hover { - background-color: rgb(19.55, 102.85, 158.1); + background-color: rgb(169.15, 2.55, 47.6); } .slider-handle.is-dragging { transition: all 0s linear; @@ -3664,7 +3664,7 @@ input + .switch-paddle { content: ""; } input:checked ~ .switch-paddle { - background: #1779ba; + background: #c70338; } input:checked ~ .switch-paddle::after { left: 2.25rem; @@ -3676,7 +3676,7 @@ input:focus-visible ~ .switch-paddle::after { background: #fefefe; } input:checked:focus-visible ~ .switch-paddle { - background: rgb(19.55, 102.85, 158.1); + background: rgb(169.15, 2.55, 47.6); } input:disabled ~ .switch-paddle { cursor: not-allowed; @@ -3867,11 +3867,11 @@ table.hover:not(.unstriped) tr:nth-of-type(even):hover { border-radius: 50%; font-size: 0.6rem; text-align: center; - background: #1779ba; + background: #c70338; color: #fefefe; } .badge.primary { - background: #1779ba; + background: #c70338; color: #fefefe; } .badge.secondary { @@ -3919,7 +3919,7 @@ table.hover:not(.unstriped) tr:nth-of-type(even):hover { color: #cacaca; } .breadcrumbs a { - color: #1779ba; + color: #c70338; } .breadcrumbs a:hover { text-decoration: underline; @@ -3945,7 +3945,7 @@ table.hover:not(.unstriped) tr:nth-of-type(even):hover { margin-bottom: 0; } .callout.primary { - background-color: rgb(214.8186602871, 235.9894736842, 250.0313397129); + background-color: rgb(254.3138613861, 209.4861386139, 221.6079207921); color: #0a0a0a; } .callout.secondary { @@ -4024,7 +4024,7 @@ table.hover:not(.unstriped) tr:nth-of-type(even):hover { visibility: hidden; border: 1px solid #cacaca; border-radius: 0; - background-color: #fefefe; + background-color: #f2f2f2; font-size: 1rem; } .dropdown-pane.is-opening { @@ -4087,7 +4087,7 @@ table.hover:not(.unstriped) tr:nth-of-type(even):hover { } .pagination .current { padding: 0.1875rem 0.625rem; - background: #1779ba; + background: #c70338; color: #fefefe; cursor: default; } @@ -4246,7 +4246,7 @@ table.hover:not(.unstriped) tr:nth-of-type(even):hover { border-bottom: 0; font-size: 0.75rem; line-height: 1; - color: #1779ba; + color: #c70338; } :last-child:not(.is-active) > .accordion-title { border-bottom: 1px solid #e6e6e6; @@ -4464,13 +4464,13 @@ table.hover:not(.unstriped) tr:nth-of-type(even):hover { } .tabs.primary { - background: #1779ba; + background: #c70338; } .tabs.primary > li > a { color: #fefefe; } .tabs.primary > li > a:hover, .tabs.primary > li > a:focus { - background: rgb(21.85, 114.95, 176.7); + background: rgb(214.1712871287, 3.2287128713, 60.2693069307); } .tabs-title { @@ -4481,18 +4481,18 @@ table.hover:not(.unstriped) tr:nth-of-type(even):hover { padding: 1.25rem 1.5rem; font-size: 0.75rem; line-height: 1; - color: #1779ba; + color: #c70338; } [data-whatinput=mouse] .tabs-title > a { outline: 0; } .tabs-title > a:hover { background: #fefefe; - color: rgb(19.78, 104.06, 159.96); + color: rgb(171.14, 2.58, 48.16); } .tabs-title > a:focus, .tabs-title > a[aria-selected=true] { background: #e6e6e6; - color: #1779ba; + color: #c70338; } .tabs-content { @@ -4530,7 +4530,7 @@ a.thumbnail { transition: box-shadow 200ms ease-out; } a.thumbnail:hover, a.thumbnail:focus { - box-shadow: 0 0 6px 1px rgba(23, 121, 186, 0.5); + box-shadow: 0 0 6px 1px rgba(199, 3, 56, 0.5); } a.thumbnail image { box-shadow: none; @@ -4552,7 +4552,7 @@ a.thumbnail image { line-height: 1; text-decoration: none; display: block; - padding: 0.7rem 1rem; + padding: 0.3rem 0.5rem; } .menu input, .menu select, @@ -4684,11 +4684,11 @@ a.thumbnail image { text-align: center; } .menu .is-active > a { - background: #1779ba; + background: #c70338; color: #fefefe; } .menu .active > a { - background: #1779ba; + background: #c70338; color: #fefefe; } .menu.align-left { @@ -4727,7 +4727,7 @@ a.thumbnail image { justify-content: flex-start; } .menu .menu-text { - padding: 0.7rem 1rem; + padding: 0.3rem 0.5rem; font-weight: bold; line-height: 1; color: inherit; @@ -4800,10 +4800,10 @@ a.thumbnail image { width: 100%; } .accordion-menu a { - padding: 0.7rem 1rem; + padding: 0.3rem 0.5rem; } .accordion-menu .is-accordion-submenu a { - padding: 0.7rem 1rem; + padding: 0.3rem 0.5rem; } .accordion-menu .nested.is-accordion-submenu { margin-right: 0; @@ -4824,7 +4824,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-bottom-width: 0; - border-color: #1779ba transparent transparent; + border-color: #c70338 transparent transparent; position: absolute; top: 50%; margin-top: -3px; @@ -4867,7 +4867,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-bottom-width: 0; - border-color: #1779ba transparent transparent; + border-color: #c70338 transparent transparent; top: 0; bottom: 0; margin: auto; @@ -4901,7 +4901,7 @@ a.thumbnail image { } .drilldown a { - padding: 0.7rem 1rem; + padding: 0.3rem 0.5rem; background: #fefefe; } .drilldown .is-drilldown-submenu { @@ -4922,7 +4922,7 @@ a.thumbnail image { transform: translateX(100%); } .drilldown .is-drilldown-submenu a { - padding: 0.7rem 1rem; + padding: 0.3rem 0.5rem; } .drilldown .nested.is-drilldown-submenu { margin-right: 0; @@ -4942,7 +4942,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-right-width: 0; - border-color: transparent transparent transparent #1779ba; + border-color: transparent transparent transparent #c70338; position: absolute; top: 50%; margin-top: -6px; @@ -4956,7 +4956,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-right-width: 0; - border-color: transparent transparent transparent #1779ba; + border-color: transparent transparent transparent #c70338; right: 1rem; left: auto; } @@ -4968,7 +4968,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-left-width: 0; - border-color: transparent #1779ba transparent transparent; + border-color: transparent #c70338 transparent transparent; right: auto; left: 1rem; } @@ -4980,7 +4980,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-left-width: 0; - border-color: transparent #1779ba transparent transparent; + border-color: transparent #c70338 transparent transparent; display: inline-block; vertical-align: middle; margin-right: 0.75rem; @@ -5008,7 +5008,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-bottom-width: 0; - border-color: #1779ba transparent transparent; + border-color: #c70338 transparent transparent; right: 5px; left: auto; margin-top: -3px; @@ -5017,11 +5017,11 @@ a.thumbnail image { outline: 0; } .dropdown.menu > li > a { - padding: 0.7rem 1rem; + padding: 0.3rem 0.5rem; } .dropdown.menu > li.is-active > a { background: transparent; - color: #1779ba; + color: #c70338; } .no-js .dropdown.menu ul { display: none; @@ -5053,7 +5053,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-left-width: 0; - border-color: transparent #1779ba transparent transparent; + border-color: transparent #c70338 transparent transparent; right: auto; left: 5px; } @@ -5065,7 +5065,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-right-width: 0; - border-color: transparent transparent transparent #1779ba; + border-color: transparent transparent transparent #c70338; } @media print, screen and (min-width: 40em) { .dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu { @@ -5090,7 +5090,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-bottom-width: 0; - border-color: #1779ba transparent transparent; + border-color: #c70338 transparent transparent; right: 5px; left: auto; margin-top: -3px; @@ -5118,7 +5118,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-left-width: 0; - border-color: transparent #1779ba transparent transparent; + border-color: transparent #c70338 transparent transparent; right: auto; left: 5px; } @@ -5130,7 +5130,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-right-width: 0; - border-color: transparent transparent transparent #1779ba; + border-color: transparent transparent transparent #c70338; } } @media print, screen and (min-width: 64em) { @@ -5156,7 +5156,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-bottom-width: 0; - border-color: #1779ba transparent transparent; + border-color: #c70338 transparent transparent; right: 5px; left: auto; margin-top: -3px; @@ -5184,7 +5184,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-left-width: 0; - border-color: transparent #1779ba transparent transparent; + border-color: transparent #c70338 transparent transparent; right: auto; left: 5px; } @@ -5196,7 +5196,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-right-width: 0; - border-color: transparent transparent transparent #1779ba; + border-color: transparent transparent transparent #c70338; } } .dropdown.menu.align-right .is-dropdown-submenu.first-sub { @@ -5246,7 +5246,7 @@ a.thumbnail image { background: #fefefe; } .dropdown .is-dropdown-submenu a { - padding: 0.7rem 1rem; + padding: 0.3rem 0.5rem; } .is-dropdown-submenu .is-dropdown-submenu-parent > a::after { right: 14px; @@ -5259,7 +5259,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-left-width: 0; - border-color: transparent #1779ba transparent transparent; + border-color: transparent #c70338 transparent transparent; right: auto; left: 5px; } @@ -5271,7 +5271,7 @@ a.thumbnail image { border-width: 6px; content: ""; border-right-width: 0; - border-color: transparent transparent transparent #1779ba; + border-color: transparent transparent transparent #c70338; } .is-dropdown-submenu .is-dropdown-submenu { margin-top: -1px; @@ -5839,7 +5839,7 @@ html.is-reveal-open body { } .top-bar { - padding: 0.5rem; + padding: 0; display: flex; flex-wrap: nowrap; justify-content: space-between; @@ -5847,7 +5847,7 @@ html.is-reveal-open body { } .top-bar, .top-bar ul { - background-color: #e6e6e6; + background-color: #d8d8d8; } .top-bar input { max-width: 200px; @@ -6314,8 +6314,8 @@ html { body { margin: 0; padding: 0; - background: #fefefe; - font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; + background: #f2f2f2; + font-family: "Droid Sans", sans-serif; font-weight: normal; line-height: 1.5; color: #0a0a0a; @@ -7508,7 +7508,7 @@ h3, .h3, h4, .h4, h5, .h5, h6, .h6 { - font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; + font-family: "Droid Sans", sans-serif; font-style: normal; font-weight: normal; color: inherit; @@ -7532,35 +7532,35 @@ h1, .h1 { } h2, .h2 { - font-size: 1.25rem; + font-size: 1rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h3, .h3 { - font-size: 1.1875rem; + font-size: 0.875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h4, .h4 { - font-size: 1.125rem; + font-size: 0.8125rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h5, .h5 { - font-size: 1.0625rem; + font-size: 0.75rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; } h6, .h6 { - font-size: 1rem; + font-size: 0.6875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem; @@ -7568,32 +7568,32 @@ h6, .h6 { @media print, screen and (min-width: 40em) { h1, .h1 { - font-size: 3rem; - } - h2, .h2 { font-size: 2.5rem; } + h2, .h2 { + font-size: 2rem; + } h3, .h3 { - font-size: 1.9375rem; + font-size: 1.75rem; } h4, .h4 { - font-size: 1.5625rem; + font-size: 1.625rem; } h5, .h5 { - font-size: 1.25rem; + font-size: 1.5rem; } h6, .h6 { - font-size: 1rem; + font-size: 1.375rem; } } a { line-height: inherit; - color: #1779ba; + color: #c70338; text-decoration: none; cursor: pointer; } a:hover, a:focus { - color: rgb(19.78, 104.06, 159.96); + color: rgb(171.14, 2.58, 48.16); } a img { border: 0; @@ -8128,7 +8128,7 @@ select:not([multiple]) { vertical-align: middle; margin: 0 0 1rem 0; border: 1px solid transparent; - border-radius: 0; + border-radius: 0.5rem; transition: background-color 0.25s ease-out, color 0.25s ease-out; font-family: inherit; font-size: 0.9rem; @@ -8157,19 +8157,19 @@ select:not([multiple]) { margin-left: 0; } .button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus { - background-color: #1779ba; + background-color: #c70338; color: #fefefe; } .button:hover, .button:focus { - background-color: rgb(19.55, 102.85, 158.1); + background-color: rgb(169.15, 2.55, 47.6); color: #fefefe; } .button.primary, .button.primary.disabled, .button.primary[disabled], .button.primary.disabled:hover, .button.primary[disabled]:hover, .button.primary.disabled:focus, .button.primary[disabled]:focus { - background-color: #1779ba; + background-color: #c70338; color: #fefefe; } .button.primary:hover, .button.primary:focus { - background-color: rgb(18.4, 96.8, 148.8); + background-color: rgb(159.2, 2.4, 44.8); color: #fefefe; } .button.secondary, .button.secondary.disabled, .button.secondary[disabled], .button.secondary.disabled:hover, .button.secondary[disabled]:hover, .button.secondary.disabled:focus, .button.secondary[disabled]:focus { @@ -8208,20 +8208,20 @@ select:not([multiple]) { background-color: transparent; } .button.hollow, .button.hollow.disabled, .button.hollow[disabled], .button.hollow.disabled:hover, .button.hollow[disabled]:hover, .button.hollow.disabled:focus, .button.hollow[disabled]:focus { - border: 1px solid #1779ba; - color: #1779ba; + border: 1px solid #c70338; + color: #c70338; } .button.hollow:hover, .button.hollow:focus { - border-color: rgb(11.5, 60.5, 93); - color: rgb(11.5, 60.5, 93); + border-color: rgb(99.5, 1.5, 28); + color: rgb(99.5, 1.5, 28); } .button.hollow.primary, .button.hollow.primary.disabled, .button.hollow.primary[disabled], .button.hollow.primary.disabled:hover, .button.hollow.primary[disabled]:hover, .button.hollow.primary.disabled:focus, .button.hollow.primary[disabled]:focus { - border: 1px solid #1779ba; - color: #1779ba; + border: 1px solid #c70338; + color: #c70338; } .button.hollow.primary:hover, .button.hollow.primary:focus { - border-color: rgb(11.5, 60.5, 93); - color: rgb(11.5, 60.5, 93); + border-color: rgb(99.5, 1.5, 28); + color: rgb(99.5, 1.5, 28); } .button.hollow.secondary, .button.hollow.secondary.disabled, .button.hollow.secondary[disabled], .button.hollow.secondary.disabled:hover, .button.hollow.secondary[disabled]:hover, .button.hollow.secondary.disabled:focus, .button.hollow.secondary[disabled]:focus { border: 1px solid #767676; @@ -8260,16 +8260,16 @@ select:not([multiple]) { background-color: transparent; } .button.clear, .button.clear.disabled, .button.clear[disabled], .button.clear.disabled:hover, .button.clear[disabled]:hover, .button.clear.disabled:focus, .button.clear[disabled]:focus { - color: #1779ba; + color: #c70338; } .button.clear:hover, .button.clear:focus { - color: rgb(11.5, 60.5, 93); + color: rgb(99.5, 1.5, 28); } .button.clear.primary, .button.clear.primary.disabled, .button.clear.primary[disabled], .button.clear.primary.disabled:hover, .button.clear.primary[disabled]:hover, .button.clear.primary.disabled:focus, .button.clear.primary[disabled]:focus { - color: #1779ba; + color: #c70338; } .button.clear.primary:hover, .button.clear.primary:focus { - color: rgb(11.5, 60.5, 93); + color: rgb(99.5, 1.5, 28); } .button.clear.secondary, .button.clear.secondary.disabled, .button.clear.secondary[disabled], .button.clear.secondary.disabled:hover, .button.clear.secondary[disabled]:hover, .button.clear.secondary.disabled:focus, .button.clear.secondary[disabled]:focus { color: #767676; @@ -8315,10 +8315,10 @@ select:not([multiple]) { margin-left: 1em; } .button.dropdown.hollow::after, .button.dropdown.clear::after { - border-top-color: #1779ba; + border-top-color: #c70338; } .button.dropdown.hollow.primary::after, .button.dropdown.clear.primary::after { - border-top-color: #1779ba; + border-top-color: #c70338; } .button.dropdown.hollow.secondary::after, .button.dropdown.clear.secondary::after { border-top-color: #767676; diff --git a/app/assets/stylesheets/_settings.scss b/app/assets/stylesheets/_settings.scss index 9159004..aefc2fa 100644 --- a/app/assets/stylesheets/_settings.scss +++ b/app/assets/stylesheets/_settings.scss @@ -58,7 +58,7 @@ // 53. Title Bar // 54. Tooltip // 55. Top Bar -// 57. Xy Grid +// 56. Xy Grid @use "sass:color"; @import 'foundation-sites/scss/util/util'; @@ -70,21 +70,22 @@ $global-font-size: 100%; $global-width: rem-calc(1200); $global-lineheight: 1.5; $foundation-palette: ( - "primary": #1779ba, - "secondary": #767676, - "success": #3adb76, - "warning": #ffae00, - "alert": #cc4b37, + primary: #c70338, + secondary: #767676, + success: #3adb76, + warning: #ffae00, + alert: #cc4b37, ); $light-gray: #e6e6e6; $medium-gray: #cacaca; $dark-gray: #8a8a8a; $black: #0a0a0a; $white: #fefefe; -$body-background: $white; +// $body-background: $white; +$body-background: #f2f2f2; $body-font-color: $black; -$body-font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; -$body-safe-padding: false; +$body-font-family: 'Droid Sans', sans-serif; +// $body-font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; $body-antialiased: true; $global-margin: 1rem; $global-padding: 1rem; @@ -92,7 +93,8 @@ $global-position: 1rem; $global-weight-normal: normal; $global-weight-bold: bold; $global-radius: 0; -$global-menu-padding: 0.7rem 1rem; +$global-menu-padding: 0.3rem 0.5rem; +// $global-menu-padding: 0.7rem 1rem; $global-menu-nested-margin: 1rem; $global-text-direction: ltr; $global-flexbox: true; @@ -109,11 +111,11 @@ $print-hrefs: true; $-zf-size: null; $breakpoints: ( - "small": 0, - "medium": 640px, - "large": 1024px, - "xlarge": 1200px, - "xxlarge": 1440px, + small: 0, + medium: 640px, + large: 1024px, + xlarge: 1200px, + xxlarge: 1440px, ); $breakpoints-hidpi: ( "hidpi-1": 1, @@ -151,19 +153,19 @@ $header-margin-bottom: 0.5rem; $header-styles: ( small: ( 'h1': ('font-size': 24), - 'h2': ('font-size': 20), - 'h3': ('font-size': 19), - 'h4': ('font-size': 18), - 'h5': ('font-size': 17), - 'h6': ('font-size': 16), + 'h2': ('font-size': 16), + 'h3': ('font-size': 14), + 'h4': ('font-size': 13), + 'h5': ('font-size': 12), + 'h6': ('font-size': 11), ), medium: ( - 'h1': ('font-size': 48), - 'h2': ('font-size': 40), - 'h3': ('font-size': 31), - 'h4': ('font-size': 25), - 'h5': ('font-size': 20), - 'h6': ('font-size': 16), + 'h1': ('font-size': 40), + 'h2': ('font-size': 32), + 'h3': ('font-size': 28), + 'h4': ('font-size': 26), + 'h5': ('font-size': 24), + 'h6': ('font-size': 22), ), ); $header-text-rendering: optimizeLegibility; @@ -304,7 +306,8 @@ $button-background: $primary-color; $button-background-hover: scale-color($button-background, $lightness: -15%); $button-color: $white; $button-color-alt: $black; -$button-radius: $global-radius; +//$button-radius: $global-radius; +$button-radius: 0.5rem; $button-border: 1px solid transparent; $button-hollow-border-width: 1px; $button-sizes: ( @@ -464,7 +467,7 @@ $input-background-focus: $white; $input-background-disabled: $light-gray; $input-border: 1px solid $medium-gray; $input-border-focus: 1px solid $dark-gray; -$input-padding: $form-spacing * 0.5; +$input-padding: $form-spacing / 2; $input-shadow: inset 0 1px 2px rgba($black, 0.1); $input-shadow-focus: 0 0 5px $medium-gray; $input-cursor-disabled: not-allowed; @@ -502,6 +505,7 @@ $menu-item-color-active: $white; $menu-item-color-alt-active: $black; $menu-item-background-active: get-color(primary); $menu-icon-spacing: 0.25rem; +$menu-item-background-hover: $light-gray; $menu-state-back-compat: true; $menu-centered-back-compat: true; $menu-icons-back-compat: true; @@ -875,22 +879,23 @@ $tooltip-radius: $global-radius; // 55. Top Bar // ----------- -$topbar-padding: 0.5rem; -$topbar-background: $light-gray; +$topbar-padding: 0; +// $topbar-background: $light-gray; +$topbar-background: #d8d8d8; $topbar-submenu-background: $topbar-background; $topbar-title-spacing: 0.5rem 1rem 0.5rem 0; $topbar-input-width: 200px; $topbar-unstack-breakpoint: medium; -// 57. Xy Grid +// 56. Xy Grid // ----------- $xy-grid: true; $grid-container: $global-width; $grid-columns: 12; $grid-margin-gutters: ( - "small": 20px, - "medium": 30px + small: 20px, + medium: 30px ); $grid-padding-gutters: $grid-margin-gutters; $grid-container-padding: $grid-padding-gutters; diff --git a/bun.lockb b/bun.lockb index 5eb4b5fdc37668fa94fbda7e35bd05c6fa632d54..758423d17f994cab62b30fdfbea713fca9f969c4 100755 GIT binary patch delta 26 icmZ2Gjcx5TwuUW?w*@&E;|%pIO!W-6KNe*4sssRkO9-_9 delta 26 dcmZ2Gjcx5TwuUW?w*@(v7$9K#V?jo*N&s(p2Q2^q