Switch from SASS to CSS variables

This commit is contained in:
Maximilian Mader 2023-11-04 18:07:34 +01:00 committed by Tim Düsterhus
parent 075ce3fa15
commit 837874d925
Signed by: TimWolla
GPG Key ID: 8FF75566094168AF
1 changed files with 14 additions and 14 deletions

View File

@ -172,7 +172,7 @@ $chatEmbedMaxWidth: 400px;
} }
.chatRoomTopic { .chatRoomTopic {
border-left: 5px solid $wcfContentBorderInner; border-left: 5px solid var(--wcfContentBorderInner);
padding: 5px 0px 5px 10px; padding: 5px 0px 5px 10px;
margin-bottom: 10px; margin-bottom: 10px;
@ -352,7 +352,7 @@ $chatEmbedMaxWidth: 400px;
} }
&.first { &.first {
border-top: 1px solid $wcfContentBorderInner; border-top: 1px solid var(--wcfContentBorderInner);
.chatMessageContainer { .chatMessageContainer {
.chatMessageSide { .chatMessageSide {
@ -406,14 +406,14 @@ $chatEmbedMaxWidth: 400px;
#chatInputContainer { #chatInputContainer {
margin-top: 10px; margin-top: 10px;
margin-bottom: 1.48 * $wcfFontSizeDefault; // 1.48 is the default line height margin-bottom: calc(1.48 * var(--wcfFontSizeDefault)); // 1.48 is the default line height
clear: both; clear: both;
.charCounter { .charCounter {
float: right; float: right;
color: $wcfContentDimmedText; color: var(--wcfContentDimmedText);
margin-bottom: -(1.48 * $wcfFontSizeDefault); margin-bottom: calc(-1.48 * var(--wcfFontSizeDefault));
} }
textarea { textarea {
@ -511,12 +511,12 @@ $chatEmbedMaxWidth: 400px;
&.active, &.active,
&.active:hover { &.active:hover {
color: $wcfButtonTextActive !important; color: var(--wcfButtonTextActive) !important;
} }
&:not(.active) { &:not(.active) {
background-color: transparent; background-color: transparent;
color: $wcfDropdownLink; color: var(--wcfDropdownLink);
} }
border-radius: 0; border-radius: 0;
@ -560,12 +560,12 @@ $chatEmbedMaxWidth: 400px;
flex-direction: column; flex-direction: column;
pointer-events: all; pointer-events: all;
background-color: $wcfContentBackground; background-color: var(--wcfContentBackground);
.modalCloseButton { .modalCloseButton {
border-top: 1px solid $wcfContentBorderInner; border-top: 1px solid var(--wcfContentBorderInner);
background-color: $wcfSidebarBackground; background-color: var(--wcfSidebarBackground);
color: $wcfSidebarLink; color: var(--wcfSidebarLink);
display: block; display: block;
padding: 10px 20px; padding: 10px 20px;
text-align: center; text-align: center;
@ -588,7 +588,7 @@ $chatEmbedMaxWidth: 400px;
> li { > li {
margin-right: 10px; margin-right: 10px;
margin-bottom: 5px; margin-bottom: 5px;
border-right: 1px solid $wcfContentBorderInner; border-right: 1px solid var(--wcfContentBorderInner);
padding-right: 9px; padding-right: 9px;
> a { > a {
@ -608,8 +608,8 @@ $chatEmbedMaxWidth: 400px;
#smileyPickerContainer { #smileyPickerContainer {
> .messageTabMenuContent { > .messageTabMenuContent {
background-color: $wcfContentContainerBackground; background-color: var(--wcfContentContainerBackground);
border: 1px solid $wcfContentBorderInner; border: 1px solid var(--wcfContentBorderInner);
padding: 20px; padding: 20px;
margin-top: 20px; margin-top: 20px;
margin-bottom: 20px; margin-bottom: 20px;