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

Merged changes

Browse source
This commit is contained in:
Niléane 2023-07-20 14:04:01 +02:00
parent ce195bf902
commit 178d4ebc20
No known key found for this signature in database
2 changed files with 122 additions and 74 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -1,5 +1,5 @@
/* TangerineUI 🍊 for Mastodon ・ Purple variant 🪻 /* TangerineUI 🍊 for Mastodon ・ Purple variant 🪻
version: 1.6 version: 1.7
A Tangerine redesign for Mastodon's Web UI. A Tangerine redesign for Mastodon's Web UI.
https://github.com/nileane/TangerineUI-for-Mastodon/ https://github.com/nileane/TangerineUI-for-Mastodon/
@ -1135,8 +1135,8 @@ body.layout-single-column {
height: 55px; height: 55px;
} }
.layout-single-column .ui::after { /* Set a backdrop blur background to both top bars */ .layout-single-column .ui::after { /* Set a backdrop blur background to both top bars */
-webkit-backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(20px);
backdrop-filter: blur(12px); backdrop-filter: blur(20px);
background-color: rgba(242, 239, 245, .75); background-color: rgba(242, 239, 245, .75);
content: ""; content: "";
height: 55px; height: 55px;
@ -1161,7 +1161,7 @@ body.layout-single-column {
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
@media screen and (max-width:1174px) { @media screen and (max-width:1174px) {
.layout-single-column .ui::after { .layout-single-column .ui::after {
background-color: rgb(0, 0, 0, .7); background-color: rgba(0, 0, 0, .7);
} }
} }
} }
@ -1304,31 +1304,6 @@ body.layout-single-column {
.layout-single-column .compose-panel hr, .navigation-panel hr { .layout-single-column .compose-panel hr, .navigation-panel hr {
display: none; display: none;
} }
.layout-single-column .list-panel {
padding: 8px 9px 8px 7px;
margin: 5px 0 5px;
border-radius: 9px;
background-color: var(--color-secondary-bg);
}
.layout-single-column .list-panel .column-link {
width: auto;
position: relative;
padding: 12px 13px;
overflow: visible;
}
.layout-single-column .list-panel .column-link:not(:last-child,:hover,.active)::after {
display: block;
content: " ";
height: 2px;
bottom: -2px;
right: 15px;
background-color: var(--color-secondary-separator);
left: 15px;
position: absolute;
}
.layout-single-column .list-panel i.fa {
display: none;
}
.layout-single-column .column-link__icon { .layout-single-column .column-link__icon {
transform: scale(.8); transform: scale(.8);
vertical-align: middle; vertical-align: middle;
@ -1341,6 +1316,37 @@ body.layout-single-column {
position: relative; position: relative;
top: 1px; top: 1px;
} }
.layout-single-column .list-panel {
padding: 5px 9px 8px 27px;
margin: 0 0 5px;
display: none;
}
.layout-single-column .list-panel i.fa {
display: none;
}
.layout-single-column .list-panel .column-link {
width: auto;
}
.layout-single-column .column-link[href="/lists"].active:has(+ .list-panel .column-link.active) {
background-color: var(--color-accent-bg);
color: var(--color-content-fg);
}
.layout-single-column .column-link[href="/lists"]:hover + .list-panel,
.layout-single-column .column-link[href="/lists"].active + .list-panel,
.layout-single-column .list-panel:hover {
display: block;
animation: fadein .5s 1;
}
@keyframes fadein {
from {
opacity: 0;
transform: translateY(-10%);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@media screen and (max-width:1174px) { @media screen and (max-width:1174px) {
.layout-single-column .columns-area__panels__pane--navigational .columns-area__panels__pane__inner { .layout-single-column .columns-area__panels__pane--navigational .columns-area__panels__pane__inner {
width: 100vw; width: 100vw;
@ -1728,20 +1734,16 @@ body.layout-single-column {
} }
.layout-single-column .compose-panel .fa-search, .layout-single-column .compose-panel .fa-search,
.layout-single-column .compose-panel .fa.active { .layout-single-column .compose-panel .fa.active {
opacity: 1;
right: 15px; right: 15px;
top: 15px; top: 15px;
color: var(--color-accent);
}
.layout-single-column .compose-panel .fa-search.active {
opacity: 1;
} }
.layout-single-column .compose-panel .fa-times-circle.active { .layout-single-column .compose-panel .fa-times-circle.active {
top: 16px; top: 16px;
} }
.layout-single-column .compose-panel .fa-search::before {
content: " ";
}
.layout-single-column .compose-panel .fa-search.active::before,
.layout-single-column .fa-search.column-header__icon::before {
content: var(--icon-search);
}
.layout-single-column .explore__search-results { .layout-single-column .explore__search-results {
background-color: var(--color-content-bg); background-color: var(--color-content-bg);
border-radius: 7px; border-radius: 7px;
@ -1797,6 +1799,7 @@ body.layout-single-column {
} }
.layout-single-column i.fa-search, .layout-single-column i.fa-search,
.layout-single-column i.fa.active { .layout-single-column i.fa.active {
color: var(--color-accent);
transform: scale(1); transform: scale(1);
top: 13px; top: 13px;
} }
@ -2360,6 +2363,27 @@ body.layout-single-column {
/* 🤗 Onboarding suggestions */
.layout-single-column .scrollable.follow-recommendations-container,
.layout-single-column .column-list {
background-color: var(--color-content-bg);
}
.layout-single-column .column-title .logo {
display: none;
}
.layout-single-column .column-title h3,
.layout-single-column .column-title p {
color: var(--color-content-fg);
}
.layout-single-column .column-list {
border: 0;
}
.layout-single-column .account__note {
color: var(--color-content-fg-muted);
}
/* 📜 About page /* 📜 About page
------------- */ ------------- */
.layout-single-column .scrollable.about { .layout-single-column .scrollable.about {

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

@ -1,5 +1,5 @@
/* TangerineUI 🍊 for Mastodon /* TangerineUI 🍊 for Mastodon
version: 1.6 version: 1.7
A Tangerine redesign for Mastodon's Web UI. A Tangerine redesign for Mastodon's Web UI.
https://github.com/nileane/TangerineUI-for-Mastodon/ https://github.com/nileane/TangerineUI-for-Mastodon/
@ -1135,8 +1135,8 @@ body.layout-single-column {
height: 55px; height: 55px;
} }
.layout-single-column .ui::after { /* Set a backdrop blur background to both top bars */ .layout-single-column .ui::after { /* Set a backdrop blur background to both top bars */
-webkit-backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(20px);
backdrop-filter: blur(12px); backdrop-filter: blur(20px);
background-color: rgba(245, 242, 239, 0.75); background-color: rgba(245, 242, 239, 0.75);
content: ""; content: "";
height: 55px; height: 55px;
@ -1161,7 +1161,7 @@ body.layout-single-column {
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
@media screen and (max-width:1174px) { @media screen and (max-width:1174px) {
.layout-single-column .ui::after { .layout-single-column .ui::after {
background-color: rgba(0, 0, 0, 0.7); background-color: rgba(0, 0, 0, .7);
} }
} }
} }
@ -1304,31 +1304,6 @@ body.layout-single-column {
.layout-single-column .compose-panel hr, .navigation-panel hr { .layout-single-column .compose-panel hr, .navigation-panel hr {
display: none; display: none;
} }
.layout-single-column .list-panel {
padding: 8px 9px 8px 7px;
margin: 5px 0 5px;
border-radius: 9px;
background-color: var(--color-secondary-bg);
}
.layout-single-column .list-panel .column-link {
width: auto;
position: relative;
padding: 12px 13px;
overflow: visible;
}
.layout-single-column .list-panel .column-link:not(:last-child,:hover,.active)::after {
display: block;
content: " ";
height: 2px;
bottom: -2px;
right: 15px;
background-color: var(--color-secondary-separator);
left: 15px;
position: absolute;
}
.layout-single-column .list-panel i.fa {
display: none;
}
.layout-single-column .column-link__icon { .layout-single-column .column-link__icon {
transform: scale(.8); transform: scale(.8);
vertical-align: middle; vertical-align: middle;
@ -1341,6 +1316,37 @@ body.layout-single-column {
position: relative; position: relative;
top: 1px; top: 1px;
} }
.layout-single-column .list-panel {
padding: 5px 9px 8px 27px;
margin: 0 0 5px;
display: none;
}
.layout-single-column .list-panel i.fa {
display: none;
}
.layout-single-column .list-panel .column-link {
width: auto;
}
.layout-single-column .column-link[href="/lists"].active:has(+ .list-panel .column-link.active) {
background-color: var(--color-accent-bg);
color: var(--color-content-fg);
}
.layout-single-column .column-link[href="/lists"]:hover + .list-panel,
.layout-single-column .column-link[href="/lists"].active + .list-panel,
.layout-single-column .list-panel:hover {
display: block;
animation: fadein .5s 1;
}
@keyframes fadein {
from {
opacity: 0;
transform: translateY(-10%);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@media screen and (max-width:1174px) { @media screen and (max-width:1174px) {
.layout-single-column .columns-area__panels__pane--navigational .columns-area__panels__pane__inner { .layout-single-column .columns-area__panels__pane--navigational .columns-area__panels__pane__inner {
width: 100vw; width: 100vw;
@ -1728,20 +1734,16 @@ body.layout-single-column {
} }
.layout-single-column .compose-panel .fa-search, .layout-single-column .compose-panel .fa-search,
.layout-single-column .compose-panel .fa.active { .layout-single-column .compose-panel .fa.active {
opacity: 1;
right: 15px; right: 15px;
top: 15px; top: 15px;
color: var(--color-accent);
}
.layout-single-column .compose-panel .fa-search.active {
opacity: 1;
} }
.layout-single-column .compose-panel .fa-times-circle.active { .layout-single-column .compose-panel .fa-times-circle.active {
top: 16px; top: 16px;
} }
.layout-single-column .compose-panel .fa-search::before {
content: " ";
}
.layout-single-column .compose-panel .fa-search.active::before,
.layout-single-column .fa-search.column-header__icon::before {
content: var(--icon-search);
}
.layout-single-column .explore__search-results { .layout-single-column .explore__search-results {
background-color: var(--color-content-bg); background-color: var(--color-content-bg);
border-radius: 7px; border-radius: 7px;
@ -1797,6 +1799,7 @@ body.layout-single-column {
} }
.layout-single-column i.fa-search, .layout-single-column i.fa-search,
.layout-single-column i.fa.active { .layout-single-column i.fa.active {
color: var(--color-accent);
transform: scale(1); transform: scale(1);
top: 13px; top: 13px;
} }
@ -2360,6 +2363,27 @@ body.layout-single-column {
/* 🤗 Onboarding suggestions */
.layout-single-column .scrollable.follow-recommendations-container,
.layout-single-column .column-list {
background-color: var(--color-content-bg);
}
.layout-single-column .column-title .logo {
display: none;
}
.layout-single-column .column-title h3,
.layout-single-column .column-title p {
color: var(--color-content-fg);
}
.layout-single-column .column-list {
border: 0;
}
.layout-single-column .account__note {
color: var(--color-content-fg-muted);
}
/* 📜 About page /* 📜 About page
------------- */ ------------- */
.layout-single-column .scrollable.about { .layout-single-column .scrollable.about {