Merge pull request from jryans/dark-theme-auth-r2

Tweak auth components when dark theme is default
This commit is contained in:
J. Ryan Stinnett 2019-03-07 10:06:30 +00:00 committed by GitHub
commit 19edc5c5a4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 59 additions and 43 deletions
res
css/views/auth
themes/light/css

View file

@ -22,44 +22,71 @@ limitations under the License.
box-sizing: border-box;
font-size: 12px;
color: $authpage-secondary-color;
}
.mx_AuthBody h2 {
font-size: 24px;
font-weight: 600;
margin-top: 8px;
color: $authpage-primary-color;
}
h2 {
font-size: 24px;
font-weight: 600;
margin-top: 8px;
color: $authpage-primary-color;
}
.mx_AuthBody h3 {
font-size: 14px;
font-weight: 600;
color: $authpage-primary-color;
}
h3 {
font-size: 14px;
font-weight: 600;
color: $authpage-primary-color;
}
.mx_AuthBody input[type=text],
.mx_AuthBody input[type=password] {
color: $authpage-primary-color;
}
a:link,
a:hover,
a:visited {
color: $accent-color;
text-decoration: none;
}
.mx_AuthBody .mx_Field input,
.mx_AuthBody .mx_Field select {
color: $authpage-primary-color;
background-color: $authpage-body-bg-color;
}
input[type=text],
input[type=password] {
color: $authpage-primary-color;
}
.mx_AuthBody .mx_Field label {
color: $authpage-primary-color;
}
.mx_Field input,
.mx_Field select {
color: $authpage-primary-color;
background-color: $authpage-body-bg-color;
}
.mx_AuthBody .mx_Field input:focus + label,
.mx_AuthBody .mx_Field input:not(:placeholder-shown) + label,
.mx_AuthBody .mx_Field select + label /* Always show a select's label on top to not collide with the value */ {
background-color: $authpage-body-bg-color;
}
.mx_Field label {
color: $authpage-primary-color;
}
.mx_AuthBody input.error {
color: $warning-color;
.mx_Field input:focus + label,
.mx_Field input:not(:placeholder-shown) + label,
.mx_Field textarea:focus + label,
.mx_Field textarea:not(:placeholder-shown) + label,
.mx_Field select + label /* Always show a select's label on top to not collide with the value */,
.mx_Field_labelAlwaysTopLeft label {
background-color: $authpage-body-bg-color;
}
input.error {
color: $warning-color;
}
.mx_Field input {
width: 100%;
box-sizing: border-box;
}
.mx_Dropdown_arrow {
background: $authpage-primary-color;
}
.mx_Dropdown_menu {
background-color: $authpage-body-bg-color;
.mx_Dropdown_option_highlight {
background-color: $authpage-focus-bg-color;
}
}
}
.mx_AuthBody_editServerDetails {
@ -68,11 +95,6 @@ limitations under the License.
font-weight: normal;
}
.mx_AuthBody .mx_Field input {
width: 100%;
box-sizing: border-box;
}
.mx_AuthBody_fieldRow {
display: flex;
margin-bottom: 10px;
@ -91,13 +113,6 @@ limitations under the License.
margin-right: 0;
}
.mx_AuthBody a:link,
.mx_AuthBody a:hover,
.mx_AuthBody a:visited {
color: $accent-color;
text-decoration: none;
}
.mx_AuthBody_changeFlow {
display: block;
text-align: center;

View file

@ -246,6 +246,7 @@ $memberstatus-placeholder-color: $roomtile-name-color;
$authpage-bg-color: #2e3649;
$authpage-modal-bg-color: rgba(255, 255, 255, 0.59);
$authpage-body-bg-color: #ffffff;
$authpage-focus-bg-color: #dddddd;
$authpage-lang-color: #4e5054;
$authpage-primary-color: #232f32;
$authpage-secondary-color: #61708b;