Ajay Bura
84 lines
1.8 KiB
SCSS
84 lines
1.8 KiB
SCSS
@use '../../partials/flex';
|
|
@use '../../partials/dir';
|
|
@use '../../partials/text';
|
|
|
|
.room-aliases {
|
|
&__message,
|
|
& .setting-tile {
|
|
margin: var(--sp-tight) var(--sp-normal);
|
|
}
|
|
& .setting-tile {
|
|
margin-bottom: var(--sp-loose);
|
|
}
|
|
|
|
&__alias-item {
|
|
padding: var(--sp-extra-tight) var(--sp-normal);
|
|
@extend .cp-fx__row--s-c;
|
|
&.checkbox {
|
|
@include dir.side(margin, 0 , var(--sp-tight));
|
|
}
|
|
& .text {
|
|
@extend .cp-fx__item-one;
|
|
@extend .cp-txt__ellipsis;
|
|
color: var(--tc-surface-high);
|
|
span {
|
|
margin: 0 var(--sp-extra-tight);
|
|
padding: 0 var(--sp-ultra-tight);
|
|
color: var(--bg-surface);
|
|
background-color: var(--tc-surface-low);
|
|
border-radius: 4px;
|
|
}
|
|
}
|
|
}
|
|
&__item-btns {
|
|
@include dir.side(margin, 48px, 0);
|
|
& button {
|
|
padding: var(--sp-ultra-tight) var(--sp-tight);
|
|
margin-bottom: var(--sp-tight);
|
|
@include dir.side(margin, 0, var(--sp-tight));
|
|
}
|
|
}
|
|
|
|
&__content {
|
|
margin-bottom: var(--sp-normal);
|
|
|
|
& .checkbox {
|
|
@include dir.side(margin, 0, var(--sp-tight));
|
|
min-width: 20px;
|
|
}
|
|
& > button {
|
|
margin: 0 var(--sp-normal);
|
|
}
|
|
}
|
|
|
|
&__form {
|
|
padding: var(--sp-normal);
|
|
padding-top: 0;
|
|
display: flex;
|
|
&-label {
|
|
padding: var(--sp-normal) var(--sp-normal) var(--sp-ultra-tight);
|
|
}
|
|
}
|
|
|
|
&__input-wrapper {
|
|
display: flex;
|
|
@extend .cp-fx__item-one;
|
|
@include dir.side(margin, 0, var(--sp-tight));
|
|
|
|
& .input-container {
|
|
@extend .cp-fx__item-one;
|
|
}
|
|
}
|
|
|
|
&__input-status {
|
|
padding: 0 var(--sp-normal);
|
|
}
|
|
&__valid {
|
|
color: var(--tc-positive-high);
|
|
padding-bottom: var(--sp-normal);
|
|
}
|
|
&__invalid {
|
|
color: var(--tc-danger-high);
|
|
padding-bottom: var(--sp-normal);
|
|
}
|
|
} |