cinny/src/app/organisms/create-channel/CreateChannel.scss
2021-07-28 18:45:52 +05:30

103 lines
No EOL
2.2 KiB
SCSS

.create-channel {
margin: 0 var(--sp-normal);
margin-right: var(--sp-extra-tight);
&__form > * {
margin-top: var(--sp-normal);
&:first-child {
margin-top: var(--sp-extra-tight);
}
}
&__address {
display: flex;
&__label {
color: var(--tc-surface-low);
margin-bottom: var(--sp-ultra-tight);
}
&__tip {
margin-left: 46px;
margin-top: var(--sp-ultra-tight);
[dir=rtl] & {
margin-left: 0;
margin-right: 46px;
}
}
& .text {
display: flex;
align-items: center;
padding: 0 var(--sp-normal);
border: 1px solid var(--bg-surface-border);
border-radius: var(--bo-radius);
color: var(--tc-surface-low);
}
& *:nth-child(2) {
flex: 1;
min-width: 0;
& .input {
border-radius: 0;
}
}
& .text:first-child {
border-right-width: 0;
border-radius: var(--bo-radius) 0 0 var(--bo-radius);
}
& .text:last-child {
border-left-width: 0;
border-radius: 0 var(--bo-radius) var(--bo-radius) 0;
}
[dir=rtl] & {
& .text:first-child {
border-left-width: 0;
border-right-width: 1px;
border-radius: 0 var(--bo-radius) var(--bo-radius) 0;
}
& .text:last-child {
border-right-width: 0;
border-left-width: 1px;
border-radius: var(--bo-radius) 0 0 var(--bo-radius);
}
}
}
&__name-wrapper {
display: flex;
align-items: flex-end;
& .input-container {
flex: 1;
min-width: 0;
margin-right: var(--sp-normal);
[dir=rtl] & {
margin-right: 0;
margin-left: var(--sp-normal);
}
}
& .btn-primary {
padding-top: 11px;
padding-bottom: 11px;
}
}
&__loading {
display: flex;
justify-content: center;
align-items: center;
& .text {
margin-left: var(--sp-normal);
[dir=rtl] & {
margin-left: 0;
margin-right: var(--sp-normal);
}
}
}
&__error {
text-align: center;
color: var(--bg-danger) !important;
}
[dir=rtl] & {
margin-right: var(--sp-normal);
margin-left: var(--sp-extra-tight);
}
}