Mizah/mizzkey
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

[Client] Dark header

Browse source
This commit is contained in:
syuilo 2017-03-22 14:13:03 +09:00
parent 57dc370a19
commit b1465e346a
7 changed files with 20 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/web/app/desktop/resources/header-logo-white.svg Normal file
View 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>
Side by side

After

Width:  |  Height:  |  Size: 643 B

15
src/web/app/desktop/tags/ui-header-account.tag
View file

@ -28,7 +28,7 @@
display block
margin 0
padding 0
color #9eaba8
color #dbe2e0
border none
background transparent
cursor pointer
@ -37,20 +37,11 @@
pointer-events none
&:hover
color darken(#9eaba8, 20%)
&:active
color darken(#9eaba8, 30%)
&[data-active='true']
color darken(#9eaba8, 20%)
color #fff
> .avatar
$saturate = 150%
filter saturate($saturate)
-webkit-filter saturate($saturate)
-moz-filter saturate($saturate)
-ms-filter saturate($saturate)
filter saturate(150%)
> .username
display block

2
src/web/app/desktop/tags/ui-header-clock.tag
View file

@ -43,7 +43,7 @@
display table-cell
vertical-align middle
height 48px
color #9eaba8
color #dbe2e0
> .yyyymmdd
opacity 0.7

6
src/web/app/desktop/tags/ui-header-nav.tag
View file

@ -57,9 +57,9 @@
z-index 1
height 100%
padding 0 24px
font-size 1em
font-size 13px
font-variant small-caps
color #9eaba8
color #dbe2e0
text-decoration none
transition none
cursor pointer
@ -68,7 +68,7 @@
pointer-events none
&:hover
color darken(#9eaba8, 20%)
color #fff
text-decoration none
> i:first-child

9
src/web/app/desktop/tags/ui-header-notifications.tag
View file

@ -13,7 +13,7 @@
margin 0
padding 0
width 32px
color #9eaba8
color #dbe2e0
border none
background transparent
cursor pointer
@ -22,13 +22,8 @@
pointer-events none
&:hover
color darken(#9eaba8, 20%)
&:active
color darken(#9eaba8, 30%)
&[data-active='true']
color darken(#9eaba8, 20%)
color #fff
> i
font-size 1.2em

4
src/web/app/desktop/tags/ui-header.tag
View file

@ -38,14 +38,14 @@
height 48px
backdrop-filter blur(12px)
//background-color rgba(255, 255, 255, 0.75)
background #fff
background #313a40
&:after
content ""
display block
width 100%
height 48px
background-image url(/resources/desktop/header-logo.svg)
background-image url(/resources/desktop/header-logo-white.svg)
background-size 64px
background-position center
background-repeat no-repeat

4
src/web/app/mobile/tags/ui-header.tag
View file

@ -20,7 +20,7 @@
box-shadow 0 1px 0 rgba(#000, 0.075)
> .main
color rgba(#000, 0.6)
color rgba(#fff, 0.9)
> .backdrop
position absolute
@ -30,7 +30,7 @@
height $height
-webkit-backdrop-filter blur(12px)
backdrop-filter blur(12px)
background-color rgba(#fff, 0.75)
background-color rgba(#313a40, 0.75)
> .content
z-index 1024