Skip to content

Commit

Permalink
enhance(ui): handbook colors for the non-accent colors
Browse files Browse the repository at this point in the history
  • Loading branch information
@xyhp915
xyhp915 committed Jan 26, 2024
1 parent bf54725 commit 36c1b9f
Show file tree
Hide file tree
Showing 2 changed files with 29 additions and 26 deletions.
6 changes: 2 additions & 4 deletions src/main/frontend/common.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -605,10 +605,8 @@ mark {
font-family: MonoLisa, 'Fira Code', Monaco, Menlo, Consolas, 'COURIER NEW',
monospace;
letter-spacing: 0;
background-color: or(--ls-inline-code-background, --lx-gray-06, --ls-page-inline-code-bg-color, #eee);
color: or(--ls-inline-code-text, --lx-gray-11, --ls-page-inline-code-color);
background-color: var(--ls-page-inline-code-bg-color, #eee);
color: var(--ls-page-inline-code-color);
background-color: var(--lx-gray-06, var(--ls-page-inline-code-bg-color, var(--rx-gray-05)));
color: var(--lx-gray-11, var(--ls-page-inline-code-color, var(--rx-gray-11)));
text-rendering: optimizeSpeed;
}

Expand Down
49 changes: 27 additions & 22 deletions src/main/frontend/extensions/handbooks/handbooks.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
@apply dark:text-white px-3 pt-3 pb-2 sticky top-0 left-0 z-[4]
transition-shadow duration-200;

background-color: var(--ls-tertiary-background-color);
background-color: var(--ls-tertiary-background-color1);

.title {
text-align: left;
Expand All @@ -33,11 +33,11 @@
> .input-wrap {
@apply mx-4 mb-2 flex rounded-lg mt-1.5;

border: 3px solid var(--ls-primary-background-color);
background-color: var(--ls-primary-background-color);
border: 3px solid var(--ls-primary-background-color1);
background-color: var(--ls-primary-background-color1);

&:focus-within {
border: 3px solid var(--ls-secondary-border-color);
border: 3px solid var(--ls-secondary-border-color, var(--rx-gray-06));
}

> input {
Expand Down Expand Up @@ -76,7 +76,7 @@
@apply text-sm px-3 py-2.5 rounded-lg cursor-pointer
mb-2 active:opacity-90 select-none items-center;

background-color: var(--ls-secondary-background-color);
background-color: var(--ls-secondary-background-color1);
border: 1px solid var(--ls-border-color);
transition: background-color .3s;

Expand Down Expand Up @@ -104,7 +104,7 @@
}

&:hover, &.active {
background-color: var(--ls-primary-background-color);
background-color: var(--ls-primary-background-color1);
border-color: var(--ls-secondary-border-color);

> .l {
Expand Down Expand Up @@ -133,15 +133,15 @@
.category-card {
@apply flex rounded px-2 py-3 active:opacity-90 cursor-pointer transition-colors items-end;

border-left: 4px solid var(--ls-secondary-background-color);
background-color: var(--ls-secondary-background-color);
border-left: 4px solid var(--ls-secondary-background-color1);
background-color: var(--ls-secondary-background-color1);

&[data-total="0"] {
@apply hidden;
}

&:hover, &:active {
background-color: var(--ls-primary-background-color);
background-color: var(--ls-primary-background-color1);
}

> .icon-wrap {
Expand Down Expand Up @@ -282,7 +282,7 @@
@apply relative flex flex-col rounded py-2 px-3 leading-5 select-none z-[1];

color: var(--ls-primary-text-color);
background-color: var(--ls-secondary-background-color);
background-color: var(--ls-secondary-background-color1);

small {
@apply text-[11px] opacity-50 pl-0.5;
Expand All @@ -305,7 +305,7 @@
ul {
@apply absolute top-[58px] left-0 w-full list-none m-0 rounded-b py-2;

background-color: var(--ls-secondary-background-color);
background-color: var(--ls-secondary-background-color1);
transform: translateY(-5px);
max-height: 300px;
overflow: auto;
Expand All @@ -314,7 +314,7 @@
@apply list-none px-3 py-1 transition-colors text-sm;

&:hover {
background-color: var(--ls-tertiary-background-color);
background-color: var(--ls-tertiary-background-color1);
}
}
}
Expand All @@ -336,11 +336,16 @@
}

&-popup {
@apply fixed rounded-lg overflow-hidden
--ls-primary-background-color1: var(--ls-primary-background-color, var(--lx-gray-01, var(--rx-gray-02)));
--ls-secondary-background-color1: var(--ls-secondary-background-color, var(--lx-gray-03, var(--rx-gray-03)));
--ls-tertiary-background-color1: var(--ls-tertiary-background-color, var(--lx-gray-05, var(--rx-gray-05)));
--ls-quaternary-background-color1: var(--ls-quaternary-background-color, var(--lx-gray-08, var(--rx-gray-08)));

@apply fixed rounded-lg overflow-hidden border
z-[19] shadow-lg flex justify-center flex-col;

background-color: var(--ls-tertiary-background-color);
border: 1px solid var(--ls-tertiary-background-color);
background-color: var(--ls-tertiary-background-color1);
border: 1px solid var(--ls-tertiary-background-color1);
touch-action: none;
height: 686px;
max-height: 86vh;
Expand All @@ -352,7 +357,7 @@

html[data-theme="light"] {
.cp__handbooks-popup {
background-color: var(--ls-primary-background-color);
background-color: var(--ls-primary-background-color1);

.input-wrap {
background-color: #f1f1f1;
Expand All @@ -364,35 +369,35 @@ html[data-theme="light"] {

.topic-card, :not(.as-primary).link-card {
&:hover, &.active {
background-color: var(--ls-tertiary-background-color);
background-color: var(--ls-tertiary-background-color1);
border-color: var(--ls-secondary-border-color);
}
}
}

.cp__handbooks-content {
.hd {
background-color: var(--ls-primary-background-color);
background-color: var(--ls-primary-background-color1);
}

.ft {
background-color: var(--ls-primary-background-color);
background-color: var(--ls-primary-background-color1);
}

.search {
background-color: var(--ls-primary-background-color);
background-color: var(--ls-primary-background-color1);
}

.chapters-select {
.select-trigger {
background-color: var(--ls-tertiary-background-color);
background-color: var(--ls-tertiary-background-color1);
}
}

.categories-list {
.category-card {
&:hover, &:active {
background-color: var(--ls-tertiary-background-color);
background-color: var(--ls-tertiary-background-color1);
}
}
}
Expand Down

0 comments on commit 36c1b9f

Please sign in to comment.