26f9a41508
Added moderator icon changed styling for a name change message Now usernames collapse as long as the user is the same Imported two weights of Poppins and the OpenSans variable instead of def 400 This is some progress on #1859 and #1625
93 lines
1.6 KiB
SCSS
93 lines
1.6 KiB
SCSS
.root {
|
|
position: relative;
|
|
font-size: 0.9rem;
|
|
padding: 5px 15px 5px 5px;
|
|
padding-left: 1rem;
|
|
.background {
|
|
position: absolute;
|
|
z-index: -1;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: currentColor;
|
|
opacity: 0.07;
|
|
border-radius: .25rem;
|
|
overflow: hidden;
|
|
}
|
|
.user {
|
|
display: flex;
|
|
align-items: center;
|
|
font-family: var(--theme-header-font-family);
|
|
font-weight: bold;
|
|
.userName {
|
|
margin-left: .3rem;
|
|
}
|
|
}
|
|
.message {
|
|
color: var(--color-owncast-gray-300);
|
|
|
|
mark {
|
|
color: white;
|
|
padding: 0.1em 0.4em;
|
|
border-radius: 0.5em 0.3em;
|
|
background: transparent;
|
|
background-image: linear-gradient(
|
|
to right,
|
|
rgba(255, 225, 0, 0.1),
|
|
rgba(255, 225, 0, 0.358) 4%,
|
|
rgba(255, 225, 0, 0.3)
|
|
);
|
|
-webkit-box-decoration-break: clone;
|
|
box-decoration-break: clone;
|
|
}
|
|
}
|
|
|
|
.customBorder {
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 5px;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
&:after {
|
|
content: '';
|
|
width: 10px;
|
|
height: 100%;
|
|
position: absolute;
|
|
top: 0%;
|
|
right: 0px;
|
|
background-color: currentColor;
|
|
border-radius: var(--theme-rounded-corners);
|
|
}
|
|
}
|
|
|
|
&.ownMessage {
|
|
.customBorder {
|
|
left: auto;
|
|
right: 0px;
|
|
&:after {
|
|
left: 0px;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.modMenuWrapper {
|
|
position: absolute;
|
|
display: none;
|
|
top: 0;
|
|
right: 10px;
|
|
& button:focus,
|
|
& button:active {
|
|
display: block !important;
|
|
}
|
|
}
|
|
|
|
&:hover .modMenuWrapper {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
|