Fix nav, Remove navbar and header references, Add visited links

This commit is contained in:
Jeremy Thomas 2016-05-08 11:01:55 +01:00
parent 75183ea5c1
commit 4d11966589
7 changed files with 51 additions and 42 deletions

View File

@ -8,6 +8,8 @@
* Added: `.tabs ul` left center right * Added: `.tabs ul` left center right
* Changed: `.navbar` renamed to `.level` * Changed: `.navbar` renamed to `.level`
* Changed: `.header` renamed to `.nav` * Changed: `.header` renamed to `.nav`
* Deprecated: `.header`
* Deprecated: `.navbar`
* Fixed: `.hero` layout * Fixed: `.hero` layout
## 0.0.25 ## 0.0.25

View File

@ -1,19 +1,4 @@
.nav // Components
align-items: stretch
background: $white
display: flex
min-height: $nav-height
position: relative
text-align: center
z-index: 2
& > .container
align-items: stretch
display: flex
min-height: $nav-height
width: 100%
// Modifiers
&.has-shadow
box-shadow: 0 2px 3px rgba($black, 0.1)
.nav-toggle .nav-toggle
@extend .hamburger @extend .hamburger
@ -21,8 +6,6 @@
+tablet +tablet
display: none display: none
// Elements
.nav-item .nav-item
align-items: center align-items: center
display: flex display: flex
@ -64,21 +47,6 @@ a.nav-item
border-top: 3px solid transparent border-top: 3px solid transparent
color: $link color: $link
.nav-tab
align-items: center
border: 1px solid transparent
color: $text
display: block
height: $nav-height
line-height: 24px
padding: 13px 15px
&:hover
border-bottom: 1px solid $link
// Modifiers
&.is-active
border-bottom: 3px solid $link
color: $link
// Containers // Containers
.nav-menu .nav-menu
@ -118,3 +86,35 @@ a.nav-item
display: flex display: flex
flex: 1 flex: 1
justify-content: flex-end justify-content: flex-end
// Main container
.nav
align-items: stretch
background: $white
display: flex
min-height: $nav-height
position: relative
text-align: center
z-index: 2
& > .container
align-items: stretch
display: flex
min-height: $nav-height
width: 100%
& > .nav-left
& > .nav-item:first-child:not(.is-tab)
padding-left: 0
& > .nav-right
& > .nav-item:last-child:not(.is-tab)
padding-right: 0
.container > &
& > .nav-left
& > .nav-item:first-child:not(.is-tab)
padding-left: 0
& > .nav-right
& > .nav-item:last-child:not(.is-tab)
padding-right: 0
// Modifiers
&.has-shadow
box-shadow: 0 2px 3px rgba($black, 0.1)

View File

@ -2,8 +2,11 @@
@extend .block @extend .block
// Inline // Inline
a a
border-bottom: 1px solid $border
&:visited &:visited
color: $link-visited color: $link-visited
&:hover
border-bottom-color: $link
li + li li + li
margin-top: 0.25em margin-top: 0.25em
// Block // Block

View File

@ -83,7 +83,9 @@
&.is-striped &.is-striped
tbody tbody
tr tr
&:hover
background: darken($background, 5%)
&:nth-child(2n) &:nth-child(2n)
background: $background background: $background
&:hover &:hover
background: $border background: darken($background, 5%)

View File

@ -2,10 +2,12 @@
background: $background background: $background
padding: 40px 20px 80px padding: 40px 20px 80px
a a
color: $text &,
&:hover &:visited
color: $text-strong color: $text
&:not(.icon)
border-bottom: 1px solid $border
&:hover &:hover
border-bottom-color: $link color: $text-strong
&:not(.icon)
border-bottom: 1px solid $border
&:hover
border-bottom-color: $link

View File

@ -1,3 +1,5 @@
$header-height: 50px !default
.header .header
+clearfix +clearfix
background: $white background: $white

View File

@ -47,8 +47,6 @@ $widescreen: 1180px !default
$column-gap: 20px !default $column-gap: 20px !default
$header-height: 50px !default
$nav-height: 50px !default $nav-height: 50px !default
// Miscellaneous // Miscellaneous