Add some top menu logic

This commit is contained in:
2014-04-06 23:04:34 +02:00
parent dd8f0df6d2
commit 7915cc6684
12 changed files with 143 additions and 22 deletions
@@ -0,0 +1,52 @@
@import constants
@import font-awesome
header.top-menu
height: 90px
background-color: transparent
background-repeat: no-repeat, no-repeat
background-position: left bottom, right bottom
background-image: image-url('theme1/button-bar-left.png'), image-url('theme1/button-bar-right.png')
color: $green
padding-left: 49px
padding-right: 52px
.menu-content
background-color: white
background-repeat: repeat-x
background-position: center bottom
background-image: image-url('theme1/button-bar-middle.png')
//min-height: 61px
height: 100%
section
height: 52px
line-height: 48px
.menu-list-item
margin-left: 20px
cursor: pointer
border: 0.08em solid #eee
padding: 5px
border-radius: 0.1em
display: inline-block
line-height: 1em
margin-top: 10px
color: #999
&.active
color: yellow
border-color: yellow
&.callout
color: #f70
border-color: #f70
.toggle-side-menu
position: absolute
width: 28px
height: 28px
color: white
left: 0
cursor: pointer
z-index: 100
&.open
color: white
span
@extend .fa
@extend .fa-bars
@extend .fa-lg
@@ -0,0 +1,13 @@
@import constants
aside.side-menu
background-color: #444
position: fixed
display: none
left: -222px
top: 0
width: 222px
height: 100%
> ul
list-style: none
a
color: white
@@ -1,19 +1,14 @@
@import constants
@import font-awesome
section.main-section
@import foundation_and_overrides
#ember-app-container
background-image: $wood
background-repeat: repeat
main.main-section
+panel($bg:rgba(200,200,200,0.8))
height: 100%
.top-menu
.menu-list-item
float: right
margin-left: 20px
cursor: pointer
border: 0.08em solid #eee
padding: 3px
border-radius: 0.1em
line-height: 1em
margin-top: 10px
&.active
color: yellow
border-color: yellow
padding: 0
margin: 0
span.icon
@extend .fa
@extend .fa-lg