refactor: renamed darker-gray to darkest gray and added new darker gray

This commit is contained in:
William Grant 2022-08-24 12:23:31 +10:00
parent 1ae93f432a
commit aba18020f1
5 changed files with 21 additions and 19 deletions

View File

@ -104,7 +104,7 @@
white-space: nowrap;
text-overflow: clip;
color: var(--color-darker-gray-color);
color: var(--color-darkest-gray-color);
}
.module-message__generic-attachment__text {
@ -115,7 +115,7 @@
}
.module-message__generic-attachment__file-name {
color: var(--color-darker-gray-color);
color: var(--color-darkest-gray-color);
font-size: 14px;
line-height: 18px;
font-weight: 300;
@ -208,7 +208,7 @@
}
.module-message__link-preview__title {
color: var(--color-darker-gray-color);
color: var(--color-darkest-gray-color);
font-size: 16px;
font-weight: 300;
letter-spacing: 0.15px;
@ -663,7 +663,7 @@
line-height: 16px;
border-radius: 8px;
box-shadow: 0px 0px 0px 1px var(--color-darker-gray-color);
box-shadow: 0px 0px 0px 1px var(--color-darkest-gray-color);
}
.module-conversation-list-item__content {
@ -1083,7 +1083,7 @@
white-space: nowrap;
text-overflow: clip;
color: var(--color-darker-gray-color);
color: var(--color-darkest-gray-color);
}
.module-staged-generic-attachment__filename {
@ -1235,7 +1235,7 @@
padding: var(--margins-sm);
}
.module-staged-link-preview__title {
color: var(--color-darker-gray-color);
color: var(--color-darkest-gray-color);
font-weight: 300;
font-size: 14px;
line-height: 18px;

View File

@ -107,7 +107,7 @@
font-size: var(--font-size-sm);
line-height: 18px;
font-weight: 300;
color: var(--color-darker-gray-color);
color: var(--color-darkest-gray-color);
margin-bottom: 5px;
overflow-x: hidden;
@ -137,7 +137,7 @@
.module-quote__primary__type-label {
font-style: italic;
color: var(--color-darker-gray-color);
color: var(--color-darkest-gray-color);
font-size: var(--font-size-sm);
line-height: 18px;
}
@ -242,7 +242,7 @@
&-file__text {
font-size: 14px;
line-height: 18px;
color: var(--color-darker-gray-color);
color: var(--color-darkest-gray-color);
max-width: calc(100% - 26px);
overflow-x: hidden;
@ -272,7 +272,7 @@
&-warning__text {
margin-inline-start: 6px;
color: var(--color-darker-gray-color);
color: var(--color-darkest-gray-color);
font-size: var(--font-size-sm);
line-height: 18px;
}

View File

@ -56,7 +56,7 @@
min-width: 420px;
padding: 3 * $session-margin-lg 2 * $session-margin-lg;
box-sizing: border-box;
background-color: var(--color-darker-gray-color);
background-color: var(--color-darkest-gray-color);
border: 1px solid $session-shade-8;
border-radius: 2px;

View File

@ -5,7 +5,7 @@
&.modal {
.content {
textarea {
background-color: var(--color-darker-gray-color);
background-color: var(--color-darkest-gray-color);
border: 1px solid $color-dark-60;
color: var(--color-lighter-gray-color);
}
@ -15,7 +15,7 @@
.result {
.open {
border: solid 1px $color-dark-60;
background-color: var(--color-darker-gray-color);
background-color: var(--color-darkest-gray-color);
color: var(--color-lighter-gray-color);
&:before {
@ -27,7 +27,7 @@
color: var(--color-lighter-gray-color);
border: solid 1px $color-dark-60;
border-right: none;
background-color: var(--color-darker-gray-color);
background-color: var(--color-darkest-gray-color);
}
}
}
@ -217,7 +217,7 @@
// Module: Media Gallery
.module-media-gallery__tab {
background-color: var(--color-darker-gray-color);
background-color: var(--color-darkest-gray-color);
}
.module-media-gallery__tab--active {
@ -237,7 +237,7 @@
// Module: Media Grid Item
.module-media-grid-item {
background-color: var(--color-darker-gray-color);
background-color: var(--color-darkest-gray-color);
}
.module-media-grid-item__icon-image {
@ -266,7 +266,7 @@
.module-conversation-list-item__unread-count {
color: var(--color-white-color);
background-color: var(--color-session-green-color);
box-shadow: 0px 0px 0px 1px var(--color-darker-gray-color);
box-shadow: 0px 0px 0px 1px var(--color-darkest-gray-color);
}
.module-conversation-list-item__header__name {
@ -350,7 +350,7 @@
}
.module-staged-generic-attachment__icon__extension {
color: var(--color-darker-gray-color);
color: var(--color-darkest-gray-color);
}
// Module: Staged Placeholder Attachment

View File

@ -30,7 +30,8 @@ const lightGrayColor = '#8b8e91';
const lighterGrayColor = '#e9e9e9';
const lightestGrayColor = '#f3f3f3';
const darkGrayColor = '#414347';
const darkerGrayColor = '#17191d';
const darkerGrayColor = '#2f2f2f';
const darkestGrayColor = '#17191d';
// DARK COLORS
const darkColorAccent = accentDarkTheme;
@ -384,6 +385,7 @@ export const SessionGlobalStyles = createGlobalStyle`
--color-lightest-gray-color: ${lightestGrayColor};
--color-dark-gray-color: ${darkGrayColor};
--color-darker-gray-color: ${darkerGrayColor};
--color-darkest-gray-color: ${darkestGrayColor};
--color-light-blue-color: ${lightBlueColor};
--color-warning: ${warning};