Newer
Older
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
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
/**
* Breakpoint Configuration
* @see https://github.com/Team-Sass/breakpoint/wiki
*
*/
/////////
// Singularity variables
//
@include breakpoint-set('to ems', true);
// Breakpoints variables
$main-menu-medium: 43rem;
$xs: 30rem;
$small: 40.06rem;
$medium: 48.06rem;
$large: 63.1875rem;
$xl: 75rem;
$xxl: 102.5rem;
$onek: 120rem;
$twok: 159.93rem;
$max-width: $xl;
/// Mixin - xs Breakpoint
/// Allows easier @include xs {} syntax
@mixin xs {
@include breakpoint($xs) {
@content;
}
}
/// Mixin - small Breakpoint
/// Allows easier @include small {} syntax
@mixin small {
@include breakpoint($small) {
@content;
}
}
/// Mixin - medium Breakpoint
/// Allows easier @include medium {} syntax
@mixin medium {
@include breakpoint($medium) {
@content;
}
}
/// Mixin - large Breakpoint
/// Allows easier @include large {} syntax
@mixin large {
@include breakpoint($large) {
@content;
}
}
/// Mixin - xl Breakpoint
/// Allows easier @include xl {} syntax
@mixin xl {
@include breakpoint($xl) {
@content;
}
}
/// Mixin - xl Breakpoint
/// Allows easier @include xxl {} syntax
@mixin xxl {
@include breakpoint($xxl) {
@content;
}
}
/// Mixin - xl Breakpoint
/// Allows easier @include onek {} syntax
@mixin onek {
@include breakpoint($onek) {
@content;
}
}
/// Mixin - xl Breakpoint
/// Allows easier @include twok {} syntax
@mixin twok {
@include breakpoint($twok) {
@content;
}
}
/// Mixin - max-width Breakpoint
/// Allows easier @include max-width {} syntax
@mixin max-width {
@include breakpoint($max-width) {
@content;
}