chinwag/ChinwagUI
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #47 from nileane/dev

Browse source 
v1.7.6
This commit is contained in:
Niléane 2023-07-25 02:32:00 +02:00 • committed by GitHub
commit 0c5d8fbea4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 148 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

47
TangerineUI-purple.css
View file

@ -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/
@ -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 {
@ -2351,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);

43
TangerineUI.css
View file

@ -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/
@ -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 {
@ -2351,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);

47
mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss
View file

@ -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/
@ -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 {
@ -2351,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);

43
mastodon/app/javascript/styles/tangerineui/layout-single-column.scss
View file

@ -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/
@ -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 {
@ -2351,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);