diff --git a/changedetectionio/static/styles/diff.css b/changedetectionio/static/styles/diff.css index 394aa4fc..43887289 100644 --- a/changedetectionio/static/styles/diff.css +++ b/changedetectionio/static/styles/diff.css @@ -18,6 +18,8 @@ --color-grey-850: #eee; --color-grey-900: #f2f2f2; --color-black: #000; + --color-dark-red: #a00; + --color-light-red: #dd0000; --color-background-page: var(--color-grey-100); --color-background-gradient-first: #5ad8f7; --color-background-gradient-second: #2f50af; @@ -27,9 +29,9 @@ --color-link: #1b98f8; --color-menu-accent: #ed5900; --color-background-code: var(--color-grey-850); - --color-error: #a00; + --color-error: var(--color-dark-red); --color-error-input: #ffebeb; - --color-error-list: #dd0000; + --color-error-list: var(--color-light-red); --color-table-background: var(--color-background); --color-table-stripe: var(--color-grey-900); --color-text-tab: var(--color-white); @@ -84,7 +86,8 @@ --color-text-menu-link-hover: var(--color-grey-300); --color-shadow-jump: var(--color-grey-500); --color-icon-github: var(--color-black); - --color-icon-github-hover: var(--color-grey-300); } + --color-icon-github-hover: var(--color-grey-300); + --color-watch-table-error: var(--color-dark-red); } html[data-darkmode="true"] { --color-link: #59bdfb; @@ -114,7 +117,8 @@ html[data-darkmode="true"] { --color-background-snapshot-age: var(--color-grey-200); --color-shadow-jump: var(--color-grey-200); --color-icon-github: var(--color-white); - --color-icon-github-hover: var(--color-grey-700); } + --color-icon-github-hover: var(--color-grey-700); + --color-watch-table-error: var(--color-light-red); } html[data-darkmode="true"] .watch-controls img { opacity: 0.4; } html[data-darkmode="true"] .icon-spread { diff --git a/changedetectionio/static/styles/scss/parts/_variables.scss b/changedetectionio/static/styles/scss/parts/_variables.scss index ba6c8423..983debd2 100644 --- a/changedetectionio/static/styles/scss/parts/_variables.scss +++ b/changedetectionio/static/styles/scss/parts/_variables.scss @@ -19,6 +19,8 @@ --color-grey-850: #eee; --color-grey-900: #f2f2f2; --color-black: #000; + --color-dark-red: #a00; + --color-light-red: #dd0000; --color-background-page: var(--color-grey-100); --color-background-gradient-first: #5ad8f7; @@ -29,9 +31,9 @@ --color-link: #1b98f8; --color-menu-accent: #ed5900; --color-background-code: var(--color-grey-850); - --color-error: #a00; + --color-error: var(--color-dark-red); --color-error-input: #ffebeb; - --color-error-list: #dd0000; + --color-error-list: var(--color-light-red); --color-table-background: var(--color-background); --color-table-stripe: var(--color-grey-900); --color-text-tab: var(--color-white); @@ -96,6 +98,8 @@ --color-shadow-jump: var(--color-grey-500); --color-icon-github: var(--color-black); --color-icon-github-hover: var(--color-grey-300); + + --color-watch-table-error: var(--color-dark-red); } html[data-darkmode="true"] { @@ -133,6 +137,7 @@ html[data-darkmode="true"] { --color-shadow-jump: var(--color-grey-200); --color-icon-github: var(--color-white); --color-icon-github-hover: var(--color-grey-700); + --color-watch-table-error: var(--color-light-red); // Anything that can't be manipulated through variables follows. .watch-controls { diff --git a/changedetectionio/static/styles/scss/styles.scss b/changedetectionio/static/styles/scss/styles.scss index 82c11010..e62305fe 100644 --- a/changedetectionio/static/styles/scss/styles.scss +++ b/changedetectionio/static/styles/scss/styles.scss @@ -126,7 +126,7 @@ code { } .error { - color: var(--color-error); + color: var(--color-watch-table-error); } td { diff --git a/changedetectionio/static/styles/styles.css b/changedetectionio/static/styles/styles.css index 3a7dbfd5..8a54e8d7 100644 --- a/changedetectionio/static/styles/styles.css +++ b/changedetectionio/static/styles/styles.css @@ -21,6 +21,8 @@ --color-grey-850: #eee; --color-grey-900: #f2f2f2; --color-black: #000; + --color-dark-red: #a00; + --color-light-red: #dd0000; --color-background-page: var(--color-grey-100); --color-background-gradient-first: #5ad8f7; --color-background-gradient-second: #2f50af; @@ -30,9 +32,9 @@ --color-link: #1b98f8; --color-menu-accent: #ed5900; --color-background-code: var(--color-grey-850); - --color-error: #a00; + --color-error: var(--color-dark-red); --color-error-input: #ffebeb; - --color-error-list: #dd0000; + --color-error-list: var(--color-light-red); --color-table-background: var(--color-background); --color-table-stripe: var(--color-grey-900); --color-text-tab: var(--color-white); @@ -87,7 +89,8 @@ --color-text-menu-link-hover: var(--color-grey-300); --color-shadow-jump: var(--color-grey-500); --color-icon-github: var(--color-black); - --color-icon-github-hover: var(--color-grey-300); } + --color-icon-github-hover: var(--color-grey-300); + --color-watch-table-error: var(--color-dark-red); } html[data-darkmode="true"] { --color-link: #59bdfb; @@ -117,7 +120,8 @@ html[data-darkmode="true"] { --color-background-snapshot-age: var(--color-grey-200); --color-shadow-jump: var(--color-grey-200); --color-icon-github: var(--color-white); - --color-icon-github-hover: var(--color-grey-700); } + --color-icon-github-hover: var(--color-grey-700); + --color-watch-table-error: var(--color-light-red); } html[data-darkmode="true"] .watch-controls img { opacity: 0.4; } html[data-darkmode="true"] .icon-spread { @@ -334,7 +338,7 @@ code { .watch-table tr.unviewed { font-weight: bold; } .watch-table .error { - color: var(--color-error); } + color: var(--color-watch-table-error); } .watch-table td { white-space: nowrap; } .watch-table td.title-col {