Fix dark mode

This commit is contained in:
Baize 2023-04-06 14:55:39 +00:00 committed by huggingface-web
parent b56a2099bd
commit d4541deb3e
1 changed files with 14 additions and 14 deletions

View File

@ -33,7 +33,7 @@ ol:not(.options), ul:not(.options) {
padding-inline-start: 2em !important; padding-inline-start: 2em !important;
} }
/* 亮色 */ /* Light Mode */
@media (prefers-color-scheme: light) { @media (prefers-color-scheme: light) {
#chuanhu_chatbot { #chuanhu_chatbot {
background-color: var(--chatbot-color-light) !important; background-color: var(--chatbot-color-light) !important;
@ -45,27 +45,27 @@ ol:not(.options), ul:not(.options) {
background-color: #95EC69 !important; background-color: #95EC69 !important;
} }
} }
/* 暗色 */ /* Dark Mode */
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
#chuanhu_chatbot { .dark #chuanhu_chatbot {
background-color: var(--chatbot-color-dark) !important; background-color: var(--chatbot-color-dark) !important;
} }
[data-testid = "bot"] { .dark [data-testid = "bot"] {
background-color: #2C2C2C !important; background-color: #2C2C2C !important;
} }
[data-testid = "user"] { .dark [data-testid = "user"] {
background-color: #26B561 !important; background-color: #26B561 !important;
} }
body { body {
background-color: var(--neutral-950) !important; background-color: var(--neutral-950) !important;
} }
} }
/* 屏幕宽度大于等于500px的设备 */
#chuanhu_chatbot { #chuanhu_chatbot {
height: 100%; height: 100%;
min-height: 400px; min-height: 400px;
} }
/* 对话气泡 */
[class *= "message"] { [class *= "message"] {
border-radius: var(--radius-xl) !important; border-radius: var(--radius-xl) !important;
border: none; border: none;
@ -84,7 +84,7 @@ ol:not(.options), ul:not(.options) {
width: auto !important; width: auto !important;
border-bottom-right-radius: 0 !important; border-bottom-right-radius: 0 !important;
} }
/* 表格 */ /* Table */
table { table {
margin: 1em 0; margin: 1em 0;
border-collapse: collapse; border-collapse: collapse;
@ -100,7 +100,7 @@ thead {
thead th { thead th {
padding: .5em .2em; padding: .5em .2em;
} }
/* 行内代码 */ /* Inline code */
code { code {
display: inline; display: inline;
white-space: break-spaces; white-space: break-spaces;
@ -109,7 +109,7 @@ code {
padding: .2em .4em .1em .4em; padding: .2em .4em .1em .4em;
background-color: rgba(175,184,193,0.2); background-color: rgba(175,184,193,0.2);
} }
/* 代码块 */ /* Code block */
pre code { pre code {
display: block; display: block;
overflow: auto; overflow: auto;
@ -121,7 +121,7 @@ pre code {
color: #FFF; color: #FFF;
box-shadow: 6px 6px 16px hsla(0, 0%, 0%, 0.2); box-shadow: 6px 6px 16px hsla(0, 0%, 0%, 0.2);
} }
/* 代码高亮样式 */ /* Hightlight */
.highlight .hll { background-color: #49483e } .highlight .hll { background-color: #49483e }
.highlight .c { color: #75715e } /* Comment */ .highlight .c { color: #75715e } /* Comment */
.highlight .err { color: #960050; background-color: #1e0010 } /* Error */ .highlight .err { color: #960050; background-color: #1e0010 } /* Error */