-
Notifications
You must be signed in to change notification settings - Fork 0
/
_hamburgers.scss
57 lines (51 loc) · 1.86 KB
/
_hamburgers.scss
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
@charset "UTF-8";
/*!
* Hamburgers
* @description Tasty CSS-animated hamburgers
* @author Jonathan Suh @jonsuh
* @site https://jonsuh.com/hamburgers
* @link https://github.com/jonsuh/hamburgers
*/
// Settings
// ==================================================
$hamburger-padding-x : 10px !default;
$hamburger-padding-y : 10px !default;
$hamburger-layer-width : 23px !default;
$hamburger-layer-height : 2px !default;
$hamburger-layer-spacing : 4px !default;
$hamburger-layer-color : $b3 !default;
$hamburger-layer-border-radius : 1px !default;
$hamburger-hover-opacity : 0.4 !default;
$hamburger-hover-transition-duration : 0.15s !default;
$hamburger-hover-transition-timing-function: linear !default;
// To use CSS filters as the hover effect instead of opacity,
// set $hamburger-hover-use-filter as true and
// change the value of $hamburger-hover-filter accordingly.
$hamburger-hover-use-filter: false !default;
$hamburger-hover-filter : opacity(50%) !default;
// Types (Remove or comment out what you don’t need)
// ==================================================
$hamburger-types: (
spin
) !default;
// Base Hamburger (We need this)
// ==================================================
@import "base";
// Hamburger types
// ==================================================
@import "types/spin";
// ==================================================
// Cooking up additional types:
//
// The Sass for each hamburger type should be nested
// inside an @if directive to check whether or not
// it exists in $hamburger-types so only the CSS for
// included types are generated.
//
// e.g. hamburgers/types/_new-type.scss
//
// @if index($hamburger-types, new-type) {
// .hamburger--new-type {
// ...
// }
// }