public/Boostnote
1
0
Fork 0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-14 02:06:29 +00:00
Code Issues Releases Wiki Activity

Fix layout at note list

Browse Source
This commit is contained in:
Kazu Yokomizo
2017-11-11 20:10:16 +09:00
parent 17aa9ae85f
commit f88ac891ff
6 changed files with 68 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
browser/components/NoteItem.styl
View File

@@ -11,9 +11,9 @@ $control-height = 30px
user-select none user-select none
cursor pointer cursor pointer
background-color $ui-noteList-backgroundColor background-color $ui-noteList-backgroundColor
transition background-color 0.2s transition 0.2s
&:hover &:hover
background-color alpha($ui-button--active-backgroundColor, 40%) background-color alpha($ui-button--active-backgroundColor, 20%)
.item-title .item-title
.item-title-icon .item-title-icon
.item-bottom-time .item-bottom-time
@@ -25,7 +25,7 @@ $control-height = 30px
.item-star .item-star
color $ui-favorite-star-button-color color $ui-favorite-star-button-color
&:active &:active
background-color $ui-button--active-backgroundColor background-color alpha($ui-button--active-backgroundColor, 40%)
color $ui-text-color color $ui-text-color
.item-title .item-title
.item-title-icon .item-title-icon
@@ -43,7 +43,7 @@ $control-height = 30px
.item--active .item--active
@extend .item @extend .item
background-color $ui-button--active-backgroundColor background-color alpha($ui-button--active-backgroundColor, 60%)
color $ui-text-color color $ui-text-color
.item-title .item-title
.item-title-empty .item-title-empty
@@ -59,12 +59,12 @@ $control-height = 30px
.item-star .item-star
color $ui-favorite-star-button-color color $ui-favorite-star-button-color
&:hover &:hover
background-color alpha($ui-button--active-backgroundColor, 50%) background-color alpha($ui-button--active-backgroundColor, 40%)
color #e74c3c color #e74c3c
.menu-button-label .menu-button-label
color $ui-text-color color $ui-text-color
&:active, &:active:hover &:active, &:active:hover
background-color alpha($ui-button--active-backgroundColor, 50%) background-color alpha($ui-button--active-backgroundColor, 40%)
color #e74c3c color #e74c3c
.menu-button-label .menu-button-label
color $ui-text-color color $ui-text-color
@@ -145,6 +145,18 @@ $control-height = 30px
padding 0 padding 0
border-radius 17px border-radius 17px
body[data-theme="white"]
.item
background-color $ui-white-noteList-backgroundColor
&:hover
background-color alpha($ui-button--active-backgroundColor, 40%)
&:active
background-color $ui-button--active-backgroundColor
.item--active
@extend .item
background-color $ui-button--active-backgroundColor
body[data-theme="dark"] body[data-theme="dark"]
.root .root
border-color $ui-dark-borderColor border-color $ui-dark-borderColor

24
browser/components/NoteItemSimple.styl
View File

@@ -11,15 +11,15 @@ $control-height = 30px
user-select none user-select none
cursor pointer cursor pointer
background-color $ui-noteList-backgroundColor background-color $ui-noteList-backgroundColor
transition background-color 0.15s transition 0.2s
&:hover &:hover
background-color alpha($ui-button--active-backgroundColor, 40%) background-color alpha($ui-button--active-backgroundColor, 20%)
.item-simple-title .item-simple-title
.item-simple-title-empty .item-simple-title-empty
.item-simple-title-icon .item-simple-title-icon
color $ui-text-color color $ui-text-color
&:active &:active
background-color $ui-button--active-backgroundColor background-color alpha($ui-button--active-backgroundColor, 40%)
color $ui-text-color color $ui-text-color
.item-simple-title .item-simple-title
.item-simple-title-empty .item-simple-title-empty
@@ -28,7 +28,7 @@ $control-height = 30px
.item-simple--active .item-simple--active
@extend .item-simple @extend .item-simple
background-color $ui-button--active-backgroundColor background-color alpha($ui-button--active-backgroundColor, 60%)
color $ui-text-color color $ui-text-color
.item-simple-title .item-simple-title
.item-simple-title-empty .item-simple-title-empty
@@ -37,12 +37,12 @@ $control-height = 30px
.item-simple-title-icon .item-simple-title-icon
color $ui-text-color color $ui-text-color
&:hover &:hover
background-color alpha($ui-button--active-backgroundColor, 50%) background-color alpha($ui-button--active-backgroundColor, 40%)
color #e74c3c color #e74c3c
.menu-button-label .menu-button-label
color $ui-text-color color $ui-text-color
&:active, &:active:hover &:active, &:active:hover
background-color alpha($ui-button--active-backgroundColor, 50%) background-color alpha($ui-button--active-backgroundColor, 40%)
color #e74c3c color #e74c3c
.menu-button-label .menu-button-label
color $ui-text-color color $ui-text-color
@@ -67,6 +67,18 @@ $control-height = 30px
font-weight normal font-weight normal
color $ui-inactive-text-color color $ui-inactive-text-color
body[data-theme="white"]
.item-simple
background-color $ui-white-noteList-backgroundColor
&:hover
background-color alpha($ui-button--active-backgroundColor, 40%)
&:active
background-color $ui-button--active-backgroundColor
.item-simple--active
@extend .item-simple
background-color $ui-button--active-backgroundColor
body[data-theme="dark"] body[data-theme="dark"]
.root .root
border-color $ui-dark-borderColor border-color $ui-dark-borderColor

7
browser/main/NewNoteButton/NewNoteButton.styl
View File

@@ -44,6 +44,13 @@ $control-height = 34px
opacity 0 opacity 0
transition 0.1s transition 0.1s
body[data-theme="white"]
.root, .root--expanded
background-color $ui-white-noteList-backgroundColor
.control-newNoteButton
background-color $ui-white-noteList-backgroundColor
body[data-theme="dark"] body[data-theme="dark"]
.root, .root--expanded .root, .root--expanded
background-color $ui-dark-noteList-backgroundColor background-color $ui-dark-noteList-backgroundColor

7
browser/main/NoteList/NoteList.styl
View File

@@ -59,6 +59,13 @@ $control-height = 30px
top $control-height top $control-height
overflow auto overflow auto
body[data-theme="white"]
.root
background-color $ui-white-noteList-backgroundColor
.control
background-color $ui-white-noteList-backgroundColor
body[data-theme="dark"] body[data-theme="dark"]
.root .root
border-color $ui-dark-borderColor border-color $ui-dark-borderColor

15
browser/main/TopBar/TopBar.styl
View File

@@ -112,6 +112,21 @@ $control-height = 34px
opacity 0 opacity 0
transition 0.1s transition 0.1s
body[data-theme="white"]
.root, .root--expanded
background-color $ui-white-noteList-backgroundColor
.control
border-color $ui-dark-borderColor
.control-search
background-color $ui-white-noteList-backgroundColor
.control-search-input
background-color $ui-white-noteList-backgroundColor
input
background-color $ui-white-noteList-backgroundColor
body[data-theme="dark"] body[data-theme="dark"]
.root, .root--expanded .root, .root--expanded
background-color $ui-dark-noteList-backgroundColor background-color $ui-dark-noteList-backgroundColor

4
browser/styles/index.styl
View File

@@ -15,7 +15,7 @@ $ui-text-color = #333333
$ui-inactive-text-color = #939395 $ui-inactive-text-color = #939395
$ui-borderColor = #D1D1D1 $ui-borderColor = #D1D1D1
$ui-backgroundColor = #FFFFFF $ui-backgroundColor = #FFFFFF
$ui-noteList-backgroundColor = #F3F3F3 $ui-noteList-backgroundColor = #FBFBFB
$ui-noteDetail-backgroundColor = #F4F4F4 $ui-noteDetail-backgroundColor = #F4F4F4
$ui-border = solid 1px $ui-borderColor $ui-border = solid 1px $ui-borderColor
$ui-active-color = #6AA5E9 $ui-active-color = #6AA5E9
@@ -197,6 +197,8 @@ topBarButtonLight()
opacity 1 opacity 1
// White theme // White theme
$ui-white-noteList-backgroundColor = #F3F3F3
/** /**
* Nav * Nav
*/ */