Fix colors in dialogs (#306)

Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
Alexander Platov 2021-11-16 19:13:07 +03:00 committed by GitHub
parent c7a8735d35
commit 4717598936
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 29 additions and 23 deletions

View File

@ -144,16 +144,16 @@
display: flex;
flex-direction: column;
height: calc(100% - 32px - 1.25rem);
background: rgba(31, 31, 37, 0.7);
background: var(--theme-dialog-bg);
border-radius: 1.25rem;
box-shadow: 0px 44px 154px rgba(0, 0, 0, .75);
backdrop-filter: blur(30px);
backdrop-filter: blur(15px);
.header {
flex-shrink: 0;
padding: 0 2.5rem;
height: 4.5rem;
border-bottom: 1px solid var(--theme-card-divider);
border-bottom: 1px solid var(--theme-dialog-divider);
.icon { opacity: .6; }
.title {
@ -170,7 +170,7 @@
flex-shrink: 0;
padding: 0 2rem;
height: 3.5rem;
border-bottom: 1px solid var(--theme-bg-accent-hover);
border-bottom: 1px solid var(--theme-dialog-divider);
}
}
@ -189,12 +189,12 @@
height: max-content;
}
.activity {
background-color: var(--theme-bg-accent-color);
background-color: var(--theme-dialog-accent);
&.header { border-bottom: none; }
&.content {
flex-grow: 1;
padding-bottom: 0;
background-color: var(--theme-bg-accent-color);
background-color: var(--theme-dialog-accent);
}
}
}
@ -210,7 +210,7 @@
flex-direction: column;
}
.leftSection {
border-right: 1px solid var(--theme-bg-accent-hover);
border-right: 1px solid var(--theme-dialog-divider);
.scroll-container {
overflow: auto;
margin: 2rem 2rem 1.5rem;
@ -222,16 +222,16 @@
}
.rightSection {
background-color: transparent;
.header { border-bottom: 1px solid var(--theme-card-divider); }
.header { border-bottom: 1px solid var(--theme-dialog-divider); }
.content {
flex-grow: 1;
padding: 2.5rem 2.5rem 0;
background-color: var(--theme-bg-accent-color);
background-color: var(--theme-dialog-accent);
}
}
.ref-input {
background-color: var(--theme-bg-accent-color);
background-color: var(--theme-dialog-accent);
padding: 1.5rem 2.5rem;
}

View File

@ -131,7 +131,7 @@
right: 0;
background-color: var(--theme-card-bg);
border-radius: 1.25rem;
backdrop-filter: blur(24px);
backdrop-filter: blur(15px);
box-shadow: var(--theme-card-shadow);
z-index: -1;
}

View File

@ -64,8 +64,10 @@
--theme-menu-selection: #1D1D23;
--theme-menu-divider: rgba(255, 255, 255, .05);
--theme-scroll-bar: #2C2C34;
--theme-dialog-bg: rgba(47, 47, 53, .7);
--theme-dialog-divider: rgba(255, 255, 255, .06);
--theme-dialog-bg: rgba(31, 31, 37, .8);
--theme-dialog-accent: rgba(255, 255, 255, .03);
--theme-dialog-divider: rgba(255, 255, 255, .1);
--theme-dialog-spec: rgba(47, 47, 53, .6);
--theme-dialog-shadow: 0px 44px 154px rgba(0, 0, 0, 0.75);
--theme-border-modal: rgba(0, 0, 0, 0.2);
--theme-chat-selection: radial-gradient(135.96% 3333.35% at -2.36% -27.63%, rgba(210, 183, 156, 0.11) 0%, rgba(204, 196, 184, 0.0785128) 20.8%, rgba(104, 104, 114, 0.11) 100%);
@ -136,8 +138,10 @@
--theme-menu-selection: #37363F;
--theme-menu-divider: rgba(255, 255, 255, .05);
--theme-scroll-bar: #494852;
--theme-dialog-bg: rgba(47, 47, 53, .7);
--theme-dialog-divider: rgba(255, 255, 255, .06);
--theme-dialog-bg: rgba(31, 31, 37, .8);
--theme-dialog-accent: rgba(255, 255, 255, .03);
--theme-dialog-divider: rgba(255, 255, 255, .1);
--theme-dialog-spec: rgba(47, 47, 53, .6);
--theme-dialog-shadow: 0px 44px 154px rgba(0, 0, 0, 0.75);
--theme-border-modal: rgba(0, 0, 0, 0.2);
--theme-chat-selection: radial-gradient(135.96% 3333.35% at -2.36% -27.63%, rgba(210, 183, 156, 0.11) 0%, rgba(204, 196, 184, 0.0785128) 20.8%, rgba(104, 104, 114, 0.11) 100%);
@ -207,17 +211,19 @@
--theme-menu-selection: #DBDBDB;
--theme-menu-divider: rgba(0, 0, 0, .08);
--theme-scroll-bar: #CBCBCB;
--theme-dialog-bg: #fff;
--theme-dialog-bg: rgba(255, 255, 255, .4);
--theme-dialog-accent: rgba(31, 33, 43, .03);
--theme-dialog-divider: rgba(31, 33, 43, .06);
--theme-dialog-spec: rgba(47, 47, 53, .6);
--theme-dialog-shadow: 0px 44px 154px rgba(0, 0, 0, 0.75);
--theme-border-modal: rgba(0, 0, 0, 0.2);
--theme-chat-selection: radial-gradient(135.96% 3333.35% at -2.36% -27.63%, rgba(210, 183, 156, 0.11) 0%, rgba(204, 196, 184, 0.0785128) 20.8%, rgba(104, 104, 114, 0.11) 100%);
--theme-chat-divider: rgb(233, 233, 233);
--theme-card-bg: transparent;
--theme-card-bg: rgba(255, 255, 255, .6);
--theme-card-bg-accent: rgba(0, 0, 0, .04);
--theme-card-divider: rgba(0, 0, 0, .1);
--theme-card-shadow: 0px 24px 74px rgba(100, 89, 89, 0.5);
--theme-card-shadow: 0px 24px 74px rgba(100, 89, 89, .5);
--theme-avatar-bg: #C4C4C4;
--theme-avatar-hover: #EEEDED;
--theme-avatar-border: rgba(255, 255, 255, .7);

View File

@ -164,10 +164,10 @@
.floatdialog-container {
margin: 2rem 1rem 1.25rem 0;
height: calc(100% - 3.25rem);
background-color: rgba(31, 31, 37, .8);
background: var(--theme-dialog-bg-spec);
border-radius: 1.25rem;
box-shadow: 0px 44px 154px rgba(0, 0, 0, .75);
backdrop-filter: blur(30px);
box-shadow: var(--theme-dialog-shadow);
backdrop-filter: blur(15px);
.header {
padding: 0 2rem 0 2.5rem;

View File

@ -97,10 +97,10 @@
display: flex;
flex-direction: column;
height: calc(100% - 32px - 1.25rem);
background: var(--theme-dialog-bg);
background: var(--theme-dialog-bg-spec);
border-radius: 1.25rem;
box-shadow: var(--theme-dialog-shadow);
backdrop-filter: blur(10px);
backdrop-filter: blur(15px);
.header {
flex-shrink: 0;