cosmetic fixes & hoverovers
This commit is contained in:
parent
26d142f893
commit
1798bff8f5
9 changed files with 53 additions and 5 deletions
|
@ -211,6 +211,10 @@ textarea {
|
||||||
background-color: $accent-fg-color;
|
background-color: $accent-fg-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_Dialog button:hover, .mx_Dialog input[type="submit"]:hover {
|
||||||
|
@mixin mx_DialogButton_hover;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_Dialog button:focus, .mx_Dialog input[type="submit"]:focus {
|
.mx_Dialog button:focus, .mx_Dialog input[type="submit"]:focus {
|
||||||
filter: brightness($focus-brightness);
|
filter: brightness($focus-brightness);
|
||||||
}
|
}
|
||||||
|
@ -277,6 +281,10 @@ textarea {
|
||||||
@mixin mx_DialogButton_small;
|
@mixin mx_DialogButton_small;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_textButton:hover {
|
||||||
|
@mixin mx_DialogButton_hover;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_button_row {
|
.mx_button_row {
|
||||||
margin-top: 69px;
|
margin-top: 69px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -69,6 +69,10 @@ limitations under the License.
|
||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_UserSettings_button:hover {
|
||||||
|
@mixin mx_DialogButton_hover;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_UserSettings_button.danger {
|
.mx_UserSettings_button.danger {
|
||||||
background-color: $warning-color;
|
background-color: $warning-color;
|
||||||
}
|
}
|
||||||
|
|
|
@ -85,6 +85,10 @@ limitations under the License.
|
||||||
margin-bottom: 24px;
|
margin-bottom: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_Login_submit:hover {
|
||||||
|
@mixin mx_DialogButton_hover;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_Login_submit:disabled {
|
.mx_Login_submit:disabled {
|
||||||
opacity: 0.3;
|
opacity: 0.3;
|
||||||
}
|
}
|
||||||
|
@ -131,8 +135,7 @@ limitations under the License.
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_Login_forgot {
|
.mx_Login_forgot {
|
||||||
font-size: 13px;
|
font-size: 15px;
|
||||||
opacity: 0.8;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_Login_forgot:link {
|
.mx_Login_forgot:link {
|
||||||
|
|
|
@ -31,6 +31,10 @@ limitations under the License.
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_MemberDeviceInfo_textButton:hover {
|
||||||
|
@mixin mx_DialogButton_hover;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_MemberDeviceInfo_deviceId {
|
.mx_MemberDeviceInfo_deviceId {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -48,6 +48,10 @@ limitations under the License.
|
||||||
order: 2;
|
order: 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_RoomHeader_textButton:hover {
|
||||||
|
@mixin mx_DialogButton_hover;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_RoomHeader_textButton_danger {
|
.mx_RoomHeader_textButton_danger {
|
||||||
background-color: $warning-color;
|
background-color: $warning-color;
|
||||||
}
|
}
|
||||||
|
|
|
@ -26,6 +26,12 @@ limitations under the License.
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-right: 8px;
|
margin-right: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_RoomSettings_leaveButton:hover,
|
||||||
|
.mx_RoomSettings_unbanButton:hover {
|
||||||
|
@mixin mx_DialogButton_hover;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_RoomSettings_integrationsButton_error {
|
.mx_RoomSettings_integrationsButton_error {
|
||||||
position: relative;
|
position: relative;
|
||||||
cursor: not-allowed;
|
cursor: not-allowed;
|
||||||
|
|
|
@ -154,6 +154,9 @@ $progressbar-color: #000;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@define-mixin mx_DialogButton_hover {
|
||||||
|
}
|
||||||
|
|
||||||
@define-mixin mx_DialogButton_small {
|
@define-mixin mx_DialogButton_small {
|
||||||
@mixin mx_DialogButton;
|
@mixin mx_DialogButton;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
|
|
|
@ -102,7 +102,7 @@ limitations under the License.
|
||||||
width: 74px;
|
width: 74px;
|
||||||
height: 74px;
|
height: 74px;
|
||||||
border-radius: 37px;
|
border-radius: 37px;
|
||||||
box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.5);
|
box-shadow: 0px 5px 16px 0px rgba(0,0,0,0.2);
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: -36px;
|
top: -36px;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
|
@ -134,6 +134,12 @@ limitations under the License.
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
margin-bottom: 14px;
|
margin-bottom: 14px;
|
||||||
|
transition: background-color .2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_Login_field:focus {
|
||||||
|
border: 1px solid transparent;
|
||||||
|
background-color: $form-field-bg-hover-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_Login_field::-webkit-input-placeholder {
|
.mx_Login_field::-webkit-input-placeholder {
|
||||||
|
@ -190,8 +196,7 @@ limitations under the License.
|
||||||
|
|
||||||
.mx_Login_forgot {
|
.mx_Login_forgot {
|
||||||
display: block;
|
display: block;
|
||||||
font-size: 13px;
|
font-size: 15px;
|
||||||
opacity: 0.8;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_Login_forgot:link {
|
.mx_Login_forgot:link {
|
||||||
|
|
|
@ -37,6 +37,10 @@ a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
h1,h2,h3,h4,h5 {
|
h1,h2,h3,h4,h5 {
|
||||||
color: $header-color;
|
color: $header-color;
|
||||||
font-family: $header-font-family;
|
font-family: $header-font-family;
|
||||||
|
@ -49,6 +53,7 @@ $form-bg-color: $callout-color;
|
||||||
$form-fg-color: #ffffff;
|
$form-fg-color: #ffffff;
|
||||||
|
|
||||||
$form-field-bg-color: rgba(244, 242, 247, 0.12);
|
$form-field-bg-color: rgba(244, 242, 247, 0.12);
|
||||||
|
$form-field-bg-hover-color: rgba(255, 255, 255, 0.2);
|
||||||
$form-field-fg-color: #ffffff;
|
$form-field-fg-color: #ffffff;
|
||||||
|
|
||||||
// ***** End of Status theme specifics ******
|
// ***** End of Status theme specifics ******
|
||||||
|
@ -63,6 +68,7 @@ $focus-bg-color: #dddddd;
|
||||||
// button UI (white-on-green in light skin)
|
// button UI (white-on-green in light skin)
|
||||||
$accent-fg-color: #ffffff;
|
$accent-fg-color: #ffffff;
|
||||||
$accent-color: #6CC1F6;
|
$accent-color: #6CC1F6;
|
||||||
|
$accent-hover-color: #84cfff;
|
||||||
|
|
||||||
$selection-fg-color: $primary-bg-color;
|
$selection-fg-color: $primary-bg-color;
|
||||||
|
|
||||||
|
@ -195,6 +201,11 @@ $progressbar-color: #000;
|
||||||
padding-left: 1.5em;
|
padding-left: 1.5em;
|
||||||
padding-right: 1.5em;
|
padding-right: 1.5em;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
transition: background-color .2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
@define-mixin mx_DialogButton_hover {
|
||||||
|
background-color: $accent-hover-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
@define-mixin mx_DialogButton_small {
|
@define-mixin mx_DialogButton_small {
|
||||||
|
|
Loading…
Add table
Reference in a new issue