mirror of
https://github.com/element-hq/element-web
synced 2024-11-26 19:26:04 +03:00
Cosmetics to go with matrix-org/matrix-react-sdk#811
This commit is contained in:
parent
15accf33f5
commit
1e139ef183
4 changed files with 84 additions and 7 deletions
|
@ -18,6 +18,9 @@ limitations under the License.
|
|||
|
||||
var React = require('react');
|
||||
|
||||
const i = [1, 2, 3, 4, 5][Math.floor(Math.random() * 5)];
|
||||
const DEFAULT_LOGO_URI = "img/logos/riot-logo-" + i + ".svg";
|
||||
|
||||
module.exports = React.createClass({
|
||||
displayName: 'VectorLoginHeader',
|
||||
statics: {
|
||||
|
@ -30,7 +33,7 @@ module.exports = React.createClass({
|
|||
render: function() {
|
||||
return (
|
||||
<div className="mx_Login_logo">
|
||||
<img src={this.props.icon || "img/logo.png"} alt="Riot"/>
|
||||
<img src={this.props.icon || DEFAULT_LOGO_URI} alt="Riot"/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -65,7 +65,7 @@ input[type=text].error, input[type=password].error {
|
|||
border: 1px solid $warning-color;
|
||||
}
|
||||
|
||||
input[type=text]:focus, textarea:focus {
|
||||
input[type=text]:focus, input[type=password]:focus, textarea:focus {
|
||||
border: 1px solid $accent-color;
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
|
|
|
@ -66,10 +66,6 @@ limitations under the License.
|
|||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.mx_Login_username {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.mx_Login_fieldLabel {
|
||||
margin-top: -10px;
|
||||
margin-left: 8px;
|
||||
|
@ -167,6 +163,66 @@ limitations under the License.
|
|||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.mx_Login_type_container {
|
||||
display: flex;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.mx_Login_type_label {
|
||||
flex-grow: 1;
|
||||
line-height: 35px;
|
||||
}
|
||||
|
||||
.mx_Login_type_dropdown {
|
||||
width: 125px;
|
||||
align-self: flex-end;
|
||||
}
|
||||
|
||||
.mx_Login_username_group {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.mx_Login_username_prefix {
|
||||
height: 33px;
|
||||
padding: 0px 5px;
|
||||
line-height: 33px;
|
||||
|
||||
background-color: #eee;
|
||||
border: 1px solid #c7c7c7;
|
||||
border-right: 0px;
|
||||
border-radius: 3px 0px 0px 3px;
|
||||
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mx_Login_username_suffix {
|
||||
height: 33px;
|
||||
padding: 0px 5px;
|
||||
line-height: 33px;
|
||||
|
||||
background-color: #eee;
|
||||
border: 1px solid #c7c7c7;
|
||||
border-left: 0px;
|
||||
border-radius: 0px 3px 3px 0px;
|
||||
|
||||
text-align: center;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.mx_Login_username {
|
||||
flex-shrink: 1;
|
||||
min-width: 0px;
|
||||
border-radius: 3px;
|
||||
/* The "@" is always prefixed, so no rounded corners */
|
||||
border-top-left-radius: 0px;
|
||||
border-bottom-left-radius: 0px;
|
||||
}
|
||||
|
||||
.mx_Login_field_has_suffix {
|
||||
border-top-right-radius: 0px;
|
||||
border-bottom-right-radius: 0px;
|
||||
}
|
||||
|
||||
.mx_Login_phoneSection {
|
||||
display: table;
|
||||
}
|
||||
|
@ -176,6 +232,20 @@ limitations under the License.
|
|||
width: 70px;
|
||||
}
|
||||
|
||||
.mx_Login_phoneCountry .mx_Dropdown_option {
|
||||
/*
|
||||
To match height of mx_Login_field
|
||||
33px + 2px border from mx_Dropdown_option = 35px
|
||||
*/
|
||||
height: 33px;
|
||||
line-height: 33px;
|
||||
}
|
||||
|
||||
.mx_Login_phoneCountry .mx_Dropdown_option img {
|
||||
margin: 4px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.mx_Login_phoneNumberField {
|
||||
width: 210px;
|
||||
margin-left: 3px;
|
||||
|
|
|
@ -27,6 +27,10 @@ limitations under the License.
|
|||
user-select: none;
|
||||
}
|
||||
|
||||
.mx_Dropdown_input:focus {
|
||||
border-color: $accent-color;
|
||||
}
|
||||
|
||||
.mx_Dropdown_arrow {
|
||||
border-color: $primary-fg-color transparent transparent;
|
||||
border-style: solid;
|
||||
|
@ -74,7 +78,7 @@ input.mx_Dropdown_option, input.mx_Dropdown_option:focus {
|
|||
border: 1px solid $accent-color;
|
||||
background-color: $primary-bg-color;
|
||||
max-height: 200px;
|
||||
overflow-y: scroll;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.mx_Dropdown_menu .mx_Dropdown_option_highlight {
|
||||
|
|
Loading…
Reference in a new issue