consolidate theme colors

This commit is contained in:
sawka 2024-07-17 16:01:11 -07:00
parent 01b5d71709
commit dfa0245606
6 changed files with 11 additions and 33 deletions

View File

@ -5,6 +5,6 @@
padding: 5px 5px;
.fa-check {
color: var(--app-success-color);
color: var(--success-color);
}
}

View File

@ -45,12 +45,12 @@
blockquote {
margin: 4px 10px 4px 10px;
border-radius: 3px;
background-color: var(--markdown-bg-color);
background-color: var(--panel-bg-color);
padding: 2px 4px 2px 6px;
}
pre.codeblock {
background-color: var(--markdown-bg-color);
background-color: var(--panel-bg-color);
margin: 4px 10px;
padding: 0.4em 0.7em;
border-radius: 4px;
@ -90,7 +90,7 @@
}
&.fa-check {
color: var(--app-success-color);
color: var(--success-color);
}
&.fa-square-terminal {
@ -106,13 +106,13 @@
code {
color: var(--app-text-color);
background-color: var(--markdown-bg-color);
background-color: var(--panel-bg-color);
font-family: var(--termfontfamily);
border-radius: 4px;
}
pre.selected {
outline: 2px solid var(--markdown-outline-color);
outline: 2px solid var(--accent-color);
}
.title {

View File

@ -1,5 +1,5 @@
@dot-width: 11px;
@dot-color: var(--app-success-color);
@dot-color: var(--success-color);
@speed: 1.5s;
.typing {

View File

@ -36,25 +36,4 @@
/* z-index values */
--zindex-header-hover: 100;
--zindex-termstickers: 20;
/* global colors */
--app-text-primary-color: rgb(255, 255, 255);
--app-text-color: rgb(211, 215, 207);
--app-border-color: rgb(51, 51, 51);
--app-panel-bg-color-dev: rgb(21, 23, 48);
--app-panel-bg-color: rgba(21, 23, 21, 1);
--app-accent-color: rgb(88, 193, 66);
/* global status colors */
--app-success-color: rgb(78, 154, 6);
/* form element colors */
--form-element-primary-color: var(--app-accent-color);
/* markdown colors */
--markdown-bg-color: rgb(35, 35, 35);
--markdown-outline-color: var(--form-element-primary-color);
/* cmdinput colors */
--cmdinput-text-error-color: var(--term-red);
}

View File

@ -78,10 +78,10 @@
padding: 16px 15px 7px;
flex: 0 0 auto;
flex-shrink: 0;
border-top: 1px solid var(--app-border-color);
border-top: 1px solid var(--border-color);
.waveai-input {
color: var(--app-text-primary-color);
color: var(--main-text-color);
background-color: var(--cmdinput-textarea-bg);
resize: none;
width: 100%;

View File

@ -3,7 +3,6 @@
import { Markdown } from "@/app/element/markdown";
import { TypingIndicator } from "@/app/element/typingindicator";
import { getApi } from "@/app/store/global";
import { ChatMessageType, useWaveAi } from "@/app/store/waveai";
import type { OverlayScrollbars } from "overlayscrollbars";
import { OverlayScrollbarsComponent, OverlayScrollbarsComponentRef } from "overlayscrollbars-react";
@ -12,7 +11,7 @@ import tinycolor from "tinycolor2";
import "./waveai.less";
const outline = "2px solid var(--markdown-outline-color)";
const outline = "2px solid var(--accent-color)";
interface ChatItemProps {
chatItem: ChatMessageType;
@ -23,7 +22,7 @@ const ChatItem = ({ chatItem, itemCount }: ChatItemProps) => {
const { isAssistant, text, isError } = chatItem;
const senderClassName = isAssistant ? "chat-msg-assistant" : "chat-msg-user";
const msgClassName = `chat-msg ${senderClassName}`;
const cssVar = getApi().isDev ? "--app-panel-bg-color-dev" : "--app-panel-bg-color";
const cssVar = "--panel-bg-color";
const panelBgColor = getComputedStyle(document.documentElement).getPropertyValue(cssVar).trim();
const color = tinycolor(panelBgColor);
const newColor = color.isValid() ? tinycolor(panelBgColor).darken(6).toString() : "none";