3e84d8b3b6
- Swap the telephone input with FieldText. - Swap the dropdown trigger input with FieldText for styling consistency with the telephone input. - Wrap the dropdown trigger so it can be modified with jitsi css. - Use flexbox to have the trigger and input align horizontally but have the input take up width if the trigger is not displayed.
82 lines
1.4 KiB
SCSS
82 lines
1.4 KiB
SCSS
/**
|
|
* The dialog content element.
|
|
*/
|
|
.dial-out-content {
|
|
margin-top: 5px;
|
|
|
|
/**
|
|
* Wrap the contents in flex so items can be aligned on the same line.
|
|
*/
|
|
.form-control {
|
|
display: flex;
|
|
}
|
|
|
|
/**
|
|
* The style of the flag icon.
|
|
*/
|
|
.dial-out-flag-icon {
|
|
position: absolute;
|
|
left: 5px;
|
|
top: 50%;
|
|
transform: translate(0, -50%);
|
|
}
|
|
|
|
/**
|
|
* The style of the dial code element.
|
|
*/
|
|
.dial-out-code {
|
|
margin-bottom: 0;
|
|
padding-left: 25px;
|
|
}
|
|
|
|
/**
|
|
* The dial-out dialog error element.
|
|
*/
|
|
.dial-out-error {
|
|
color: $errorColor;
|
|
}
|
|
|
|
/**
|
|
* The style of the dial input element.
|
|
*/
|
|
.dial-out-input {
|
|
display: inline-block;
|
|
flex: 1;
|
|
margin-left: 5px;
|
|
}
|
|
|
|
/**
|
|
* Re-styling the default dropdown inside the dial-out-content.
|
|
*/
|
|
.dropdown {
|
|
position: relative;
|
|
width: 65px;
|
|
}
|
|
|
|
/**
|
|
* Re-styling the default form-control inside the dial-out-content.
|
|
*/
|
|
.form-control {
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.dropdown {
|
|
position: relative;
|
|
|
|
input {
|
|
padding-left: 16px;
|
|
|
|
&:read-only {
|
|
color: inherit;
|
|
}
|
|
}
|
|
}
|
|
|
|
.dropdown-trigger-icon {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 50%;
|
|
transform: translate(0, -50%);
|
|
}
|
|
}
|