ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Dark Theme: Add default background pattern

Browse Source
This commit is contained in:
Alexander Zinchuk 2022-03-19 21:19:24 +01:00
parent 6d7727cccf
commit 59611d6192
3 changed files with 28 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/chat-bg-dark.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 246 KiB

9
src/components/common/UiLoader.scss
View File

@ -81,9 +81,16 @@
body:not(.initial) & { body:not(.initial) & {
background-image: url('../../assets/chat-bg.jpg'); background-image: url('../../assets/chat-bg.jpg');
} }
.theme-dark body.initial & {
background-image: url('../../assets/chat-bg-dark.png');
background-position: top left;
background-size: 650px;
background-repeat: repeat;
}
} }
&.with-right-column::before { html.theme-light body.animation-level-2 &.with-right-column::before {
transform: scale(0.67); transform: scale(0.67);
} }

11
src/components/middle/MiddleColumn.scss
View File

@ -39,6 +39,13 @@
background-image: url("../../assets/chat-bg-mobile.jpg"); background-image: url("../../assets/chat-bg-mobile.jpg");
} }
} }
.theme-dark & {
background-image: url('../../assets/chat-bg-dark.png');
background-position: top left;
background-size: 650px;
background-repeat: repeat;
}
} }
.custom-bg-color:not(.custom-bg-image) &::after { .custom-bg-color:not(.custom-bg-image) &::after {
@ -64,12 +71,12 @@
transition: transform var(--layer-transition); transition: transform var(--layer-transition);
} }
body.animation-level-2 #Main.right-column-open #MiddleColumn:not(.custom-bg-image) &::after { html.theme-light body.animation-level-2 #Main.right-column-open #MiddleColumn:not(.custom-bg-image) &::after {
transform: scale(0.67) !important; transform: scale(0.67) !important;
} }
} }
body.animation-level-2 #Main.right-column-open #MiddleColumn:not(.custom-bg-image) &::after { html.theme-light body.animation-level-2 #Main.right-column-open #MiddleColumn:not(.custom-bg-image) &::after {
@media screen and (min-width: 1921px) { @media screen and (min-width: 1921px) {
transform: scale(0.8) !important; transform: scale(0.8) !important;
} }