mirror of
https://github.com/irislib/iris-messenger.git
synced 2024-10-18 14:13:21 +00:00
dark theme colors
This commit is contained in:
parent
734e3b20b4
commit
3638c11efd
@ -2,13 +2,22 @@
|
|||||||
:root {
|
:root {
|
||||||
--text-color: #ffffff;
|
--text-color: #ffffff;
|
||||||
--text-time: rgba(255, 255, 255, 0.45);
|
--text-time: rgba(255, 255, 255, 0.45);
|
||||||
--main-color: #3b3936;
|
--main-color: rgb(22, 23, 44);
|
||||||
--header-color: #292929;
|
--header-color: #101126;
|
||||||
--chat-active: #252525;
|
--chat-active: rgb(22, 23, 44);
|
||||||
--chat-hover: #363636;
|
--chat-hover: #171833;
|
||||||
--msg-content-background: #000000;
|
--msg-content-background: #22244C;
|
||||||
--our-msg: #3f4939;
|
--our-msg: #1DC0F2;
|
||||||
--notify: #476974;
|
--notify: #476974;
|
||||||
--login-background: #154352;
|
--login-background: #154352;
|
||||||
--seen-indicator: rgba(255, 255, 255, 0.45);
|
--seen-indicator: rgba(255, 255, 255, 0.45);
|
||||||
|
--input-bg: #262642;
|
||||||
|
--input-text: #ffffff;
|
||||||
|
--input-placeholder: #ccc;
|
||||||
|
--small-text-color: #bbb;
|
||||||
|
--button-bg: rgb(22, 23, 44);
|
||||||
|
--button-color: #1DC0F2;
|
||||||
|
--button-border: 2px solid #1DC0F2;
|
||||||
|
--button-hover-bg: #101126;
|
||||||
|
--sidebar-border-right: 1px solid #3D3E66;
|
||||||
}
|
}
|
@ -11,4 +11,13 @@
|
|||||||
--notify: #9ee8ff;
|
--notify: #9ee8ff;
|
||||||
--login-background: #70d4f2;
|
--login-background: #70d4f2;
|
||||||
--seen-indicator: rgba(0, 0, 0, 0.45);
|
--seen-indicator: rgba(0, 0, 0, 0.45);
|
||||||
|
--input-bg: initial;
|
||||||
|
--input-text: initial;
|
||||||
|
--input-placeholder: initial;
|
||||||
|
--small-text-color: #777;
|
||||||
|
--button-bg: #ddd;
|
||||||
|
--button-color: initial;
|
||||||
|
--button-border: 0;
|
||||||
|
--button-hover-bg: #ccc;
|
||||||
|
--sidebar-border-right: 1px solid #dfdfdf;
|
||||||
}
|
}
|
@ -36,15 +36,23 @@ input, button, .button {
|
|||||||
|
|
||||||
input {
|
input {
|
||||||
margin-right: 7px;
|
margin-right: 7px;
|
||||||
|
background: var(--input-bg);
|
||||||
|
color: var(--input-text);
|
||||||
|
}
|
||||||
|
|
||||||
|
::placeholder {
|
||||||
|
color: var(--input-placeholder);
|
||||||
}
|
}
|
||||||
|
|
||||||
button, .button {
|
button, .button {
|
||||||
background: #ddd;
|
background: var(--button-bg);
|
||||||
|
color: var(--button-color);
|
||||||
|
border: var(--button-border);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
button:hover, button:active, button:focus, .button:hover, .button:active, .button:focus {
|
button:hover, button:active, button:focus, .button:hover, .button:active, .button:focus {
|
||||||
background: #ccc;
|
background: var(--button-hover-bg);
|
||||||
}
|
}
|
||||||
|
|
||||||
img {
|
img {
|
||||||
@ -110,7 +118,7 @@ img {
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
flex: 1 0 10em;
|
flex: 1 0 10em;
|
||||||
border-right: 1px solid #dfdfdf;
|
border-right: var(--sidebar-border-right);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar * {
|
.sidebar * {
|
||||||
@ -368,6 +376,7 @@ header #back-button {
|
|||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
font-size: 30px;
|
font-size: 30px;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
|
border: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*----- Sidebar------- */
|
/*----- Sidebar------- */
|
||||||
@ -471,7 +480,7 @@ header #back-button {
|
|||||||
|
|
||||||
small {
|
small {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: #777;
|
color: var(--small-text-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.chat-item.active, .chat-item.active:hover {
|
.chat-item.active, .chat-item.active:hover {
|
||||||
|
Loading…
Reference in New Issue
Block a user