Skip to content

Instantly share code, notes, and snippets.

@iamkeir
Last active August 29, 2015 14:02
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save iamkeir/b47693b8fa119a661456 to your computer and use it in GitHub Desktop.
Save iamkeir/b47693b8fa119a661456 to your computer and use it in GitHub Desktop.
Nav helper (SCSS)
// NAV HELPER
// Use @extend %nav etc. for leaner CSS
@mixin nav($type:null) {
@if $type == "reset-first" {
margin-left: 0;
padding-left: 0;
border-left: 0;
}
@else {
margin: 0;
padding: 0;
list-style: none;
li {
margin: 0;
}
@if $type == "inline" {
li {
@include inline-block;
}
}
@if $type == "float" {
@include clearfix;
li {
float: left;
}
}
@if $type == "table" { // Thanks @andymantell :)
display: table;
table-layout: fixed;
width: 100%;
border-collapse: collapse;
li {
display: table-cell;
}
}
}
}
%nav { @include nav; }
%nav--inline { @include nav("inline"); }
%nav--float { @include nav("float"); }
%nav--table { @include nav("table"); }
%nav--reset-first { @include nav("reset-first"); }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment