kittyfangs
/
fchat-rising
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Dark and light theme support

This commit is contained in:
Mr. Stallion 2020-04-03 18:48:39 -05:00
parent 859151750c
commit c40b507a67
16 changed files with 306 additions and 91 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
chat/CharacterSearchHistory.vue
View File

@ -115,15 +115,20 @@
}
.form-row:hover {
background-color: #20203e;
border: 1px solid #2d2d6b;
// background-color: #20203e;
// border: 1px solid #2d2d6b;
backdrop-filter: invert(30%) !important;
border-radius: 2px;
}
.selected-row,
.form-row.selected-row:hover {
background-color: #343461;
border: 1px solid #6565b2;
/*background-color: #343461;*/
/*border: 1px solid #6565b2;*/
backdrop-filter: invert(20%) !important;
border-radius: 2px;
}
}

38
chat/ConversationView.vue
View File

@ -613,7 +613,7 @@
a.btn {
padding-left: 0.5rem;
padding-right: 0.5rem;
color: #cbcbe5;
// color: #cbcbe5;
i {
margin-right: 0.4rem;
@ -731,8 +731,8 @@
.message-time,
.message .message-time,
.ad-viewer .message-time {
background-color: #4f4f61;
color: #dadada;
background-color: var(--messageTimeBgColor);
color: var(--messageTimeFgColor);
border-radius: 3px;
padding-left: 3px;
padding-right: 3px;
@ -775,23 +775,23 @@
text-transform: uppercase;
&.match {
background-color: rgb(0, 142, 0);
border: solid 1px rgb(0, 113, 0);
background-color: var(--scoreMatchBg);
border: solid 1px var(--scoreMatchFg);
}
&.weak-match {
background-color: rgb(0, 80, 0);
border: 1px solid rgb(0, 64, 0);
background-color: var(--scoreWeakMatchBg);
border: 1px solid var(--scoreWeakMatchFg);
}
&.weak-mismatch {
background-color: rgb(152, 134, 0);
border: 1px solid rgb(142, 126, 0);
background-color: var(--scoreWeakMismatchBg);
border: 1px solid var(--scoreWeakMismatchFg);
}
&.mismatch {
background-color: rgb(171, 0, 0);
border: 1px solid rgb(128, 0, 0);
background-color: var(--scoreMismatchBg);
border: 1px solid var(--scoreMismatchFg);
}
}
}
@ -814,15 +814,15 @@
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
&.match {
border-left: 12px solid #048a04;
background-color: rgba(0, 110, 0, 0.47);
border-left: 12px solid var(--scoreStandoutMatchBorderColor);
background-color: var(--scoreStandoutMatchBgColor);
// border-left: 12px solid #027b02;
// background-color: rgba(1, 115, 1, 0.45);
}
&.weak-match {
border-left: 12px solid #014a01;
background-color: rgba(0, 79, 0, 0.4);
border-left: 12px solid var(--scoreStandoutWeakMatchBorderColor);
background-color: var(--scoreStandoutWeakMatchBgColor);
.bbcode {
filter: grayscale(0.25);
@ -831,7 +831,7 @@
}
&.neutral {
border-left: 12px solid #555;
border-left: 12px solid var(--scoreStandoutNeutralBorderColor);
.bbcode {
filter: grayscale(0.5);
@ -845,8 +845,8 @@
};
&.weak-mismatch {
background-color: rgba(208, 188, 0, 0.0);
border-left: 12px solid rgb(138, 123, 0);
border-left: 12px solid var(--scoreStandoutWeakMismatchBorderColor);
background-color: var(--scoreStandoutWeakMismatchBgColor);
.bbcode {
filter: grayscale(0.7);
@ -860,7 +860,7 @@
}
&.mismatch {
border-left: 12px solid #841a1a;
border-left: 12px solid var(--scoreStandoutMismatchBorderColor);
.bbcode {
filter: grayscale(0.8);

10
chat/StatusPicker.vue
View File

@ -100,15 +100,17 @@
}
.form-row:hover {
background-color: #20203e;
border: 1px solid #2d2d6b;
/*background-color: #20203e;*/
/*border: 1px solid #2d2d6b;*/
backdrop-filter: invert(30%) !important;
border-radius: 2px;
}
.selected-row,
.form-row.selected-row:hover {
background-color: #343461;
border: 1px solid #6565b2;
/*background-color: #343461;*/
/*border: 1px solid #6565b2;*/
backdrop-filter: invert(20%);
border-radius: 2px;
}
}

2
chat/preview/test-urls.txt
View File

@ -76,3 +76,5 @@ http://gfycatporn.com/deepthroat.php
Derpibooru
Pornhub GIFS
https://multporn.net/authors_comics/sefeiren

8
electron/Index.vue
View File

@ -1,5 +1,5 @@
<template>
<div @mouseover="onMouseOver" id="page" style="position:relative;padding:5px 10px 10px" @auxclick.prevent>
<div @mouseover="onMouseOver" id="page" style="position:relative;padding:5px 10px 10px" :class="getThemeClass()" @auxclick.prevent>
<div v-html="styling"></div>
<div v-if="!characters" style="display:flex; align-items:center; justify-content:center; height: 100%;">
<div class="card bg-light" style="width: 400px;">
@ -313,6 +313,12 @@
(this.$refs.characterPage as any).reload();
}
getThemeClass(): string {
return `theme-${this.settings.theme}`;
}
get styling(): string {
try {
return `<style>${fs.readFileSync(path.join(__dirname, `themes/${this.settings.theme}.css`), 'utf8').toString()}</style>`;

4
scss/_bbcode.scss
View File

@ -136,12 +136,12 @@ div.indentText {
.bbcode {
.fa-link {
color: white;
color: var(--linkForcedColor);
margin-right: 2px;
}
a.user-link {
color: white;
color: var(--linkForcedColor);
}
}

3
scss/_chat.scss
View File

@ -167,6 +167,7 @@
.message {
word-wrap: break-word;
padding-bottom: 1px;
padding-left: 5px;
}
.message-block {
@ -322,4 +323,4 @@ $genders: (
.nav-link {
cursor: pointer;
}
}

52
scss/_rising.scss Normal file
View File

@ -0,0 +1,52 @@
:root {
--scoreMatchBg: #{$scoreMatchBg};
--scoreMatchFg: #{$scoreMatchFg};
--scoreWeakMatchBg: #{$scoreWeakMatchBg};
--scoreWeakMatchFg: #{$scoreWeakMatchFg};
--scoreWeakMismatchBg: #{$scoreWeakMismatchBg};
--scoreWeakMismatchFg: #{$scoreWeakMismatchFg};
--scoreMismatchBg: #{$scoreMismatchBg};
--scoreMismatchFg: #{$scoreMismatchFg};
--scoreTitleColor: #{$scoreTitleColor};
--scoreMinimizeButtonFg: #{$scoreMinimizeButtonFg};
--scoreMinimizeButtonBg: #{$scoreMinimizeButtonBg};
--scoreReportBg: #{$scoreReportBg};
--scoreFadedMatchBg: #{$scoreFadedMatchBg};
--scoreFadedMatchFg: #{$scoreFadedMatchFg};
--scoreFadedWeakMatchBg: #{$scoreFadedWeakMatchBg};
--scoreFadedWeakMatchFg: #{$scoreFadedWeakMatchFg};
--scoreFadedWeakMismatchBg: #{$scoreFadedWeakMismatchBg};
--scoreFadedWeakMismatchFg: #{$scoreFadedWeakMismatchFg};
--scoreFadedMismatchBg: #{$scoreFadedMismatchBg};
--scoreFadedMismatchFg: #{$scoreFadedMismatchFg};
--scoreStandoutMatchBorderColor: #{$scoreStandoutMatchBorderColor};
--scoreStandoutMatchBgColor: #{$scoreStandoutMatchBgColor};
--scoreStandoutWeakMatchBorderColor: #{$scoreStandoutWeakMatchBorderColor};
--scoreStandoutWeakMatchBgColor: #{$scoreStandoutWeakMatchBgColor};
--scoreStandoutNeutralBorderColor: #{$scoreStandoutNeutralBorderColor};
--scoreStandoutWeakMismatchBorderColor: #{$scoreStandoutWeakMismatchBorderColor};
--scoreStandoutWeakMismatchBgColor: #{$scoreStandoutWeakMismatchBgColor};
--scoreStandoutMismatchBorderColor: #{$scoreStandoutMismatchBorderColor};
--characterImageWrapperBg: #{$characterImageWrapperBg};
--characterGuestbookPostBg: #{$characterGuestbookPostBg};
--characterGuestbookPostBorderColor: #{$characterGuestbookPostBorderColor};
--characterGuestbookReplyBg: #{$characterGuestbookReplyBg};
--characterGuestbookTimestampFg: #{$characterGuestbookTimestampFg};
--characterKinkCustomColor: #{$characterKinkCustomColor};
--characterKinkCustomBorderColor: #{$characterKinkCustomBorderColor};
--characterKinkStockColor: #{$characterKinkStockColor};
--characterKinkStockHighlightedColor: #{$characterKinkStockHighlightedColor};
--characterInfotagColor: #{$characterInfotagColor};
--messageTimeBgColor: #{$messageTimeBgColor};
--messageTimeFgColor: #{$messageTimeFgColor};
--headerBackgroundMaskColor: #{$headerBackgroundMaskColor};
--linkForcedColor: #{$linkForcedColor};
--tabSecondaryFgColor: #{$tabSecondaryFgColor};
}

1
scss/themes/_chat.scss
View File

@ -32,6 +32,7 @@
@import "../bbcode_editor";
@import "../bbcode";
@import "../flist_overrides";
@import "../rising";
* {
&::-webkit-scrollbar-track {

2
scss/themes/chat/dark.scss
View File

@ -30,4 +30,4 @@
background-color: $gray-700;
}
}
}
}

2
scss/themes/chat/default.scss
View File

@ -30,4 +30,4 @@
background-color: $gray-700;
}
}
}
}

2
scss/themes/chat/light.scss
View File

@ -30,4 +30,4 @@
background-color: $gray-500;
}
}
}
}

53
scss/themes/variables/_dark_variables.scss
View File

@ -59,4 +59,55 @@ $pagination-active-color: $link-color;
$text-background-color: $gray-100;
$text-background-color-disabled: $gray-200;
@import "invert";
// F-List Rising
$scoreMatchBg: rgb(0, 142, 0);
$scoreMatchFg: rgb(0, 113, 0);
$scoreWeakMatchBg: rgb(0, 80, 0);
$scoreWeakMatchFg: rgb(0, 64, 0);
$scoreWeakMismatchBg: rgb(152, 134, 0);
$scoreWeakMismatchFg: rgb(142, 126, 0);
$scoreMismatchBg: rgb(171, 0, 0);
$scoreMismatchFg: rgb(128, 0, 0);
$scoreTitleColor: white;
$scoreMinimizeButtonFg: rgba(255, 255, 255, 0.7);
$scoreMinimizeButtonBg: rgba(0,0,0,0.2);
$scoreReportBg: rgba(0,0,0,0.2);
$scoreFadedMatchBg: adjust-color($scoreMatchBg, $alpha: -0.6);
$scoreFadedMatchFg: adjust-color($scoreMatchFg, $alpha: -0.6);
$scoreFadedWeakMatchBg: adjust-color($scoreWeakMatchBg, $alpha: -0.6);
$scoreFadedWeakMatchFg: adjust-color($scoreWeakMatchFg, $alpha: -0.6);
$scoreFadedWeakMismatchBg: adjust-color($scoreWeakMismatchBg, $alpha: -0.6);
$scoreFadedWeakMismatchFg: adjust-color($scoreWeakMismatchFg, $alpha: -0.6);
$scoreFadedMismatchBg: adjust-color($scoreMismatchBg, $alpha: -0.6);
$scoreFadedMismatchFg: adjust-color($scoreMismatchFg, $alpha: -0.6);
$scoreStandoutMatchBorderColor: #048a04;
$scoreStandoutMatchBgColor: rgba(0, 110, 0, 0.47);
$scoreStandoutWeakMatchBorderColor: #014a01;
$scoreStandoutWeakMatchBgColor: rgba(0, 79, 0, 0.4);
$scoreStandoutNeutralBorderColor: #555;
$scoreStandoutWeakMismatchBorderColor: rgb(138, 123, 0);
$scoreStandoutWeakMismatchBgColor: rgba(208, 188, 0, 0.0);
$scoreStandoutMismatchBorderColor: #841a1a;
$characterImageWrapperBg: rgba(0,0,0, 0.2);
$characterGuestbookPostBg: rgba(0,0,0,0.15);
$characterGuestbookPostBorderColor: rgba(255, 255, 255, 0.1);
$characterGuestbookReplyBg: rgba(0,0,0, 0.1);
$characterGuestbookTimestampFg: rgba(255, 255, 255, 0.3);
$characterKinkCustomColor: #f2cd00;
$characterKinkCustomBorderColor: rgba(255, 255, 255, 0.1);
$characterKinkStockColor: #ededf6;
$characterKinkStockHighlightedColor: #ffffff;
$characterInfotagColor: rgba(255, 255, 255, 0.7);
$messageTimeBgColor: #4f4f61;
$messageTimeFgColor: #dadada;
$headerBackgroundMaskColor: #202020;
$linkForcedColor: white;
$tabSecondaryFgColor: rgba(255, 255, 255, 0.5);
@import "invert";

54
scss/themes/variables/_default_variables.scss
View File

@ -58,4 +58,56 @@ $pagination-active-color: $link-color;
$text-background-color: $gray-200;
$text-background-color-disabled: $gray-100;
@import "invert";
// F-List Rising
$scoreMatchBg: rgb(0, 142, 0);
$scoreMatchFg: rgb(0, 113, 0);
$scoreWeakMatchBg: rgb(0, 80, 0);
$scoreWeakMatchFg: rgb(0, 64, 0);
$scoreWeakMismatchBg: rgb(152, 134, 0);
$scoreWeakMismatchFg: rgb(142, 126, 0);
$scoreMismatchBg: rgb(171, 0, 0);
$scoreMismatchFg: rgb(128, 0, 0);
$scoreTitleColor: white;
$scoreMinimizeButtonFg: rgba(255, 255, 255, 0.7);
$scoreMinimizeButtonBg: rgba(0,0,0,0.2);
$scoreReportBg: rgba(0,0,0,0.2);
$scoreFadedMatchBg: adjust-color($scoreMatchBg, $alpha: -0.6);
$scoreFadedMatchFg: adjust-color($scoreMatchFg, $alpha: -0.6);
$scoreFadedWeakMatchBg: adjust-color($scoreWeakMatchBg, $alpha: -0.6);
$scoreFadedWeakMatchFg: adjust-color($scoreWeakMatchFg, $alpha: -0.6);
$scoreFadedWeakMismatchBg: adjust-color($scoreWeakMismatchBg, $alpha: -0.6);
$scoreFadedWeakMismatchFg: adjust-color($scoreWeakMismatchFg, $alpha: -0.6);
$scoreFadedMismatchBg: adjust-color($scoreMismatchBg, $alpha: -0.6);
$scoreFadedMismatchFg: adjust-color($scoreMismatchFg, $alpha: -0.6);
$scoreStandoutMatchBorderColor: #048a04;
$scoreStandoutMatchBgColor: rgba(0, 110, 0, 0.47);
$scoreStandoutWeakMatchBorderColor: #014a01;
$scoreStandoutWeakMatchBgColor: rgba(0, 79, 0, 0.4);
$scoreStandoutNeutralBorderColor: #555;
$scoreStandoutWeakMismatchBorderColor: rgb(138, 123, 0);
$scoreStandoutWeakMismatchBgColor: rgba(208, 188, 0, 0.0);
$scoreStandoutMismatchBorderColor: #841a1a;
$characterImageWrapperBg: rgba(0,0,0, 0.2);
$characterGuestbookPostBg: rgba(0,0,0,0.15);
$characterGuestbookPostBorderColor: rgba(255, 255, 255, 0.1);
$characterGuestbookReplyBg: rgba(0,0,0, 0.1);
$characterGuestbookTimestampFg: rgba(255, 255, 255, 0.3);
$characterKinkCustomColor: #f2cd00;
$characterKinkCustomBorderColor: rgba(255, 255, 255, 0.1);
$characterKinkStockColor: #ededf6;
$characterKinkStockHighlightedColor: #ffffff;
$characterInfotagColor: rgba(255, 255, 255, 0.7);
$messageTimeBgColor: #4f4f61;
$messageTimeFgColor: #dadada;
$headerBackgroundMaskColor: #2a2a54;
$linkForcedColor: white;
$tabSecondaryFgColor: rgba(255, 255, 255, 0.5);
@import "invert";

55
scss/themes/variables/_light_variables.scss
View File

@ -11,4 +11,57 @@ $gray-900: #191919 !default;
$secondary: $gray-400;
$body-bg: $gray-100;
$text-muted: $gray-500;
$text-muted: $gray-500;
// F-List Rising
$scoreMatchBg: rgba(0, 180, 0, 0.65);
$scoreMatchFg: rgba(0, 133, 0, 0.4);
$scoreWeakMatchBg: rgba(0, 180, 0, 0.22);
$scoreWeakMatchFg: rgba(0, 133, 0, 0.20);
$scoreWeakMismatchBg: rgba(227, 189, 0, 0.5);
$scoreWeakMismatchFg: rgba(192, 160, 0, 0.5);
$scoreMismatchBg: rgba(192, 0, 0, 0.35);
$scoreMismatchFg: rgba(148, 0, 0, 0.3);
$scoreTitleColor: black;
$scoreMinimizeButtonFg: rgba(255, 255, 255, 0.6);
$scoreMinimizeButtonBg: rgba(0,0,0,0.1);
$scoreReportBg: rgba(0,0,0,0.08);
$scoreFadedMatchBg: adjust-color($scoreMatchBg, $alpha: -0.6);
$scoreFadedMatchFg: adjust-color($scoreMatchFg, $alpha: -0.6);
$scoreFadedWeakMatchBg: adjust-color($scoreWeakMatchBg, $alpha: -0.6);
$scoreFadedWeakMatchFg: adjust-color($scoreWeakMatchFg, $alpha: -0.6);
$scoreFadedWeakMismatchBg: adjust-color($scoreWeakMismatchBg, $alpha: -0.6);
$scoreFadedWeakMismatchFg: adjust-color($scoreWeakMismatchFg, $alpha: -0.6);
$scoreFadedMismatchBg: adjust-color($scoreMismatchBg, $alpha: -0.6);
$scoreFadedMismatchFg: adjust-color($scoreMismatchFg, $alpha: -0.6);
$scoreStandoutMatchBorderColor: #059e05;
$scoreStandoutMatchBgColor: rgba(53, 225, 53, 0.4);
$scoreStandoutWeakMatchBorderColor: #016c01;
$scoreStandoutWeakMatchBgColor: rgba(85, 191, 85, 0.2);
$scoreStandoutNeutralBorderColor: #888;
$scoreStandoutWeakMismatchBorderColor: #c18f02;
$scoreStandoutWeakMismatchBgColor: rgba(208, 188, 0, 0.0);
$scoreStandoutMismatchBorderColor: #a01a1a;
$characterImageWrapperBg: rgba(0,0,0, 0.2);
$characterGuestbookPostBg: rgba(0,0,0,0.08);
$characterGuestbookPostBorderColor: rgba(0, 0, 0, 0.06);
$characterGuestbookReplyBg: rgba(0,0,0, 0.05);
$characterGuestbookTimestampFg: rgba(0, 0, 0, 0.4);
$characterKinkCustomColor: #0072ec;
$characterKinkCustomBorderColor: rgba(0, 0, 0, 0.1);
$characterKinkStockColor: #444444;
$characterKinkStockHighlightedColor: #333333;
$characterInfotagColor: rgba(0, 0, 0, 0.7);
$messageTimeBgColor: #dadada;
$messageTimeFgColor: #4f4f61;
$headerBackgroundMaskColor: #e5e5e5;
$linkForcedColor: #007bff;
$tabSecondaryFgColor: rgba(0, 0, 0, 0.4);

98
site/character_page/character_page.vue
View File

@ -468,18 +468,18 @@
.kink-name {
font-weight: bold;
color: #f2cd00;
color: var(--characterKinkCustomColor);
}
i {
color: #f2cd00;
color: var(--characterKinkCustomColor);
}
margin-top: 7px;
margin-bottom: 7px;
margin-left: -6px;
margin-right: -6px;
border: 1px rgba(255, 255, 255, 0.1) solid;
border: 1px var(--characterKinkCustomBorderColor) solid;
border-radius: 2px;
/* border-collapse: collapse; */
padding: 5px;
@ -488,14 +488,14 @@
.stock-kink {
.kink-name, i {
color: #ededf6;
color: var(--characterKinkStockColor);
font-weight: normal;
}
&.highlighted {
.kink-name, i {
font-weight: bold;
color: #ffffff;
color: var(--characterKinkStockHighlightedColor);
}
}
}
@ -521,7 +521,7 @@
display: block;
font-weight: normal;
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.7);
color: var(--characterInfotagColor);
line-height: 125%;
}
@ -532,7 +532,7 @@
font-weight: normal !important;
line-height: 120%;
font-size: 85%;
color: rgba(255, 255, 255, 0.7);
color: var(--characterInfotagColor);
}
@ -554,29 +554,29 @@
font-weight: normal !important;
line-height: 120%;
font-size: 85%;
color: rgba(255, 255, 255, 0.7);
color: var(--characterInfotagColor);
}
.quick-info {
margin-bottom: 1rem;
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.7);
color: var(--characterInfotagColor);
}
.guestbook-post {
margin-bottom: 15px;
margin-top: 15px;
background-color: rgba(0,0,0,0.15);
background-color: var(--characterGuestbookPostBg);
border-radius: 5px;
padding: 15px;
border: 1px solid rgba(255, 255, 255, 0.1);
border: 1px solid var(--characterGuestbookPostBorderColor);
.characterLink {
font-size: 20pt;
}
.guestbook-timestamp {
color: rgba(255, 255, 255, 0.3);
color: var(--characterGuestbookTimestampFg);
font-size: 85%
}
@ -587,7 +587,7 @@
.guestbook-reply {
margin-top: 20px;
background-color: rgba(0,0,0, 0.1);
background-color: var(--characterGuestbookReplyBg);
padding: 15px;
border-radius: 4px;
}
@ -630,7 +630,7 @@
.character-image-wrapper {
display: inline-block;
background-color: rgba(0,0,0, 0.2);
background-color: var(--characterImageWrapperBg);
border-radius: 5px;
box-sizing: border-box;
margin: 5px;
@ -682,7 +682,7 @@
.match-report {
display: flex;
flex-direction: row;
background-color: rgba(0,0,0,0.2);
background-color: var(--scoreReportBg);
/* width: 100%; */
margin-top: -1.2rem;
margin-left: -1.2rem;
@ -719,12 +719,12 @@
position: absolute;
display: block;
right: 0.5rem;
background-color: rgba(0,0,0,0.2);
background-color: var(--scoreMinimizeButtonBg);
padding: 0.4rem;
padding-top: 0.2rem;
padding-bottom: 0.2rem;
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.7);
color: var(--scoreMinimizeButtonFg);
border-radius: 4px;
z-index: 1000;
}
@ -757,7 +757,7 @@
padding-right: 4px;
span {
color: white;
color: var(--scoreTitleColor);
font-weight: bold;
}
}
@ -777,84 +777,74 @@
}
}
$scoreMatchBg: rgb(0, 142, 0);
$scoreMatchFg: rgb(0, 113, 0);
$scoreWeakMatchBg: rgb(0, 80, 0);
$scoreWeakMatchFg: rgb(0, 64, 0);
$scoreWeakMismatchBg: rgb(152, 134, 0);
$scoreWeakMismatchFg: rgb(142, 126, 0);
$scoreMismatchBg: rgb(171, 0, 0);
$scoreMismatchFg: rgb(128, 0, 0);
.character-kinks-block .character-kink.comparison-favorite,
.match-report .scores .match-score.match,
.infotag.match {
background-color: $scoreMatchBg;
border: solid 1px $scoreMatchFg;
background-color: var(--scoreMatchBg);
border: solid 1px var(--scoreMatchFg);
}
.character-kinks-block .character-kink.comparison-yes,
.match-report .scores .match-score.weak-match,
.infotag.weak-match {
background-color: $scoreWeakMatchBg;
border: 1px solid $scoreWeakMatchFg;
background-color: var(--scoreWeakMatchBg);
border: 1px solid var(--scoreWeakMatchFg);
}
.character-kinks-block .character-kink.comparison-maybe,
.match-report .scores .match-score.weak-mismatch,
.infotag.weak-mismatch {
background-color: $scoreWeakMismatchBg;
border: 1px solid $scoreWeakMismatchFg;
background-color: var(--scoreWeakMismatchBg);
border: 1px solid var(--scoreWeakMismatchFg);
}
.character-kinks-block .character-kink.comparison-no,
.match-report .scores .match-score.mismatch,
.infotag.mismatch {
background-color: $scoreMismatchBg;
border: 1px solid $scoreMismatchFg;
background-color: var(--scoreMismatchBg);
border: 1px solid var(--scoreMismatchFg);
}
.character-kinks-block .highlighting {
.character-kink {
&.comparison-favorite {
background-color: adjust-color($scoreMatchBg, $alpha: -0.6);
border-color: adjust-color($scoreMatchFg, $alpha: -0.6);
background-color: var(--scoreFadedMatchBg);
border-color: var(--scoreFadedMatchFg);
&.highlighted {
background-color: $scoreMatchBg;
border-color: $scoreMatchFg;
background-color: var(--scoreMatchBg);
border-color: var(--scoreMatchFg);
}
}
&.comparison-yes {
background-color: adjust-color($scoreWeakMatchBg, $alpha: -0.6);
border-color: adjust-color($scoreWeakMatchFg, $alpha: -0.6);
background-color: var(--scoreWeakMatchBg);
border-color: var(--scoreWeakMatchFg);
&.highlighted {
background-color: $scoreWeakMatchBg;
border-color: $scoreWeakMatchFg;
background-color: var(--scoreWeakMatchBg);
border-color: var(--scoreWeakMatchFg);
}
}
&.comparison-maybe {
background-color: adjust-color($scoreWeakMismatchBg, $alpha: -0.6);
border-color: adjust-color($scoreWeakMismatchFg, $alpha: -0.6);
background-color: var(--scoreWeakMismatchBg);
border-color: var(--scoreWeakMismatchFg);
&.highlighted {
background-color: $scoreWeakMismatchBg;
border-color: $scoreWeakMismatchFg;
background-color: var(--scoreWeakMismatchBg);
border-color: var(--scoreWeakMismatchFg);
}
}
&.comparison-no {
background-color: adjust-color($scoreMismatchBg, $alpha: -0.6);
border-color: adjust-color($scoreMismatchFg, $alpha: -0.6);
background-color: var(--scoreMismatchBg);
border-color: var(--scoreMismatchFg);
&.highlighted {
background-color: $scoreMismatchBg;
border-color: $scoreMismatchFg;
background-color: var(--scoreMismatchBg);
border-color: var(--scoreMismatchFg);
}
}
}
@ -862,7 +852,7 @@
.tab-count {
color: rgba(255, 255, 255, 0.5);
color: var(--tabSecondaryFgColor);
}
@ -870,7 +860,7 @@
position: sticky;
top: -1rem;
z-index: 10000;
background: #2a2a54 !important;
background: var(--headerBackgroundMaskColor) !important;
}
</style>