You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
tailchat/client/web/src/styles/global.less

78 lines
1.8 KiB
Plaintext

#tailchat-app {
@apply text-typography-light bg-content-light;
--tc-background-image: url(../../assets/images/bg.webp);
--tc-content-background-image: '';
--tc-content-background-image-opacity: 0.2;
--tc-content-background-color: rgba(243, 244, 246, 1); // copy from bg-content-light
.tc-background {
@apply bg-center bg-cover bg-no-repeat;
background-image: var(--tc-background-image);
}
.tc-content-background {
@apply absolute block inset-0 bg-contain bg-no-repeat bg-right-bottom pointer-events-none;
background-image: var(--tc-content-background-image);
opacity: var(--tc-content-background-image-opacity);
}
/* 滚动条 */
::-webkit-scrollbar {
width: 16px;
height: 16px;
}
::-webkit-scrollbar-corner {
background-color: transparent;
}
::-webkit-scrollbar-thumb {
@apply bg-black bg-opacity-10;
border-color: transparent;
background-clip: padding-box;
border-width: 4px;
border-style: solid;
border-radius: 8px;
&:hover {
@apply bg-black bg-opacity-20;
}
}
::-webkit-scrollbar-track {
@apply bg-black bg-opacity-5;
border-color: transparent;
background-clip: padding-box;
border-width: 4px;
border-style: solid;
border-radius: 8px;
}
// 深色模式覆盖
&.dark {
@apply text-typography-dark bg-content-dark;
--tc-content-background-color: rgba(55, 65, 81, 1);; // copy from bg-content-light
h1,h2,h3,h4,h5,h6 {
@apply text-typography-dark;
}
::-webkit-scrollbar-corner {
background-color: transparent;
}
::-webkit-scrollbar-thumb {
background-color: #202225;
&:hover {
background-color: #202225;
}
}
::-webkit-scrollbar-track {
background-color: #2f3136;
}
}
}