extern/heynote
1
0
Fork 0
mirror of https://github.com/heyman/heynote.git synced 2024-12-02 04:44:09 +01:00
Code Issues Packages Projects Releases Wiki Activity

Dark mode styling of New Note dialog

Browse Source
This commit is contained in:
Jonatan Heyman 2024-08-04 17:36:47 +02:00
parent ffc4464e78
commit 60b5c910a9
4 changed files with 27 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/NewNote.vue
View File

@ -192,7 +192,7 @@
&:focus
outline: none
+dark-mode
background: #333
background: #151516
box-shadow: 0 0 10px rgba(0,0,0,0.5)
color: rgba(255,255,255, 0.7)
+webapp-mobile
@ -247,8 +247,6 @@
padding-top: 0
display: flex
justify-content: flex-end
+dark-mode
background: #222
button
font-size: 12px
height: 28px
@ -258,5 +256,8 @@
padding-right: 10px
&:focus
outline-color: #48b57e
+dark-mode
background: #444
border: none
</style>

16
src/components/folder-selector/FolderItem.vue
View File

@ -70,10 +70,17 @@
background-repeat: no-repeat
background-position-y: 5px
background-position-x: calc(2px + var(--indent-level) * 16px)
+dark-mode
background-image: url('@/assets/icons/caret-right-white.svg')
color: rgba(255,255,255, 0.87)
&:hover
background-color: #f1f1f1
+dark-mode
background-color: #39393a
&.open
background-image: url('@/assets/icons/caret-down.svg')
+dark-mode
background-image: url('@/assets/icons/caret-down-white.svg')
&.selected
background-color: #48b57e
color: #fff
@ -82,6 +89,11 @@
background-image: url('@/assets/icons/caret-down-white.svg')
&:hover
background-color: #40a773
+dark-mode
background-color: #1b6540
color: rgba(255,255,255, 0.87)
&:hover
background-color: #1f6f47
.new-folder
display: block
color: rgba(255,255,255, 0.9)
@ -90,6 +102,10 @@
color: rgba(0,0,0, 0.5)
&.selected
color: rgba(255,255,255, 0.8)
+dark-mode
color: rgba(255,255,255, 0.5)
&.selected
color: rgba(255,255,255, 0.8)
.name

3
src/components/folder-selector/FolderSelector.vue
View File

@ -245,4 +245,7 @@
outline: none
border: 1px solid #fff
outline: 2px solid #48b57e
+dark-mode
background: #262626
border: 1px solid #363636
</style>

6
src/components/folder-selector/NewFolderItem.vue
View File

@ -86,8 +86,8 @@
padding-left: calc(0px + var(--indent-level) * 16px)
display: flex
background: #f1f1f1
&:hover
background: #f1f1f1
+dark-mode
background-color: #39393a
input
@ -104,5 +104,7 @@
outline: none
&::placeholder
font-size: 12px
+dark-mode
background: #3b3b3b
</style>