1
0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-13 17:56:25 +00:00

Fix the layout and UX of StorageItem at SIdebra

This commit is contained in:
Kazu Yokomizo
2017-04-28 16:07:55 +09:00
parent 7aa982849f
commit 60e5665133

View File

@@ -4,12 +4,13 @@
.header
position relative
height 26px
height 25px
width 100%
margin-bottom 5px
transition 0.15s
.header--active
margin-bottom 5px
background-color $ui-button--active-backgroundColor
transition color background-color 0.15s
@@ -30,26 +31,29 @@
position absolute
left 0
width 25px
height 26px
height 25px
padding 0
border none
border-radius 50%
&:hover
background-color transparent
transition 0.2s
background-color alpha($ui-button--active-backgroundColor, 40%)
color $ui-text-color
.header-info
navButtonColor()
display block
width 100%
height 30px
padding-left 25px
height 25px
padding-left 23px
padding-right 10px
line-height 26px
line-height 22px
cursor pointer
font-size 13px
border none
overflow ellipsis
text-align left
background-color alpha($ui-button--active-backgroundColor, 20%)
.header-info-path
font-size 10px
@@ -66,6 +70,7 @@
margin-right 5px
border-radius 50%
&:hover
transition 0.2s
background-color alpha($ui-button--active-backgroundColor, 40%)
color $ui-text-color
@@ -119,10 +124,17 @@ body[data-theme="dark"]
.header-toggleButton
&:hover
transition 0.2s
color $ui-dark-text-color
background-color alpha($ui-dark-button--active-backgroundColor, 60%)
&:active, &:active:hover
color $ui-dark-text-color
background-color $ui-dark-button--active-backgroundColor
.header-info
background-color alpha($ui-dark-button--active-backgroundColor, 20%)
&:hover
transition 0.2s
color $ui-dark-text-color
background-color alpha($ui-dark-button--active-backgroundColor, 20%)
&:active, &:active:hover
@@ -131,6 +143,7 @@ body[data-theme="dark"]
.header-addFolderButton
&:hover
transition 0.2s
color $ui-dark-text-color
background-color alpha($ui-dark-button--active-backgroundColor, 60%)
&:active, &:active:hover