1
0
mirror of https://github.com/cotes2020/jekyll-theme-chirpy.git synced 2025-10-20 09:43:36 +00:00

style: change css color functions to use modern notation

- `rgba()` → `rgb()`
This commit is contained in:
Cotes Chung 2025-07-27 21:39:00 +08:00
parent 648398c63c
commit 29bf95e9c7
No known key found for this signature in database
GPG Key ID: 0D9E54843167A808
8 changed files with 74 additions and 80 deletions

View File

@ -8,8 +8,6 @@
"property-no-vendor-prefix": null,
"selector-no-vendor-prefix": null,
"value-no-vendor-prefix": null,
"color-function-notation": "legacy",
"alpha-value-notation": "number",
"selector-not-notation": "simple",
"color-hex-length": "long",
"declaration-block-single-line-max-declarations": 3,

View File

@ -103,7 +103,7 @@ main {
width: 100%;
height: 100%;
position: absolute;
background-color: var(--card-hovor-bg);
background-color: var(--card-hover-bg);
opacity: 0;
transition: opacity 0.35s ease-in-out;
}
@ -349,7 +349,7 @@ main {
}
.disabled {
color: rgb(206, 196, 196);
color: rgb(206 196 196);
pointer-events: auto;
cursor: not-allowed;
}

View File

@ -66,7 +66,7 @@ code {
&.highlighter-rouge {
font-size: v.$code-font-size;
padding: 3px 5px;
word-break: break-word;
overflow-wrap: break-word;
border-radius: v.$radius-sm;
background-color: var(--inline-code-bg);
}
@ -243,7 +243,7 @@ div {
}
&:not([timeout]):hover {
background-color: rgba(128, 128, 128, 0.37);
background-color: rgb(128 128 128 / 37%);
i {
color: white;

View File

@ -238,7 +238,7 @@ main {
border-spacing: 0;
thead {
border-bottom: solid 2px rgba(210, 215, 217, 0.75);
border-bottom: solid 2px rgb(210 215 217 / 75%);
th {
@extend %table-cell;

View File

@ -41,7 +41,7 @@
border-radius: 0.5rem;
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
background-color: rgba(255, 255, 255, 0.5);
background-color: rgb(255 255 255 / 50%);
color: #1b1b1eba;
position: fixed;
left: 50%;

View File

@ -160,7 +160,7 @@
cursor: not-allowed;
.page-link {
color: rgba(108, 117, 125, 0.57);
color: rgb(108 117 125 / 57%);
}
}
} /* .page-item */

View File

@ -2,33 +2,33 @@
color-scheme: dark;
/* Framework color */
--main-bg: rgb(27, 27, 30);
--mask-bg: rgb(68, 69, 70);
--main-border-color: rgb(44, 45, 45);
--main-bg: rgb(27 27 30);
--mask-bg: rgb(68 69 70);
--main-border-color: rgb(44 45 45);
/* Common color */
--text-color: rgb(175, 176, 177);
--text-color: rgb(175 176 177);
--text-muted-color: #868686;
--text-muted-highlight-color: #aeaeae;
--heading-color: #cccccc;
--label-color: #a7a7a7;
--blockquote-border-color: rgb(66, 66, 66);
--blockquote-border-color: rgb(66 66 66);
--blockquote-text-color: #868686;
--link-color: rgb(138, 180, 248);
--link-underline-color: rgb(82, 108, 150);
--link-color: rgb(138 180 248);
--link-underline-color: rgb(82 108 150);
--button-bg: #1e1e1e;
--btn-border-color: #2e2f31;
--btn-backtotop-color: var(--text-color);
--btn-backtotop-border-color: #212122;
--card-header-bg: #292929;
--checkbox-color: rgb(118, 120, 121);
--checkbox-color: rgb(118 120 121);
--checkbox-checked-color: var(--link-color);
--img-bg: radial-gradient(circle, rgb(22, 22, 24) 0%, rgb(32, 32, 32) 100%);
--img-bg: radial-gradient(circle, rgb(22 22 24) 0%, rgb(32 32 32) 100%);
--shimmer-bg: linear-gradient(
90deg,
rgba(255, 255, 255, 0) 0%,
rgba(58, 55, 55, 0.4) 50%,
rgba(255, 255, 255, 0) 100%
rgb(255 255 255 / 0%) 0%,
rgb(58 55 55 / 40%) 50%,
rgb(255 255 255 / 0%) 100%
);
/* Sidebar */
@ -37,65 +37,65 @@
--sidebar-bg: #1e1e1e;
--sidebar-border-color: #292929;
--sidebar-muted-color: #868686;
--sidebar-active-color: rgb(255, 255, 255, 0.95);
--sidebar-active-color: rgb(255 255 255 / 95%);
--sidebar-hover-bg: #262626;
--sidebar-btn-bg: #232328;
--sidebar-btn-color: #787878;
--avatar-border-color: rgb(206, 206, 206, 0.9);
--avatar-border-color: rgb(206 206 206 / 90%);
/* Topbar */
--topbar-bg: rgb(27, 27, 30, 0.64);
--topbar-bg: rgb(27 27 30 / 64%);
--topbar-text-color: var(--text-color);
--search-border-color: rgb(55, 55, 55);
--search-icon-color: rgb(100, 102, 105);
--input-focus-border-color: rgb(112, 114, 115);
--search-border-color: rgb(55 55 55);
--search-icon-color: rgb(100 102 105);
--input-focus-border-color: rgb(112 114 115);
/* Home page */
--post-list-text-color: rgb(175, 176, 177);
--post-list-text-color: rgb(175 176 177);
--btn-patinator-text-color: var(--text-color);
--btn-paginator-hover-color: #2e2e2e;
/* Posts */
--toc-highlight: rgb(116, 178, 243);
--toc-highlight: rgb(116 178 243);
--toc-popup-border-color: #373737;
--tag-hover: rgb(43, 56, 62);
--tag-hover: rgb(43 56 62);
--tb-odd-bg: #252526; /* odd rows of the posts' table */
--tb-even-bg: rgb(31, 31, 34); /* even rows of the posts' table */
--tb-even-bg: rgb(31 31 34); /* even rows of the posts' table */
--tb-border-color: var(--tb-odd-bg);
--footnote-target-bg: rgb(63, 81, 181);
--footnote-target-bg: rgb(63 81 181);
--btn-share-color: #6c757d;
--btn-share-hover-color: #bfc1ca;
--card-bg: #1e1e1e;
--card-hovor-bg: #464d51;
--card-shadow: rgb(21, 21, 21, 0.72) 0 6px 18px 0,
rgb(137, 135, 135, 0.24) 0 0 0 1px;
--card-hover-bg: #464d51;
--card-shadow: rgb(21 21 21 / 72%) 0 6px 18px 0,
rgb(137 135 135 / 24%) 0 0 0 1px;
--kbd-wrap-color: #6a6a6a;
--kbd-text-color: #d3d3d3;
--kbd-bg-color: #242424;
--prompt-text-color: rgb(216, 212, 212, 0.75);
--prompt-tip-bg: rgb(22, 60, 36, 0.64);
--prompt-tip-icon-color: rgb(15, 164, 15, 0.81);
--prompt-info-bg: rgb(7, 59, 104, 0.8);
--prompt-text-color: rgb(216 212 212 / 75%);
--prompt-tip-bg: rgb(22 60 36 / 64%);
--prompt-tip-icon-color: rgb(15 164 15 / 81%);
--prompt-info-bg: rgb(7 59 104 / 80%);
--prompt-info-icon-color: #0075d1;
--prompt-warning-bg: rgb(90, 69, 3, 0.88);
--prompt-warning-icon-color: rgb(255, 165, 0, 0.8);
--prompt-danger-bg: rgb(86, 28, 8, 0.8);
--prompt-warning-bg: rgb(90 69 3 / 88%);
--prompt-warning-icon-color: rgb(255 165 0 / 80%);
--prompt-danger-bg: rgb(86 28 8 / 80%);
--prompt-danger-icon-color: #cd0202;
/* Tags */
--tag-border: rgb(59, 79, 88);
--tag-shadow: rgb(32, 33, 33);
--dash-color: rgb(63, 65, 68);
--tag-border: rgb(59 79 88);
--tag-shadow: rgb(32 33 33);
--dash-color: rgb(63 65 68);
--search-tag-bg: #292828;
/* Categories */
--categories-border: rgb(64, 66, 69, 0.5);
--categories-hover-bg: rgb(73, 75, 76);
--categories-border: rgb(64 66 69 / 50%);
--categories-hover-bg: rgb(73 75 76);
--categories-icon-hover-color: white;
/* Archive */
--timeline-node-bg: rgb(150, 152, 156);
--timeline-color: rgb(63, 65, 68);
--timeline-node-bg: rgb(150 152 156);
--timeline-color: rgb(63 65 68);
--timeline-year-dot-color: var(--timeline-color);
/* Code highlight colors */
@ -103,7 +103,7 @@
--highlight-bg-color: #151515;
--highlighter-rouge-color: #c9def1;
--highlight-lineno-color: #808080;
--inline-code-bg: rgba(255, 255, 255, 0.05);
--inline-code-bg: rgb(255 255 255 / 5%);
--code-color: #b0b0b0;
--code-header-text-color: #6a6a6a;
--code-header-muted-color: #353535;
@ -141,11 +141,11 @@
#archives li:nth-child(odd) {
background-image: linear-gradient(
to left,
rgb(26, 26, 30),
rgb(39, 39, 45),
rgb(39, 39, 45),
rgb(39, 39, 45),
rgb(26, 26, 30)
rgb(26 26 30),
rgb(39 39 45),
rgb(39 39 45),
rgb(39 39 45),
rgb(26 26 30)
);
}

View File

@ -20,34 +20,30 @@
--btn-backtotop-border-color: #f1f1f1;
--checkbox-color: #c5c5c5;
--checkbox-checked-color: #07a8f7;
--img-bg: radial-gradient(
circle,
rgb(255, 255, 255) 0%,
rgb(239, 239, 239) 100%
);
--img-bg: radial-gradient(circle, rgb(255 255 255) 0%, rgb(239 239 239) 100%);
--shimmer-bg: linear-gradient(
90deg,
rgba(250, 250, 250, 0) 0%,
rgba(232, 230, 230, 1) 50%,
rgba(250, 250, 250, 0) 100%
rgb(250 250 250 / 0%) 0%,
rgb(232 230 230 / 100%) 50%,
rgb(250 250 250 / 0%) 100%
);
/* Sidebar */
--site-title-color: rgb(113, 113, 113);
--site-title-color: rgb(113 113 113);
--site-subtitle-color: #717171;
--sidebar-bg: #f6f8fa;
--sidebar-border-color: #efefef;
--sidebar-muted-color: #545454;
--sidebar-active-color: #1d1d1d;
--sidebar-hover-bg: rgb(223, 233, 241, 0.64);
--sidebar-hover-bg: rgb(223 233 241 / 64%);
--sidebar-btn-bg: white;
--sidebar-btn-color: #8e8e8e;
--avatar-border-color: white;
/* Topbar */
--topbar-bg: rgb(255, 255, 255, 0.7);
--topbar-text-color: rgb(78, 78, 78);
--search-border-color: rgb(240, 240, 240);
--topbar-bg: rgb(255 255 255 / 70%);
--topbar-text-color: rgb(78 78 78);
--search-border-color: rgb(240 240 240);
--search-icon-color: #c2c6cc;
--input-focus-border-color: #b8b8b8;
@ -62,9 +58,9 @@
--btn-share-color: gray;
--btn-share-hover-color: #0d6efd;
--card-bg: white;
--card-hovor-bg: #e2e2e2;
--card-shadow: rgb(104, 104, 104, 0.05) 0 2px 6px 0,
rgba(211, 209, 209, 0.15) 0 0 0 1px;
--card-hover-bg: #e2e2e2;
--card-shadow: rgb(104 104 104 / 5%) 0 2px 6px 0,
rgb(211 209 209 / 15%) 0 0 0 1px;
--footnote-target-bg: lightcyan;
--tb-odd-bg: #fbfcfd;
--tb-border-color: #eaeaea;
@ -72,29 +68,29 @@
--kbd-wrap-color: #bdbdbd;
--kbd-text-color: var(--text-color);
--kbd-bg-color: white;
--prompt-text-color: rgb(46, 46, 46, 0.77);
--prompt-tip-bg: rgb(123, 247, 144, 0.2);
--prompt-text-color: rgb(46 46 46 / 77%);
--prompt-tip-bg: rgb(123 247 144 / 20%);
--prompt-tip-icon-color: #03b303;
--prompt-info-bg: #e1f5fe;
--prompt-info-icon-color: #0070cb;
--prompt-warning-bg: rgb(255, 243, 205);
--prompt-warning-bg: rgb(255 243 205);
--prompt-warning-icon-color: #ef9c03;
--prompt-danger-bg: rgb(248, 215, 218, 0.56);
--prompt-danger-bg: rgb(248 215 218 / 56%);
--prompt-danger-icon-color: #df3c30;
/* Tags */
--tag-border: #dee2e6;
--tag-shadow: var(--btn-border-color);
--tag-hover: rgb(222, 226, 230);
--tag-hover: rgb(222 226 230);
--search-tag-bg: #f8f9fa;
/* Categories */
--categories-border: rgba(0, 0, 0, 0.125);
--categories-border: rgb(0 0 0 / 12.5%);
--categories-hover-bg: var(--btn-border-color);
--categories-icon-hover-color: darkslategray;
/* Archive */
--timeline-color: rgba(0, 0, 0, 0.075);
--timeline-color: rgb(0 0 0 / 7.5%);
--timeline-node-bg: #c2c6cc;
--timeline-year-dot-color: #ffffff;
@ -103,7 +99,7 @@
--highlight-bg-color: #f6f8fa;
--highlighter-rouge-color: #3f596f;
--highlight-lineno-color: #9e9e9e;
--inline-code-bg: rgba(25, 25, 28, 0.05);
--inline-code-bg: rgb(25 25 28 / 5%);
--code-color: #3a3a3a;
--code-header-text-color: #a3a3a3;
--code-header-muted-color: #e5e5e5;
@ -111,7 +107,7 @@
--clipboard-checked-color: #43c743;
[class^='prompt-'] {
--link-underline-color: rgb(219, 216, 216);
--link-underline-color: rgb(219 216 216);
}
.dark {