wagesj45/RocketChatCustomLayout
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Update 'custom.css'

Browse source
This commit is contained in:
Jordan Wages 2020-10-13 02:05:15 -05:00
parent 3cf2b2a2f7
commit 83dcaab571
1 changed files with 39 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
custom.css
View file

@ -5,6 +5,7 @@
:root {
--primary-font-color: #444;
--info-font-color: #a0a0a0;
--color-darker: #272c33;
}
/* Reset global font color so that it's changable more easily */
@ -38,7 +39,11 @@ input, select, textarea {
}
}
@keyframes highlight {
from {
background-color: hsl(216, 92%, 54%);
}
}
/******************************************
************Transition Effect*************
@ -135,6 +140,10 @@ body.dark-mode {
/* Mention link */
--mention-link-background: var(--color-dark-medium);
--mention-link-text-color: var(--color-light-blue);
--mention-link-me-background: var(--alerts-background);
--mention-link-me-text-color: var(--color-white);
--mention-link-group-background: var(--alerts-background);
--mention-link-group-text-color: var(--color-white);
/* Message box */
--message-box-user-typing-color: var(--color-gray-lightest);
@ -157,9 +166,8 @@ body.dark-mode {
--alerts-background: #1d73f5;
--alerts-color: var(--color-white);
/* highlight text */
--selection-background: orangered;
--message-box-editing-color: var(--rc-color-alert-message-warning-background);
--rc-color-alert: var(--color-dark-red);
}
@ -180,7 +188,7 @@ body.dark-mode select {
}
body.dark-mode select option {
color: var(--primary-font-color);
color: var(--color-white);
}
body.dark-mode .sidebar-item > a {
@ -260,13 +268,17 @@ body.dark-mode .message.new-day::before {
body.dark-mode .message.active,
body.dark-mode .message:hover {
background-color: var(--color-dark-medium);
background-color: var(--color-darker);
}
body.dark-mode .message.editing {
background-color: var(--color-dark-blue);
}
body.dark-mode .message.first-unread .body:after {
background-color: var(--header-background-color);
}
body.dark-mode .rc-message-box__container {
background-color: var(--message-box-background);
}
@ -277,7 +289,14 @@ body.dark-mode .rc-old .rc-message-box .reply-preview {
body.dark-mode .message-actions,
body.dark-mode .rc-member-list__counter {
color: var(--color-gray);
color: var(--color-gray-light);
background-color: var(--color-darkest);
border-color: var(--color-dark);
}
body.dark-mode .message-actions__button:hover,
body.dark-mode .message-actions__menu:hover {
background-color: var(--color-dark);
}
body.dark-mode .background-transparent-darker-before::before {
@ -377,7 +396,8 @@ body.dark-mode .message-popup-title {
/**************Code Highlights*****************/
body.dark-mode .code-colors {
body.dark-mode .code-colors,
body.dark-mode .rc-old code.inline {
background: var(--color-dark-100);
color: var(--color-gray-light);
}
@ -558,6 +578,10 @@ body.dark-mode .rcx-box {
background-color: var(--color-dark) !important;
}
body.dark-mode .rcx-modal__backdrop {
background-color: transparent !important;
}
body.dark-mode .rcx-table__cell--align-start {
color: var(--info-font-color) !important;
background-color: var(--color-dark-medium) !important;
@ -616,6 +640,10 @@ body.dark-mode .setting-action {
/**************Login Page******************/
body.dark-mode main#rocket-chat {
background-color: var(--color-dark);
}
body.dark-mode section.full-page.color-tertiary-font-color {
background-color: var(--color-dark);
}
@ -623,6 +651,7 @@ body.dark-mode section.full-page.color-tertiary-font-color {
body.dark-mode .rc-button.rc-button--nude.forgot-password,
body.dark-mode .rc-button.rc-button--nude.back-to-login,
body.dark-mode .rc-button.rc-button--nude.register,
body.dark-mode .rc-button.rc-button--nude i.icon-cancel,
body.dark-mode .register-link-replacement {
color: var(--color-white);
}