From 05780c90268145ecf472c404a221068781e18c9b Mon Sep 17 00:00:00 2001 From: aforcada Date: Mon, 6 Mar 2023 19:35:47 +0100 Subject: [PATCH 1/4] Add buttons hover text color --- src/cookieconsent.css | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/cookieconsent.css b/src/cookieconsent.css index d4de657f..89bd0e35 100644 --- a/src/cookieconsent.css +++ b/src/cookieconsent.css @@ -6,9 +6,11 @@ --cc-btn-primary-bg: #2d4156; --cc-btn-primary-text: var(--cc-bg); --cc-btn-primary-hover-bg: #1d2e38; + --cc-btn-primary-hover-text: var(--cc-btn-primary-text); --cc-btn-secondary-bg: #eaeff2; --cc-btn-secondary-text: var(--cc-text); --cc-btn-secondary-hover-bg: #d8e0e6; + --cc-btn-secondary-hover-text: var(--cc-btn-secondary-text); --cc-btn-border-radius: 4px; --cc-toggle-bg-off: #919ea6; --cc-toggle-bg-on: var(--cc-btn-primary-bg); @@ -32,9 +34,11 @@ --cc-btn-primary-bg: #a6c4dd; --cc-btn-primary-text: #000; --cc-btn-primary-hover-bg: #c2dff7; + --cc-btn-primary-hover-text: var(--cc-btn-primary-text); --cc-btn-secondary-bg: #33383c; --cc-btn-secondary-text: var(--cc-text); --cc-btn-secondary-hover-bg: #3e454a; + --cc-btn-secondary-hover-text: var(--cc-btn-secondary-text); --cc-toggle-bg-off: #667481; --cc-toggle-bg-on: var(--cc-btn-primary-bg); --cc-toggle-bg-readonly: #454c54; @@ -288,6 +292,7 @@ #s-c-bn:active, #s-c-bn:hover{ background: var(--cc-btn-secondary-hover-bg); + color: var(--cc-btn-secondary-hover-text); } /** @@ -531,11 +536,13 @@ CookieConsent settings modal #c-bns.swap button:last-child:active, #c-bns.swap button:last-child:hover{ background: var(--cc-btn-primary-hover-bg); + color: var(--cc-btn-primary-hover-text); } #c-bns.swap button:first-child:active, #c-bns.swap button:first-child:hover{ background: var(--cc-btn-secondary-hover-bg); + color: var(--cc-btn-secondary-hover-text); } #s-hdr{ From 6bf674a32d8d9c10aee9d54af45fb93298265d60 Mon Sep 17 00:00:00 2001 From: aforcada Date: Mon, 6 Mar 2023 20:54:33 +0100 Subject: [PATCH 2/4] Add overlay opacity css variable --- src/cookieconsent.css | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/cookieconsent.css b/src/cookieconsent.css index 89bd0e35..a72a88e6 100644 --- a/src/cookieconsent.css +++ b/src/cookieconsent.css @@ -22,7 +22,8 @@ --cc-cookie-category-block-bg-hover: #e9eff4; --cc-section-border: #f1f3f5; --cc-cookie-table-border: #e9edf2; - --cc-overlay-bg: rgba(4, 6, 8, .85); + --cc-overlay-bg: rgb(4, 6, 8); + --cc-overlay-opacity: .85; --cc-webkit-scrollbar-bg: #cfd5db; --cc-webkit-scrollbar-bg-hover: #9199a0; } @@ -211,7 +212,7 @@ .force--consent.show--consent .c--anim #cm-ov, .show--settings .c--anim #cs-ov{ visibility: visible!important; - opacity: 1!important; + opacity: var(--cc-overlay-opacity)!important; } #cm{ From e7833bed400917096d8e2cb5adc241c790d5431d Mon Sep 17 00:00:00 2001 From: aforcada Date: Tue, 7 Mar 2023 09:33:38 +0100 Subject: [PATCH 3/4] Font family css variable --- src/cookieconsent.css | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/cookieconsent.css b/src/cookieconsent.css index a72a88e6..c37160de 100644 --- a/src/cookieconsent.css +++ b/src/cookieconsent.css @@ -1,5 +1,6 @@ /** Light color-scheme **/ :root{ + --cc-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; --cc-bg: #fff; --cc-text: #2d4156; --cc-border-radius: .35em; @@ -88,7 +89,7 @@ .cc_div { font-size: 16px; font-weight: 400; - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + font-family: var(--cc-font-family); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; From 96d5225e2c59415d5bd3bef776d8536dd13efaa7 Mon Sep 17 00:00:00 2001 From: aforcada Date: Tue, 7 Mar 2023 23:29:50 +0100 Subject: [PATCH 4/4] font size and consent modal box shadow css variables --- src/cookieconsent.css | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/cookieconsent.css b/src/cookieconsent.css index c37160de..c8369aa8 100644 --- a/src/cookieconsent.css +++ b/src/cookieconsent.css @@ -1,6 +1,7 @@ /** Light color-scheme **/ :root{ --cc-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + --cc-font-size: 16px; --cc-bg: #fff; --cc-text: #2d4156; --cc-border-radius: .35em; @@ -25,6 +26,7 @@ --cc-cookie-table-border: #e9edf2; --cc-overlay-bg: rgb(4, 6, 8); --cc-overlay-opacity: .85; + --cc-consent-modal-box-shadow: 0 0.625em 1.875em rgba(2, 2, 3, 0.28); --cc-webkit-scrollbar-bg: #cfd5db; --cc-webkit-scrollbar-bg-hover: #9199a0; } @@ -87,7 +89,7 @@ } .cc_div { - font-size: 16px; + font-size: var(--cc-font-size); font-weight: 400; font-family: var(--cc-font-family); -webkit-font-smoothing: antialiased; @@ -227,7 +229,7 @@ bottom: 1.250em; right: 1.250em; box-shadow: 0 0.625em 1.875em #000000; - box-shadow: 0 0.625em 1.875em rgba(2, 2, 3, 0.28); + box-shadow: var(--cc-consent-modal-box-shadow); opacity: 0; visibility: hidden; transform: scale(.95);