From a2c145a9f208d81bae19b52e3ee8cbfd6b4899f5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nil=C3=A9ane?= Date: Tue, 18 Jul 2023 20:49:22 +0200 Subject: [PATCH 1/4] Added support for moved account banner and follow request banner --- TangerineUI.css | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/TangerineUI.css b/TangerineUI.css index 409580e..edb0909 100644 --- a/TangerineUI.css +++ b/TangerineUI.css @@ -1561,6 +1561,17 @@ body.layout-single-column { border-radius: 7px 7px 0 0; } +.follow-request-banner, +.moved-account-banner { + background-color: var(--color-accent-bg); +} +.follow-request-banner__message, +.moved-account-banner__message { + color: var(--color-content-fg); +} +.moved-account-banner__message { + font-weight: bold; +} /* ✨ Explore tab From e3271579acf110aac8041895a5102eb5afc2d4ca Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nil=C3=A9ane?= Date: Tue, 18 Jul 2023 21:16:08 +0200 Subject: [PATCH 2/4] Refined follow request banners and empty column indicator --- TangerineUI.css | 38 +++++++++++++++++++++++++++++++------- 1 file changed, 31 insertions(+), 7 deletions(-) diff --git a/TangerineUI.css b/TangerineUI.css index edb0909..0204b15 100644 --- a/TangerineUI.css +++ b/TangerineUI.css @@ -964,8 +964,10 @@ body.layout-single-column { /* Empty columns */ .layout-single-column .empty-column-indicator { - background-color: var(--color-content-bg); + background-color: var(--color-content-secondary-bg); color: var(--color-content-fg); + border-radius: 7px; + contain: content; } .layout-single-column .empty-column-indicator a { color: var(--color-accent); @@ -973,10 +975,10 @@ body.layout-single-column { /* Timeline hint */ .layout-single-column .timeline-hint { + background-color: var(--color-content-secondary-bg); color: var(--color-content-fg); } .layout-single-column .timeline-hint a { - background-color: var(--color-content-secondary-bg); color: var(--color-accent); } @@ -1561,15 +1563,19 @@ body.layout-single-column { border-radius: 7px 7px 0 0; } -.follow-request-banner, -.moved-account-banner { +.layout-single-column .follow-request-banner, +.layout-single-column .moved-account-banner { background-color: var(--color-accent-bg); } -.follow-request-banner__message, -.moved-account-banner__message { +.layout-single-column .moved-account-banner { + margin-bottom: 10px; + border-radius: 7px; +} +.layout-single-column .follow-request-banner__message, +.layout-single-column .moved-account-banner__message { color: var(--color-content-fg); } -.moved-account-banner__message { +.layout-single-column .moved-account-banner__message { font-weight: bold; } @@ -2131,15 +2137,33 @@ body.layout-single-column { .layout-single-column .button.button-tertiary.button--destructive { background-color: transparent; } +.layout-single-column .button.button-tertiary.button--confirmation { + color: #4e8a6b; + background-color: rgba(121, 189, 154, 0.3); +} +.layout-single-column .button.button-tertiary.button--destructive { + color: #df405a; + background-color: rgba(223, 64, 90, 0.3); +} .layout-single-column .button.button-tertiary.button--confirmation:active, .layout-single-column .button.button-tertiary.button--confirmation:focus, .layout-single-column .button.button-tertiary.button--confirmation:hover { background-color: #79bd9a; + color: #ffffff; } .layout-single-column .button.button-tertiary.button--destructive:active, .layout-single-column .button.button-tertiary.button--destructive:focus, .layout-single-column .button.button-tertiary.button--destructive:hover { background-color: #df405a; + color: #ffffff; +} +@media (prefers-color-scheme: dark) { + .layout-single-column .button.button-tertiary.button--confirmation { + color: #72cb9d; + } + .layout-single-column .button.button-tertiary.button--destructive { + color: #f3637b; + } } .layout-single-column .app-body .block-modal__cancel-button, .layout-single-column .app-body .confirmation-modal__cancel-button, From f726ca709f315d79e5455fbc62e47e862d4cb2f8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nil=C3=A9ane?= Date: Tue, 18 Jul 2023 21:17:12 +0200 Subject: [PATCH 3/4] Merged banner changes in purple variant --- TangerineUI-purple.css | 39 +++++++++++++++++++++++++++++++++++++-- 1 file changed, 37 insertions(+), 2 deletions(-) diff --git a/TangerineUI-purple.css b/TangerineUI-purple.css index 44c9695..cfb14d2 100644 --- a/TangerineUI-purple.css +++ b/TangerineUI-purple.css @@ -964,8 +964,10 @@ body.layout-single-column { /* Empty columns */ .layout-single-column .empty-column-indicator { - background-color: var(--color-content-bg); + background-color: var(--color-content-secondary-bg); color: var(--color-content-fg); + border-radius: 7px; + contain: content; } .layout-single-column .empty-column-indicator a { color: var(--color-accent); @@ -973,10 +975,10 @@ body.layout-single-column { /* Timeline hint */ .layout-single-column .timeline-hint { + background-color: var(--color-content-secondary-bg); color: var(--color-content-fg); } .layout-single-column .timeline-hint a { - background-color: var(--color-content-secondary-bg); color: var(--color-accent); } @@ -1561,6 +1563,21 @@ body.layout-single-column { border-radius: 7px 7px 0 0; } +.layout-single-column .follow-request-banner, +.layout-single-column .moved-account-banner { + background-color: var(--color-accent-bg); +} +.layout-single-column .moved-account-banner { + margin-bottom: 10px; + border-radius: 7px; +} +.layout-single-column .follow-request-banner__message, +.layout-single-column .moved-account-banner__message { + color: var(--color-content-fg); +} +.layout-single-column .moved-account-banner__message { + font-weight: bold; +} /* ✨ Explore tab @@ -2120,15 +2137,33 @@ body.layout-single-column { .layout-single-column .button.button-tertiary.button--destructive { background-color: transparent; } +.layout-single-column .button.button-tertiary.button--confirmation { + color: #4e8a6b; + background-color: rgba(121, 189, 154, 0.3); +} +.layout-single-column .button.button-tertiary.button--destructive { + color: #df405a; + background-color: rgba(223, 64, 90, 0.3); +} .layout-single-column .button.button-tertiary.button--confirmation:active, .layout-single-column .button.button-tertiary.button--confirmation:focus, .layout-single-column .button.button-tertiary.button--confirmation:hover { background-color: #79bd9a; + color: #ffffff; } .layout-single-column .button.button-tertiary.button--destructive:active, .layout-single-column .button.button-tertiary.button--destructive:focus, .layout-single-column .button.button-tertiary.button--destructive:hover { background-color: #df405a; + color: #ffffff; +} +@media (prefers-color-scheme: dark) { + .layout-single-column .button.button-tertiary.button--confirmation { + color: #72cb9d; + } + .layout-single-column .button.button-tertiary.button--destructive { + color: #f3637b; + } } .layout-single-column .app-body .block-modal__cancel-button, .layout-single-column .app-body .confirmation-modal__cancel-button, From 10889ded4eb79c0d84a77957765cf2f8340c19c2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nil=C3=A9ane?= Date: Tue, 18 Jul 2023 21:17:12 +0200 Subject: [PATCH 4/4] Merged banner changes in purple variant --- TangerineUI-purple.css | 2 +- TangerineUI.css | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/TangerineUI-purple.css b/TangerineUI-purple.css index cfb14d2..123be50 100644 --- a/TangerineUI-purple.css +++ b/TangerineUI-purple.css @@ -1,5 +1,5 @@ /* TangerineUI 🍊 for Mastodon ãƒģ Purple variant đŸĒģ - version: 1.5 + version: 1.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 0204b15..e77bebe 100644 --- a/TangerineUI.css +++ b/TangerineUI.css @@ -1,5 +1,5 @@ /* TangerineUI 🍊 for Mastodon - version: 1.5 + version: 1.6 A Tangerine redesign for Mastodon's Web UI. https://github.com/nileane/TangerineUI-for-Mastodon/