Use CSS class for coloring

This commit is contained in:
Cohee 2023-08-20 19:09:19 +03:00
parent a27bef8b12
commit 6e6eb8f61e
3 changed files with 26 additions and 19 deletions

View File

@ -1004,7 +1004,7 @@ function getCharacterBlock(item, id) {
template.attr({ 'chid': id, 'id': `CharID${id}` }); template.attr({ 'chid': id, 'id': `CharID${id}` });
template.find('img').attr('src', this_avatar); template.find('img').attr('src', this_avatar);
template.find('.avatar').attr('title', item.avatar); template.find('.avatar').attr('title', item.avatar);
template.find('.ch_name').text(item.name).css('color', item.fav ? 'gold' : 'white'); template.find('.ch_name').text(item.name);
if (power_user.show_card_avatar_urls) { if (power_user.show_card_avatar_urls) {
template.find('.ch_avatar_url').text(item.avatar); template.find('.ch_avatar_url').text(item.avatar);
} }

View File

@ -371,7 +371,6 @@ function updateGroupAvatar(group) {
// check if isDataURLor if it's a valid local file url // check if isDataURLor if it's a valid local file url
function isValidImageUrl(url) { function isValidImageUrl(url) {
console.trace(url);
// check if empty dict // check if empty dict
if (Object.keys(url).length === 0) { if (Object.keys(url).length === 0) {
return false; return false;

View File

@ -35,7 +35,10 @@
--cobalt30a: rgba(100, 100, 255, 0.3); --cobalt30a: rgba(100, 100, 255, 0.3);
--greyCAIbg: rgb(36, 36, 37); --greyCAIbg: rgb(36, 36, 37);
--ivory: rgb(220, 220, 210); --ivory: rgb(220, 220, 210);
--golden: rgba(212, 175, 55, 1); --golden: rgb(248, 211, 0);
--warning: rgba(255, 0, 0, 0.9);
--active: rgb(75, 156, 0);
--preferred: rgb(244, 67, 54);
/*Default Theme, will be changed by ToolCool Color Picker*/ /*Default Theme, will be changed by ToolCool Color Picker*/
@ -228,7 +231,7 @@ table.responsiveTable {
display: block; display: block;
font-size: calc(var(--mainFontSize) - 0.1rem); font-size: calc(var(--mainFontSize) - 0.1rem);
font-weight: 500; font-weight: 500;
color: darkgoldenrod; color: var(--SmartThemeQuoteColor);
} }
.mes_text i, .mes_text i,
@ -1168,7 +1171,7 @@ input[type="file"] {
#extension_floating_counter { #extension_floating_counter {
font-weight: 600; font-weight: 600;
color: orange; color: var(--SmartThemeQuoteColor);
} }
.extension_token_counter { .extension_token_counter {
@ -1250,11 +1253,11 @@ select option:not(:checked) {
} }
.fav_on { .fav_on {
color: #c5b457 !important; color: var(--golden) !important;
} }
.world_set { .world_set {
color: #4b9c00 !important; color: var(--active) !important;
} }
#instruct_set_default { #instruct_set_default {
@ -1262,7 +1265,7 @@ select option:not(:checked) {
} }
#instruct_set_default.default { #instruct_set_default.default {
color: #f44336 !important; color: var(--preferred) !important;
} }
.displayBlock { .displayBlock {
@ -1280,7 +1283,7 @@ select option:not(:checked) {
#api_button:hover, #api_button:hover,
#api_button_novel:hover, #api_button_novel:hover,
#api_button_textgenerationwebui:hover { #api_button_textgenerationwebui:hover {
background-color: green; background-color: var(--active);
} }
.api-load-icon { .api-load-icon {
@ -1554,7 +1557,7 @@ input[type=search]:focus::-webkit-search-cancel-button {
.ch_fav_icon { .ch_fav_icon {
filter: drop-shadow(1px 1px 2px black); filter: drop-shadow(1px 1px 2px black);
color: #c5b457; color: var(--golden);
font-size: 14px; font-size: 14px;
order: -1; order: -1;
margin-left: -75px; margin-left: -75px;
@ -1566,7 +1569,12 @@ input[type=search]:focus::-webkit-search-cancel-button {
.character_select.is_fav .avatar, .character_select.is_fav .avatar,
.group_select.is_fav .avatar, .group_select.is_fav .avatar,
.group_member.is_fav .avatar { .group_member.is_fav .avatar {
outline: 2px solid #c5b457; outline: 2px solid var(--golden);
}
.character_select.is_fav .ch_name,
.group_select.is_fav .ch_name {
color: var(--golden);
} }
#fav_chara_wrap { #fav_chara_wrap {
@ -2754,7 +2762,7 @@ body .ui-widget-content li:hover {
} }
span.warning { span.warning {
color: rgba(255, 0, 0, 0.5); color: var(--warning);
font-weight: bolder; font-weight: bolder;
} }
@ -3315,8 +3323,8 @@ a {
} }
.reverse_proxy_warning { .reverse_proxy_warning {
color: red; color: var(--warning);
background-color: black; background-color: var(--black70a);
text-shadow: none !important; text-shadow: none !important;
margin-top: 12px !important; margin-top: 12px !important;
border-radius: 5px; border-radius: 5px;
@ -3325,7 +3333,7 @@ a {
} }
.neutral_warning { .neutral_warning {
color: rgba(225, 0, 0, 0.9); color: var(--warning);
font-weight: 800; font-weight: 800;
} }
@ -3359,7 +3367,7 @@ a {
width: calc((100vw - var(--sheldWidth)) /2); width: calc((100vw - var(--sheldWidth)) /2);
position: absolute; position: absolute;
padding: 0; padding: 0;
filter: drop-shadow(2px 2px 2px #51515199); filter: drop-shadow(2px 2px 2px var(--grey7070a));
z-index: 29; z-index: 29;
overflow: hidden; overflow: hidden;
display: none; display: none;
@ -3485,7 +3493,7 @@ a {
background-color: transparent; background-color: transparent;
border: none; border: none;
outline: none; outline: none;
color: white; color: var(--SmartThemeBodyColor);
display: inline-block; display: inline-block;
/* Change display to inline-block */ /* Change display to inline-block */
vertical-align: middle; vertical-align: middle;