theme_nin/sass/layout/_menu.sass

119 lines
2.3 KiB
Sass
Raw Normal View History

2015-07-27 12:15:24 +02:00
// vars for the menu
2015-08-01 22:52:31 +02:00
$menu-height : 52px
2015-07-27 14:53:52 +02:00
$menu-font-color: white
2015-08-01 22:52:31 +02:00
$menuBgColor : $dark-grey
.userMenu
2015-07-27 12:15:24 +02:00
width: 100%
position: fixed
height: $menu-height
left: 0
margin: 0
2015-07-31 10:58:25 +02:00
//background-color: #FFAF1C
//+background-image(linear-gradient(to right , $color-green, #5E80A2) )
background-color: $menuBgColor
2015-08-03 19:36:37 +02:00
z-index: 20
2015-07-28 13:14:22 +02:00
> ul
2015-07-27 12:15:24 +02:00
@extend .clear-fix
+box-sizing(border-box)
2015-07-31 10:58:25 +02:00
max-width: 100%
width: $site-width
margin: auto
background: image-url("logo.png") no-repeat 50% 50%
2015-07-27 12:15:24 +02:00
background-size: 20px
li
position: relative
2015-10-24 09:07:42 +02:00
display: block
float: left
2015-08-03 16:20:22 +02:00
margin: 0 10px
2015-07-27 12:15:24 +02:00
> a
2015-08-01 22:52:31 +02:00
line-height: $menu-height
2015-07-27 12:15:24 +02:00
display: inline-block
2015-08-01 22:52:31 +02:00
color: rgba($menu-font-color, 0.5)!important
font-size: 1rem
2015-07-27 12:15:24 +02:00
position: relative
2015-08-01 22:52:31 +02:00
font-size: 1rem
2015-07-27 12:15:24 +02:00
&:hover
color: $menu-font-color!important
2015-07-31 10:58:25 +02:00
text-decoration: none
2015-08-01 22:52:31 +02:00
&:before
padding-right: 5px
span
display: inline-block
2015-07-31 10:58:25 +02:00
&.current a
2015-07-27 12:15:24 +02:00
color: $menu-font-color!important
/* Menu specific entries */
.userMenu li
2015-07-27 12:15:24 +02:00
&.userMenu-home
2015-08-01 22:52:31 +02:00
a
.label
display: inline-block!important
2015-07-27 12:15:24 +02:00
.menu-news
position: absolute
text-align: center
display: none
2015-08-01 22:52:31 +02:00
top: 5px
right: -12px
2015-07-27 12:15:24 +02:00
background: $main-color-color
width: 15px
height: 15px
line-height: 15px
font-size: 10px
2015-07-31 10:58:25 +02:00
padding: 1px
2015-08-01 22:52:31 +02:00
margin: 0
2015-07-27 12:15:24 +02:00
font-weight: 900
+border-radius(50%)
+box-sizing(content-box)
2015-07-31 10:58:25 +02:00
color: white
2015-07-27 12:15:24 +02:00
&.show
display: block
2015-08-01 22:52:31 +02:00
2015-09-12 16:20:09 +02:00
&.userMenu-dhtindicator, &.userMenu-connections, &.userMenu-messages, &.userMenu-groupmessages
2015-07-27 12:15:24 +02:00
display: none!important
2015-07-27 12:15:24 +02:00
&.userMenu-config, &.userMenu-search
float: right
color: $menu-font-color
+ a
color: $main-color-dark
&.userMenu-search
> input
2015-08-01 22:52:31 +02:00
border: 1px solid rgba(white,.3)
2015-07-31 10:58:25 +02:00
line-height: $menu-height/2
2015-08-03 16:20:22 +02:00
margin-top: $menu-height/4
2015-07-27 12:15:24 +02:00
font-size: 12px
2015-07-31 10:58:25 +02:00
padding: 0 7px
2015-08-01 22:52:31 +02:00
background: rgba(white,.1)
color: white
+border-radius(7px)
2015-07-27 12:15:24 +02:00
&:focus
2015-08-01 22:52:31 +02:00
border-color: rgba(white,.7)
2015-07-27 12:15:24 +02:00
&.userMenu-config > a
2015-08-03 16:20:22 +02:00
@extend .ion
2015-08-01 22:52:31 +02:00
@extend .ion-gear
2015-07-27 12:15:24 +02:00
font-size: 1.5rem
2015-08-14 23:42:07 +02:00
.config-menu.dialog-modal
a
background: $bloc-light-color
border-top: 1px solid $main-background-color
&:hover
background: white
text-decoration: none
display: block
width: 100%
font-weight: 400
line-height: $mini-usr-img / 1.5
display: block
margin: 0
padding: 5px
color: $defaut-font-color!important