1
0
mirror of https://github.com/kremalicious/blog.git synced 2024-11-27 04:10:03 +01:00
blog/_src/_assets/styl/navigation.styl

100 lines
1.7 KiB
Stylus
Raw Normal View History

2014-07-12 21:22:47 +02:00
//
// kremalicious3
// --------------
// Navigation
//
.menu-btn,
.search-btn
@extend .textcenter
line-height: 1em
vertical-align: middle
display: inline-block
margin: 0
position: absolute
right: 0
top: -($spacer/4)
2014-07-12 21:22:47 +02:00
2015-05-31 22:23:58 +02:00
&:focus
outline: 0
2016-04-16 21:10:22 +02:00
&:hover,
&:focus
.icon
fill: $link-color
.hamburger span
background: $link-color
2015-06-08 21:38:12 +02:00
2015-08-20 00:19:58 +02:00
&:active
background: transparent
transition: none
.icon
fill: darken($link-color, 30%)
2016-04-16 21:10:22 +02:00
.hamburger span
background: darken($link-color, 30%)
2015-06-08 21:38:12 +02:00
2015-08-09 21:50:06 +02:00
.menu-btn
margin-right: -.5em
padding: .5em .7em
2014-07-12 21:22:47 +02:00
2015-08-09 21:50:06 +02:00
// Main Navigation
/////////////////////////////////////
2014-07-12 21:22:47 +02:00
.nav-popover
2015-08-09 21:50:06 +02:00
@extend .divider-top, .list-unstyled
padding: $spacer 0
margin-top: $spacer
2015-08-09 21:50:06 +02:00
margin-bottom: 0
2014-07-12 21:22:47 +02:00
width: 100%
background: $body-bg
display: flex // .nav-popver overwrite
margin-left: 0 // .grid overwrite
2015-08-18 20:55:30 +02:00
.grid__col
padding-top: 0
2014-07-12 21:22:47 +02:00
2015-08-19 01:37:29 +02:00
opacity: 0
2015-11-28 01:19:31 +01:00
.has-menu-open &
2015-08-19 01:37:29 +02:00
opacity: 1
2014-07-12 21:22:47 +02:00
.nav-link
@extend .category
font-size: $font-size-small
2014-07-13 00:42:57 +02:00
text-shadow: 0 1px 0 rgba(#fff, .5)
2015-06-14 20:26:25 +02:00
padding: $padding-base-vertical $padding-base-horizontal
2014-07-12 21:22:47 +02:00
margin-bottom: 0
2015-06-14 20:26:25 +02:00
margin-top: 0
display: block
border: none
2014-07-12 21:22:47 +02:00
// Paginator
/////////////////////////////////////
.paginator
padding-top: ($spacer*2)
padding-bottom: ($spacer*2)
2015-08-18 22:45:30 +02:00
2015-05-31 21:56:40 +02:00
.icon
2015-06-08 21:22:09 +02:00
margin-bottom: -3px
2015-08-18 22:45:30 +02:00
p
margin-bottom: 0;
2014-07-12 21:22:47 +02:00
2015-05-31 21:56:40 +02:00
.paginator-next
text-align: right
2014-07-12 21:22:47 +02:00
2015-06-22 21:28:31 +02:00
.paginator-pages
@extend .textcenter, .dimmed
font-size: $font-size-small
2014-07-12 21:22:47 +02:00
2015-05-31 21:56:40 +02:00
.paginator-number
2015-06-22 21:28:31 +02:00
font-size: $font-size-base
color: $text-color-light
padding: 0 2px
2014-07-12 21:22:47 +02:00
2015-05-31 21:56:40 +02:00
.paginator-title
2015-08-20 00:19:58 +02:00
@extend .page-title