clone/logseq
1
0
Fork 0
mirror of https://github.com/logseq/logseq.git synced 2026-05-03 18:36:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

Initial radix color styling

Browse Source
This commit is contained in:
Ben Yorke
2023-05-24 14:46:33 +02:00
parent 641a38afa6
commit 3e86da1b7b
9 changed files with 137 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/main/frontend/components/container.css
View File

@@ -6,7 +6,7 @@
}
#app-container {
background-color: var(--ls-primary-background-color, #fff);
background-color: or(--lx-gray-02, --ls-primary-background-color, #fff);
position: relative;
}
@@ -82,7 +82,7 @@
width: var(--ls-left-sidebar-sm-width);
overflow-y: auto;
overflow-x: hidden;
background-color: var(--ls-primary-background-color);
background-color: or(--lx-gray-01, --ls-primary-background-color);
transition: transform .3s;
transform: translate3d(-100%, 0, 0);
z-index: 3;
@@ -143,11 +143,11 @@
}
&:hover {
background-color: var(--ls-tertiary-background-color);
background-color: or(--lx-gray-04, --ls-tertiary-background-color);
}
&.active, &:active {
background-color: var(--ls-quaternary-background-color);
background-color: or(--lx-gray-05, --ls-quaternary-background-color);
}
}
@@ -298,21 +298,21 @@
#create-button {
@apply flex items-center justify-center p-2 text-sm font-medium rounded-md w-full border;
background-color: var(--ls-secondary-background-color) !important;
background-color: or(--lx-gray-03, --ls-secondary-background-color) !important;
border-color: transparent;
&:hover,
&:focus {
border-color: var(--ls-border-color);
background-color: var(--ls-primary-background-color) !important;
background-color: or(--lx-gray-03, --ls-primary-background-color) !important;
}
@screen sm {
background-color: var(--ls-primary-background-color) !important;
background-color: or(--lx-gray-03, --ls-primary-background-color) !important;
&:hover,
&:focus {
background-color: var(--ls-secondary-background-color) !important;
background-color: or(--lx-gray-04, --ls-secondary-background-color) !important;
}
}
}
@@ -321,7 +321,7 @@
@screen sm {
padding-top: 0;
width: var(--ls-left-sidebar-width);
background-color: var(--ls-secondary-background-color);
background-color: or(--lx-gray-01, --ls-secondary-background-color);
> .wrap {
margin-top: 52px;
@@ -423,7 +423,7 @@
transition: width .3s;
&:before {
background-color: var(--ls-secondary-background-color);
background-color: or(--lx-gray-01, --ls-secondary-background-color);
width: 0;
overflow: hidden;
}
@@ -493,7 +493,7 @@ html[data-theme='dark'] {
}
.cp__sidebar-main-layout {
background-color: var(--ls-primary-background-color);
background-color: or(--lx-gray-02, --ls-primary-background-color);
}
.cp__sidebar-main-content {
@@ -523,7 +523,7 @@ html[data-theme='dark'] {
rounded-full h-8 w-8 flex items-center justify-center font-bold
select-none cursor-help;
background-color: var(--ls-secondary-background-color);
background-color: or(--lx-gray-01, --ls-secondary-background-color);
}
}
}
@@ -531,7 +531,7 @@ html[data-theme='dark'] {
.cp__right-sidebar {
z-index: var(--ls-z-index-level-1);
transition: width 0.3s;
background-color: var(--ls-secondary-background-color, #d8e1e8);
background-color: or(--lx-gray-01, --ls-secondary-background-color, #d8e1e8);
position: relative;
user-select: none;
@@ -592,7 +592,7 @@ html[data-theme='dark'] {
top: 0;
left: 0;
right: 0;
background-color: var(--ls-secondary-background-color, #d8e1e8);
background-color: or(--lx-gray-01, --ls-secondary-background-color, #d8e1e8);
z-index: 999;
user-select: none;
-webkit-app-region: drag;