[Client] Dark header
This commit is contained in:
parent
57dc370a19
commit
b1465e346a
7 changed files with 20 additions and 27 deletions
7
src/web/app/desktop/resources/header-logo-white.svg
Normal file
7
src/web/app/desktop/resources/header-logo-white.svg
Normal file
|
@ -0,0 +1,7 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||||
|
y="0px" width="1024px" height="512px" viewBox="0 256 1024 512" enable-background="new 0 256 1024 512" xml:space="preserve">
|
||||||
|
<polyline opacity="0.5" fill="none" stroke="#fff" stroke-width="34" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" points="
|
||||||
|
896.5,608.5 800.5,416.5 704.5,608.5 608.5,416.5 512.5,608.5 416.5,416.5 320.5,608.5 224.5,416.5 128.5,608.5 "/>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 643 B |
|
@ -28,7 +28,7 @@
|
||||||
display block
|
display block
|
||||||
margin 0
|
margin 0
|
||||||
padding 0
|
padding 0
|
||||||
color #9eaba8
|
color #dbe2e0
|
||||||
border none
|
border none
|
||||||
background transparent
|
background transparent
|
||||||
cursor pointer
|
cursor pointer
|
||||||
|
@ -37,20 +37,11 @@
|
||||||
pointer-events none
|
pointer-events none
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
color darken(#9eaba8, 20%)
|
|
||||||
|
|
||||||
&:active
|
|
||||||
color darken(#9eaba8, 30%)
|
|
||||||
|
|
||||||
&[data-active='true']
|
&[data-active='true']
|
||||||
color darken(#9eaba8, 20%)
|
color #fff
|
||||||
|
|
||||||
> .avatar
|
> .avatar
|
||||||
$saturate = 150%
|
filter saturate(150%)
|
||||||
filter saturate($saturate)
|
|
||||||
-webkit-filter saturate($saturate)
|
|
||||||
-moz-filter saturate($saturate)
|
|
||||||
-ms-filter saturate($saturate)
|
|
||||||
|
|
||||||
> .username
|
> .username
|
||||||
display block
|
display block
|
||||||
|
|
|
@ -43,7 +43,7 @@
|
||||||
display table-cell
|
display table-cell
|
||||||
vertical-align middle
|
vertical-align middle
|
||||||
height 48px
|
height 48px
|
||||||
color #9eaba8
|
color #dbe2e0
|
||||||
|
|
||||||
> .yyyymmdd
|
> .yyyymmdd
|
||||||
opacity 0.7
|
opacity 0.7
|
||||||
|
|
|
@ -57,9 +57,9 @@
|
||||||
z-index 1
|
z-index 1
|
||||||
height 100%
|
height 100%
|
||||||
padding 0 24px
|
padding 0 24px
|
||||||
font-size 1em
|
font-size 13px
|
||||||
font-variant small-caps
|
font-variant small-caps
|
||||||
color #9eaba8
|
color #dbe2e0
|
||||||
text-decoration none
|
text-decoration none
|
||||||
transition none
|
transition none
|
||||||
cursor pointer
|
cursor pointer
|
||||||
|
@ -68,7 +68,7 @@
|
||||||
pointer-events none
|
pointer-events none
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
color darken(#9eaba8, 20%)
|
color #fff
|
||||||
text-decoration none
|
text-decoration none
|
||||||
|
|
||||||
> i:first-child
|
> i:first-child
|
||||||
|
|
|
@ -13,7 +13,7 @@
|
||||||
margin 0
|
margin 0
|
||||||
padding 0
|
padding 0
|
||||||
width 32px
|
width 32px
|
||||||
color #9eaba8
|
color #dbe2e0
|
||||||
border none
|
border none
|
||||||
background transparent
|
background transparent
|
||||||
cursor pointer
|
cursor pointer
|
||||||
|
@ -22,13 +22,8 @@
|
||||||
pointer-events none
|
pointer-events none
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
color darken(#9eaba8, 20%)
|
|
||||||
|
|
||||||
&:active
|
|
||||||
color darken(#9eaba8, 30%)
|
|
||||||
|
|
||||||
&[data-active='true']
|
&[data-active='true']
|
||||||
color darken(#9eaba8, 20%)
|
color #fff
|
||||||
|
|
||||||
> i
|
> i
|
||||||
font-size 1.2em
|
font-size 1.2em
|
||||||
|
|
|
@ -38,14 +38,14 @@
|
||||||
height 48px
|
height 48px
|
||||||
backdrop-filter blur(12px)
|
backdrop-filter blur(12px)
|
||||||
//background-color rgba(255, 255, 255, 0.75)
|
//background-color rgba(255, 255, 255, 0.75)
|
||||||
background #fff
|
background #313a40
|
||||||
|
|
||||||
&:after
|
&:after
|
||||||
content ""
|
content ""
|
||||||
display block
|
display block
|
||||||
width 100%
|
width 100%
|
||||||
height 48px
|
height 48px
|
||||||
background-image url(/resources/desktop/header-logo.svg)
|
background-image url(/resources/desktop/header-logo-white.svg)
|
||||||
background-size 64px
|
background-size 64px
|
||||||
background-position center
|
background-position center
|
||||||
background-repeat no-repeat
|
background-repeat no-repeat
|
||||||
|
|
|
@ -20,7 +20,7 @@
|
||||||
box-shadow 0 1px 0 rgba(#000, 0.075)
|
box-shadow 0 1px 0 rgba(#000, 0.075)
|
||||||
|
|
||||||
> .main
|
> .main
|
||||||
color rgba(#000, 0.6)
|
color rgba(#fff, 0.9)
|
||||||
|
|
||||||
> .backdrop
|
> .backdrop
|
||||||
position absolute
|
position absolute
|
||||||
|
@ -30,7 +30,7 @@
|
||||||
height $height
|
height $height
|
||||||
-webkit-backdrop-filter blur(12px)
|
-webkit-backdrop-filter blur(12px)
|
||||||
backdrop-filter blur(12px)
|
backdrop-filter blur(12px)
|
||||||
background-color rgba(#fff, 0.75)
|
background-color rgba(#313a40, 0.75)
|
||||||
|
|
||||||
> .content
|
> .content
|
||||||
z-index 1024
|
z-index 1024
|
||||||
|
|
Loading…
Reference in a new issue