UNPKG

2.46 kBSCSSView Raw
1/**
2* Position utilities.
3*
4* naming convention: gl-{property-value}
5*/
6@mixin gl-relative {
7 position: relative;
8}
9
10@mixin gl-absolute {
11 position: absolute;
12}
13
14@mixin gl-static {
15 position: static;
16}
17
18@mixin gl-fixed {
19 position: fixed;
20}
21
22@mixin gl-sticky {
23 position: sticky;
24}
25
26/**
27* Placement utilities.
28*
29* For absolute or fixed positioned elements
30*
31* naming convention: gl-{position}-{spacing-scale-index}
32*/
33
34/**
35* Placement utilities
36*
37* naming convention: gl-{position}-{value}
38*/
39@mixin gl-top-auto {
40 top: auto;
41}
42
43@mixin gl-top-0 {
44 top: 0;
45}
46
47@mixin gl-top-1 {
48 top: $gl-spacing-scale-1;
49}
50
51@mixin gl-top-2 {
52 top: $gl-spacing-scale-2;
53}
54
55@mixin gl-top-3 {
56 top: $gl-spacing-scale-3;
57}
58
59@mixin gl-top-4 {
60 top: $gl-spacing-scale-4;
61}
62
63@mixin gl-top-5 {
64 top: $gl-spacing-scale-5;
65}
66
67@mixin gl-top-6 {
68 top: $gl-spacing-scale-6;
69}
70
71@mixin gl-top-7 {
72 top: $gl-spacing-scale-7;
73}
74
75@mixin gl-top-8 {
76 top: $gl-spacing-scale-8;
77}
78
79@mixin gl-top-half {
80 top: 50%;
81}
82
83@mixin gl-right-auto {
84 right: auto;
85}
86
87@mixin gl-right-0 {
88 right: 0;
89}
90
91@mixin gl-right-1 {
92 right: $gl-spacing-scale-1;
93}
94
95@mixin gl-right-2 {
96 right: $gl-spacing-scale-2;
97}
98
99@mixin gl-right-3 {
100 right: $gl-spacing-scale-3;
101}
102
103@mixin gl-right-4 {
104 right: $gl-spacing-scale-4;
105}
106
107@mixin gl-right-5 {
108 right: $gl-spacing-scale-5;
109}
110
111@mixin gl-right-6 {
112 right: $gl-spacing-scale-6;
113}
114
115@mixin gl-right-7 {
116 right: $gl-spacing-scale-7;
117}
118
119@mixin gl-bottom-0 {
120 bottom: 0;
121}
122
123@mixin gl-bottom-1 {
124 bottom: $gl-spacing-scale-1;
125}
126
127@mixin gl-bottom-2 {
128 bottom: $gl-spacing-scale-2;
129}
130
131@mixin gl-bottom-3 {
132 bottom: $gl-spacing-scale-3;
133}
134
135@mixin gl-bottom-4 {
136 bottom: $gl-spacing-scale-4;
137}
138
139@mixin gl-bottom-5 {
140 bottom: $gl-spacing-scale-5;
141}
142
143@mixin gl-bottom-6 {
144 bottom: $gl-spacing-scale-6;
145}
146
147@mixin gl-bottom-7 {
148 bottom: $gl-spacing-scale-7;
149}
150
151@mixin gl-left-auto {
152 left: auto;
153}
154
155@mixin gl-left-0 {
156 left: 0;
157}
158
159@mixin gl-left-1 {
160 left: $gl-spacing-scale-1;
161}
162
163@mixin gl-left-2 {
164 left: $gl-spacing-scale-2;
165}
166
167@mixin gl-left-3 {
168 left: $gl-spacing-scale-3;
169}
170
171@mixin gl-left-4 {
172 left: $gl-spacing-scale-4;
173}
174
175@mixin gl-left-5 {
176 left: $gl-spacing-scale-5;
177}
178
179@mixin gl-left-6 {
180 left: $gl-spacing-scale-6;
181}
182
183@mixin gl-left-7 {
184 left: $gl-spacing-scale-7;
185}
186
187@mixin gl-left-50p {
188 left: 50%;
189}
190
191@mixin gl-top-n5 {
192 top: -$gl-spacing-scale-5;
193}
194
195@mixin gl-float-left {
196 float: left;
197}
198
199@mixin gl-float-right {
200 float: right;
201}