From 96007ea6236b0bae766102764d1712da7ec89054 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nil=C3=A9ane?= Date: Tue, 25 Jul 2023 02:17:42 +0200 Subject: [PATCH 1/3] Color adjustments, especially for the dark palettes --- TangerineUI-purple.css | 17 +++++++++-------- TangerineUI.css | 13 +++++++------ .../layout-single-column.scss | 17 +++++++++-------- .../tangerineui/layout-single-column.scss | 13 +++++++------ 4 files changed, 32 insertions(+), 28 deletions(-) diff --git a/TangerineUI-purple.css b/TangerineUI-purple.css index 7712a70..5b19ef5 100644 --- a/TangerineUI-purple.css +++ b/TangerineUI-purple.css @@ -39,23 +39,23 @@ --color-bg: #000000; --color-fg: #d6d2e0; --color-fg-muted: #655e6e; - --color-secondary-bg: #0c0c0d; + --color-secondary-bg: #1e162b; --color-secondary-separator: #26232e; - --color-content-bg: #111111; + --color-content-bg: #1a1a1a; --color-content-fg: #f2f2f2; --color-content-fg-bold: #ffffff; --color-content-fg-muted: #737373; - --color-content-secondary-bg: #1f1b22; + --color-content-secondary-bg: #22212f; --color-content-secondary-separator: rgba(64, 62, 89, 0.4); - --color-content-bg-focus: #181818; + --color-content-bg-focus: #222222; --color-accent: #7a7af9; --color-accent-focus: #5a47ff; --color-accent-bg: #261f3c; --color-accent-fg: #ffffff; - --color-lines: var(--color-content-secondary-bg); + --color-lines: var(--color-content-secondary-separator); } } :root { @@ -1237,8 +1237,8 @@ body.layout-single-column { .layout-single-column .account__section-headline button:hover, .layout-single-column .notification__filter-bar a:hover, .layout-single-column .notification__filter-bar button:hover { - background-color: var(--color-content-bg); - color: var(--color-content-fg); + background-color: var(--color-lines); + color: var(--color-accent); box-shadow: 0 0 0 4px var(--color-accent-bg) inset; } .layout-single-column .account__section-headline a.active, @@ -1744,6 +1744,7 @@ body.layout-single-column { /* 📰 Trending stories */ .layout-single-column .story { background-color: var(--color-content-bg); + transition: background-color .2s; } .layout-single-column .story:not(:last-child) { border-bottom: 2px solid var(--color-content-secondary-separator); @@ -1753,7 +1754,7 @@ body.layout-single-column { color: var(--color-content-fg); } .layout-single-column .story:hover { - background-color: var(--color-accent-bg); + background-color: var(--color-content-bg-focus); } .layout-single-column .story__details__publisher, .layout-single-column .story__details__shared { diff --git a/TangerineUI.css b/TangerineUI.css index dcc31f3..43ce538 100644 --- a/TangerineUI.css +++ b/TangerineUI.css @@ -39,16 +39,16 @@ --color-bg: #000000; --color-fg: #e0d6d1; --color-fg-muted: #6e635e; - --color-secondary-bg: #0d0c0c; + --color-secondary-bg: #282015; --color-secondary-separator: #25201c; - --color-content-bg: #111111; + --color-content-bg: #1a1a1a; --color-content-fg: #f2f2f2; --color-content-fg-bold: #ffffff; --color-content-fg-muted: #737373; --color-content-secondary-bg: #292623; --color-content-secondary-separator: rgba(77, 73, 70, 0.4); - --color-content-bg-focus: #181818; + --color-content-bg-focus: #222222; --color-accent: #e68933; --color-accent-focus: #ffa047; @@ -1237,8 +1237,8 @@ body.layout-single-column { .layout-single-column .account__section-headline button:hover, .layout-single-column .notification__filter-bar a:hover, .layout-single-column .notification__filter-bar button:hover { - background-color: var(--color-content-bg); - color: var(--color-content-fg); + background-color: var(--color-lines); + color: var(--color-accent); box-shadow: 0 0 0 4px var(--color-accent-bg) inset; } .layout-single-column .account__section-headline a.active, @@ -1744,6 +1744,7 @@ body.layout-single-column { /* 📰 Trending stories */ .layout-single-column .story { background-color: var(--color-content-bg); + transition: background-color .2s; } .layout-single-column .story:not(:last-child) { border-bottom: 2px solid var(--color-content-secondary-separator); @@ -1753,7 +1754,7 @@ body.layout-single-column { color: var(--color-content-fg); } .layout-single-column .story:hover { - background-color: var(--color-accent-bg); + background-color: var(--color-content-bg-focus); } .layout-single-column .story__details__publisher, .layout-single-column .story__details__shared { diff --git a/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss b/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss index 7712a70..5b19ef5 100644 --- a/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss +++ b/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss @@ -39,23 +39,23 @@ --color-bg: #000000; --color-fg: #d6d2e0; --color-fg-muted: #655e6e; - --color-secondary-bg: #0c0c0d; + --color-secondary-bg: #1e162b; --color-secondary-separator: #26232e; - --color-content-bg: #111111; + --color-content-bg: #1a1a1a; --color-content-fg: #f2f2f2; --color-content-fg-bold: #ffffff; --color-content-fg-muted: #737373; - --color-content-secondary-bg: #1f1b22; + --color-content-secondary-bg: #22212f; --color-content-secondary-separator: rgba(64, 62, 89, 0.4); - --color-content-bg-focus: #181818; + --color-content-bg-focus: #222222; --color-accent: #7a7af9; --color-accent-focus: #5a47ff; --color-accent-bg: #261f3c; --color-accent-fg: #ffffff; - --color-lines: var(--color-content-secondary-bg); + --color-lines: var(--color-content-secondary-separator); } } :root { @@ -1237,8 +1237,8 @@ body.layout-single-column { .layout-single-column .account__section-headline button:hover, .layout-single-column .notification__filter-bar a:hover, .layout-single-column .notification__filter-bar button:hover { - background-color: var(--color-content-bg); - color: var(--color-content-fg); + background-color: var(--color-lines); + color: var(--color-accent); box-shadow: 0 0 0 4px var(--color-accent-bg) inset; } .layout-single-column .account__section-headline a.active, @@ -1744,6 +1744,7 @@ body.layout-single-column { /* 📰 Trending stories */ .layout-single-column .story { background-color: var(--color-content-bg); + transition: background-color .2s; } .layout-single-column .story:not(:last-child) { border-bottom: 2px solid var(--color-content-secondary-separator); @@ -1753,7 +1754,7 @@ body.layout-single-column { color: var(--color-content-fg); } .layout-single-column .story:hover { - background-color: var(--color-accent-bg); + background-color: var(--color-content-bg-focus); } .layout-single-column .story__details__publisher, .layout-single-column .story__details__shared { diff --git a/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss b/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss index dcc31f3..43ce538 100644 --- a/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss +++ b/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss @@ -39,16 +39,16 @@ --color-bg: #000000; --color-fg: #e0d6d1; --color-fg-muted: #6e635e; - --color-secondary-bg: #0d0c0c; + --color-secondary-bg: #282015; --color-secondary-separator: #25201c; - --color-content-bg: #111111; + --color-content-bg: #1a1a1a; --color-content-fg: #f2f2f2; --color-content-fg-bold: #ffffff; --color-content-fg-muted: #737373; --color-content-secondary-bg: #292623; --color-content-secondary-separator: rgba(77, 73, 70, 0.4); - --color-content-bg-focus: #181818; + --color-content-bg-focus: #222222; --color-accent: #e68933; --color-accent-focus: #ffa047; @@ -1237,8 +1237,8 @@ body.layout-single-column { .layout-single-column .account__section-headline button:hover, .layout-single-column .notification__filter-bar a:hover, .layout-single-column .notification__filter-bar button:hover { - background-color: var(--color-content-bg); - color: var(--color-content-fg); + background-color: var(--color-lines); + color: var(--color-accent); box-shadow: 0 0 0 4px var(--color-accent-bg) inset; } .layout-single-column .account__section-headline a.active, @@ -1744,6 +1744,7 @@ body.layout-single-column { /* 📰 Trending stories */ .layout-single-column .story { background-color: var(--color-content-bg); + transition: background-color .2s; } .layout-single-column .story:not(:last-child) { border-bottom: 2px solid var(--color-content-secondary-separator); @@ -1753,7 +1754,7 @@ body.layout-single-column { color: var(--color-content-fg); } .layout-single-column .story:hover { - background-color: var(--color-accent-bg); + background-color: var(--color-content-bg-focus); } .layout-single-column .story__details__publisher, .layout-single-column .story__details__shared { From c6a42c0dd75c0058ef02fa470a2c24c6acc5d4b2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nil=C3=A9ane?= Date: Tue, 25 Jul 2023 02:27:28 +0200 Subject: [PATCH 2/3] Fixed report modals --- TangerineUI-purple.css | 28 +++++++++++++++++++ TangerineUI.css | 28 +++++++++++++++++++ .../layout-single-column.scss | 28 +++++++++++++++++++ .../tangerineui/layout-single-column.scss | 28 +++++++++++++++++++ 4 files changed, 112 insertions(+) diff --git a/TangerineUI-purple.css b/TangerineUI-purple.css index 5b19ef5..a83c152 100644 --- a/TangerineUI-purple.css +++ b/TangerineUI-purple.css @@ -2352,6 +2352,34 @@ body.layout-single-column { } } + +/* Report modals */ +.layout-single-column .report-dialog-modal__container { + border-top: 0; +} +.layout-single-column .report-dialog-modal__lead { + color: var(--color-content-fg-muted); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option { + border-color: var(--color-lines); + border-width: 3px; +} +.layout-single-column .report-dialog-modal .dialog-option .poll__input { + border-color: var(--color-accent); +} +.layout-single-column .report-dialog-modal .dialog-option .poll__input.active { + border-color: var(--color-accent); + background-color: var(--color-accent); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option>.poll__option__text { + color: var(--color-content-fg); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option>.poll__option__text strong { + color: var(--color-content-fg-bold) +} + + + /* đŸ–ŧī¸ Picture in Picture */ .layout-single-column .picture-in-picture { box-shadow: 0 0 5px rgba(0, 0, 0, .2); diff --git a/TangerineUI.css b/TangerineUI.css index 43ce538..fb703cd 100644 --- a/TangerineUI.css +++ b/TangerineUI.css @@ -2352,6 +2352,34 @@ body.layout-single-column { } } + +/* Report modals */ +.layout-single-column .report-dialog-modal__container { + border-top: 0; +} +.layout-single-column .report-dialog-modal__lead { + color: var(--color-content-fg-muted); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option { + border-color: var(--color-lines); + border-width: 3px; +} +.layout-single-column .report-dialog-modal .dialog-option .poll__input { + border-color: var(--color-accent); +} +.layout-single-column .report-dialog-modal .dialog-option .poll__input.active { + border-color: var(--color-accent); + background-color: var(--color-accent); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option>.poll__option__text { + color: var(--color-content-fg); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option>.poll__option__text strong { + color: var(--color-content-fg-bold) +} + + + /* đŸ–ŧī¸ Picture in Picture */ .layout-single-column .picture-in-picture { box-shadow: 0 0 5px rgba(0, 0, 0, .2); diff --git a/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss b/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss index 5b19ef5..a83c152 100644 --- a/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss +++ b/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss @@ -2352,6 +2352,34 @@ body.layout-single-column { } } + +/* Report modals */ +.layout-single-column .report-dialog-modal__container { + border-top: 0; +} +.layout-single-column .report-dialog-modal__lead { + color: var(--color-content-fg-muted); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option { + border-color: var(--color-lines); + border-width: 3px; +} +.layout-single-column .report-dialog-modal .dialog-option .poll__input { + border-color: var(--color-accent); +} +.layout-single-column .report-dialog-modal .dialog-option .poll__input.active { + border-color: var(--color-accent); + background-color: var(--color-accent); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option>.poll__option__text { + color: var(--color-content-fg); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option>.poll__option__text strong { + color: var(--color-content-fg-bold) +} + + + /* đŸ–ŧī¸ Picture in Picture */ .layout-single-column .picture-in-picture { box-shadow: 0 0 5px rgba(0, 0, 0, .2); diff --git a/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss b/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss index 43ce538..fb703cd 100644 --- a/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss +++ b/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss @@ -2352,6 +2352,34 @@ body.layout-single-column { } } + +/* Report modals */ +.layout-single-column .report-dialog-modal__container { + border-top: 0; +} +.layout-single-column .report-dialog-modal__lead { + color: var(--color-content-fg-muted); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option { + border-color: var(--color-lines); + border-width: 3px; +} +.layout-single-column .report-dialog-modal .dialog-option .poll__input { + border-color: var(--color-accent); +} +.layout-single-column .report-dialog-modal .dialog-option .poll__input.active { + border-color: var(--color-accent); + background-color: var(--color-accent); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option>.poll__option__text { + color: var(--color-content-fg); +} +.layout-single-column .report-dialog-modal .poll__option.dialog-option>.poll__option__text strong { + color: var(--color-content-fg-bold) +} + + + /* đŸ–ŧī¸ Picture in Picture */ .layout-single-column .picture-in-picture { box-shadow: 0 0 5px rgba(0, 0, 0, .2); From 4a1dd62f9ee5c89a5550990bdce52ef80f1ff0f4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nil=C3=A9ane?= Date: Tue, 25 Jul 2023 02:29:34 +0200 Subject: [PATCH 3/3] v1.7.6 --- TangerineUI-purple.css | 2 +- TangerineUI.css | 2 +- .../styles/tangerineui-purple/layout-single-column.scss | 2 +- .../app/javascript/styles/tangerineui/layout-single-column.scss | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/TangerineUI-purple.css b/TangerineUI-purple.css index a83c152..db39f56 100644 --- a/TangerineUI-purple.css +++ b/TangerineUI-purple.css @@ -1,5 +1,5 @@ /* TangerineUI 🍊 for Mastodon ãƒģ Purple variant đŸĒģ - version: 1.7.5 + version: 1.7.6 A Tangerine redesign for Mastodon's Web UI. https://github.com/nileane/TangerineUI-for-Mastodon/ diff --git a/TangerineUI.css b/TangerineUI.css index fb703cd..f56f505 100644 --- a/TangerineUI.css +++ b/TangerineUI.css @@ -1,5 +1,5 @@ /* TangerineUI 🍊 for Mastodon - version: 1.7.5 + version: 1.7.6 A Tangerine redesign for Mastodon's Web UI. https://github.com/nileane/TangerineUI-for-Mastodon/ diff --git a/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss b/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss index a83c152..db39f56 100644 --- a/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss +++ b/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss @@ -1,5 +1,5 @@ /* TangerineUI 🍊 for Mastodon ãƒģ Purple variant đŸĒģ - version: 1.7.5 + version: 1.7.6 A Tangerine redesign for Mastodon's Web UI. https://github.com/nileane/TangerineUI-for-Mastodon/ diff --git a/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss b/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss index fb703cd..f56f505 100644 --- a/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss +++ b/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss @@ -1,5 +1,5 @@ /* TangerineUI 🍊 for Mastodon - version: 1.7.5 + version: 1.7.6 A Tangerine redesign for Mastodon's Web UI. https://github.com/nileane/TangerineUI-for-Mastodon/