gaja-group
/
matrix-bot
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

factor out some more colours

This commit is contained in:
Matthew Hodgson 2017-01-16 02:10:45 +00:00
parent 8b38a326cb
commit 002339fb86
12 changed files with 54 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/skins/vector/css/_common.scss
View File

@ -174,13 +174,13 @@ textarea {
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background-color: #e9e9e9; background-color: $dialog-background-bg-color;
opacity: 0.8; opacity: 0.8;
} }
.mx_Dialog_lightbox .mx_Dialog_background { .mx_Dialog_lightbox .mx_Dialog_background {
opacity: 0.85; opacity: 0.85;
background-color: #000; background-color: $lightbox-background-bg-color;
} }
.mx_Dialog_lightbox .mx_Dialog { .mx_Dialog_lightbox .mx_Dialog {

6
src/skins/vector/css/matrix-react-sdk/structures/_UserSettings.scss
View File

@ -58,7 +58,7 @@ limitations under the License.
clear: both; clear: both;
margin-left: 63px; margin-left: 63px;
text-transform: uppercase; text-transform: uppercase;
color: #3d3b39; color: $h3-color;
font-weight: 600; font-weight: 600;
font-size: 13px; font-size: 13px;
margin-top: 26px; margin-top: 26px;
@ -166,10 +166,10 @@ limitations under the License.
{ {
display: inline-block; display: inline-block;
border: 0px; border: 0px;
border-bottom: 1px solid rgba(151, 151, 151, 0.5); border-bottom: 1px solid $input-underline-color;
padding: 0px; padding: 0px;
width: 240px; width: 240px;
color: rgba(74, 74, 74, 0.9); color: $input-fg-color;
font-family: 'Open Sans', Helvetica, Arial, Sans-Serif; font-family: 'Open Sans', Helvetica, Arial, Sans-Serif;
font-size: 16px; font-size: 16px;
} }

2
src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss
View File

@ -147,7 +147,7 @@ limitations under the License.
} }
.mx_Login_error { .mx_Login_error {
color: #ff2020; color: $warning-color;
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
/* /*

2
src/skins/vector/css/matrix-react-sdk/views/elements/_DirectorySearchBox.scss
View File

@ -44,7 +44,7 @@ input[type=text].mx_DirectorySearchBox_input:focus {
padding: 3px; padding: 3px;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
background-color: #efefef; background-color: $plinth-bg-color;
border-radius: 3px; border-radius: 3px;
background-image: url('img/icon-return.svg'); background-image: url('img/icon-return.svg');
background-position: 8px 70%; background-position: 8px 70%;

4
src/skins/vector/css/matrix-react-sdk/views/elements/_ProgressBar.scss
View File

@ -16,10 +16,10 @@ limitations under the License.
.mx_ProgressBar { .mx_ProgressBar {
height: 5px; height: 5px;
border: 1px solid black; border: 1px solid $progressbar-color;
} }
.mx_ProgressBar_fill { .mx_ProgressBar_fill {
height: 100%; height: 100%;
background-color: #000; background-color: $progressbar-color;
} }

2
src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberInfo.scss
View File

@ -61,7 +61,7 @@ limitations under the License.
.mx_MemberInfo h3 { .mx_MemberInfo h3 {
text-transform: uppercase; text-transform: uppercase;
color: #3d3b39; color: $h3-color;
font-weight: 600; font-weight: 600;
font-size: 13px; font-size: 13px;
margin-top: 16px; margin-top: 16px;

2
src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberList.scss
View File

@ -96,7 +96,7 @@ limitations under the License.
.mx_MemberList_invited h2 { .mx_MemberList_invited h2 {
text-transform: uppercase; text-transform: uppercase;
color: #3d3b39; color: $h3-color;
font-weight: 600; font-weight: 600;
font-size: 13px; font-size: 13px;
padding-left: 3px; padding-left: 3px;

2
src/skins/vector/css/matrix-react-sdk/views/rooms/_RoomSettings.scss
View File

@ -81,7 +81,7 @@ limitations under the License.
.mx_RoomSettings h3 { .mx_RoomSettings h3 {
text-transform: uppercase; text-transform: uppercase;
color: #3d3b39; color: $h3-color;
font-weight: 600; font-weight: 600;
font-size: 13px; font-size: 13px;
margin-top: 36px; margin-top: 36px;

26
src/skins/vector/css/themes/_base.scss
View File

@ -1,5 +1,4 @@
// typical text (dark-on-white in light skin) // typical text (dark-on-white in light skin)
$primary-fg-color: #454545; $primary-fg-color: #454545;
$primary-bg-color: #ffffff; $primary-bg-color: #ffffff;
@ -20,6 +19,12 @@ $warning-color: #ff0064;
// left-panel style muted accent color // left-panel style muted accent color
$secondary-accent-color: #eaf5f0; $secondary-accent-color: #eaf5f0;
// used by RoomDirectory permissions
$plinth-bg-color: $secondary-accent-color;
// used by RoomDropTarget
$droptarget-bg-color: rgba(255,255,255,0.5);
// used by AddressSelector // used by AddressSelector
$selected-color: #eaf5f0; $selected-color: #eaf5f0;
@ -35,18 +40,27 @@ $input-border-color: #f0f0f0;
// apart from login forms, which have stronger border // apart from login forms, which have stronger border
$strong-input-border-color: #c7c7c7; $strong-input-border-color: #c7c7c7;
// used for UserSettings EditableText
$input-underline-color: rgba(151, 151, 151, 0.5);
$input-fg-color: rgba(74, 74, 74, 0.9);
// context menus // context menus
$menu-border-color: rgba(187, 187, 187, 0.5); $menu-border-color: rgba(187, 187, 187, 0.5);
$menu-bg-color: #f6f6f6; $menu-bg-color: #f6f6f6;
$avatar-initial-color: #ffffff; $avatar-initial-color: #ffffff;
$h3-color: #3d3b39;
$dialog-background-bg-color: #e9e9e9;
$lightbox-background-bg-color: #000;
// ******************** // ********************
$roomtile-name-color: rgba(69, 69, 69, 0.8); $roomtile-name-color: rgba(69, 69, 69, 0.8);
$roomtile-selected-bg-color: rgba(255, 255, 255, 0.8); $roomtile-selected-bg-color: rgba(255, 255, 255, 0.8);
$roomsublist-label-fg-color: #3d3b39; $roomsublist-label-fg-color: $h3-color;
$roomsublist-label-bg-color: #d3efe1; $roomsublist-label-bg-color: #d3efe1;
// ******************** // ********************
@ -64,8 +78,10 @@ $e2e-verified-color: #76cfa5; // N.B. *NOT* the same as $accent-color
$e2e-unverified-color: #e8bf37; $e2e-unverified-color: #e8bf37;
$e2e-warning-color: #ba6363; $e2e-warning-color: #ba6363;
// ******************** /*** ImageView ***/
$lightbox-bg-color: #454545; $lightbox-bg-color: #454545;
$lightbox-fg-color: #ffffff; $lightbox-fg-color: #ffffff;
$lightbox-border-color: #ffffff; $lightbox-border-color: #ffffff;
// unused?
$progressbar-color: #000;

20
src/skins/vector/css/themes/_dark.scss
View File

@ -19,6 +19,12 @@ $warning-color: #ff0064;
// left-panel style muted accent color // left-panel style muted accent color
$secondary-accent-color: $primary-bg-color; $secondary-accent-color: $primary-bg-color;
// used by RoomDirectory permissions
$plinth-bg-color: #474747;
// used by RoomDropTarget
$droptarget-bg-color: rgba(45,45,45,0.5);
// used by AddressSelector // used by AddressSelector
$selected-color: #eaf5f0; $selected-color: #eaf5f0;
@ -34,18 +40,27 @@ $input-border-color: #3a3a3a;
// apart from login forms, which have stronger border // apart from login forms, which have stronger border
$strong-input-border-color: #656565; $strong-input-border-color: #656565;
// used for UserSettings EditableText
$input-underline-color: $primary-fg-color;
$input-fg-color: $primary-fg-color;
// context menus // context menus
$menu-border-color: rgba(187, 187, 187, 0.5); $menu-border-color: rgba(187, 187, 187, 0.5);
$menu-bg-color: #373737; $menu-bg-color: #373737;
$avatar-initial-color: #2d2d2d; $avatar-initial-color: #2d2d2d;
$h3-color: $primary-fg-color;
$dialog-background-bg-color: #000;
$lightbox-background-bg-color: #000;
// ******************** // ********************
$roomtile-name-color: rgba(186, 186, 186, 0.8); $roomtile-name-color: rgba(186, 186, 186, 0.8);
$roomtile-selected-bg-color: rgba(0, 0, 0, 0.8); $roomtile-selected-bg-color: rgba(0, 0, 0, 0.8);
$roomsublist-label-fg-color: $primary-fg-color; $roomsublist-label-fg-color: $h3-color;
$roomsublist-label-bg-color: #454545; $roomsublist-label-bg-color: #454545;
// ******************** // ********************
@ -67,3 +82,6 @@ $e2e-warning-color: #ba6363;
$lightbox-bg-color: #454545; $lightbox-bg-color: #454545;
$lightbox-fg-color: #ffffff; $lightbox-fg-color: #ffffff;
$lightbox-border-color: #ffffff; $lightbox-border-color: #ffffff;
// unused?
$progressbar-color: #000;

2
src/skins/vector/css/vector-web/structures/_RoomDirectory.scss
View File

@ -110,7 +110,7 @@ limitations under the License.
padding-right: 5px; padding-right: 5px;
height: 15px; height: 15px;
border-radius: 11px; border-radius: 11px;
background-color: $secondary-accent-color; background-color: $plinth-bg-color;
text-transform: uppercase; text-transform: uppercase;
font-weight: 600; font-weight: 600;
font-size: 11px; font-size: 11px;

2
src/skins/vector/css/vector-web/views/rooms/_RoomDropTarget.scss
View File

@ -24,7 +24,7 @@ limitations under the License.
padding-bottom: 5px; padding-bottom: 5px;
border: 1px dashed $accent-color; border: 1px dashed $accent-color;
color: $primary-fg-color; color: $primary-fg-color;
background-color: rgba(255,255,255,0.5); background-color: $droptarget-bg-color;
border-radius: 4px; border-radius: 4px;
} }