TeaWeb/shared/js/text/bbcode/InviteRenderer.scss

140 lines
2.7 KiB
SCSS

@import "../../../css/static/mixin";
.container {
margin-top: .25em;
display: flex;
flex-direction: row;
justify-content: center;
height: 3em;
background: #454545;
border-radius: .2em;
padding: .2em .3em;
&:not(:last-child) {
margin-bottom: .5em;
}
&.info, &.loading {
.left, .right {
display: flex;
flex-direction: column;
justify-content: center;
}
.right {
margin-left: 1em;
flex-shrink: 0;
flex-grow: 0;
width: 6em;
}
.left {
flex-grow: 1;
flex-shrink: 1;
height: 2.4em;
align-self: center;
min-width: 1em;
max-width: 20em;
line-height: 1.2em;
.loading {
display: block;
}
.joinServer {
flex-shrink: 1;
flex-grow: 0;
min-height: 0;
height: 1em;
overflow: hidden;
}
.channelName {
display: flex;
flex-direction: row;
justify-content: flex-start;
color: #b3b3b3;
font-weight: 700;
max-height: 1em;
.name {
margin-left: .25em;
align-self: center;
@include text-dotdotdot();
}
}
.serverName {
flex-shrink: 0;
color: #b3b3b3;
&.large {
max-height: 2.4em;
overflow: hidden;
font-weight: 700;
}
&.short {
max-height: 1.2em;
@include text-dotdotdot();
}
}
}
}
&.error {
flex-direction: column;
.containerError {
height: 2.4em;
color: #cf1717;
display: flex;
flex-direction: column;
justify-content: stretch;
&.noTitle {
justify-content: center;
.title {
display: none;
}
.message {
text-align: center;
}
}
.title {
flex-shrink: 1;
flex-grow: 0;
min-height: 0;
overflow: hidden;
}
.message {
flex-shrink: 0;
font-weight: 700;
max-height: 2.4em;
overflow: hidden;
line-height: 1.2em;
}
}
}
}