aboutsummaryrefslogtreecommitdiffstats
path: root/src/css/imports/_coordinates.css
blob: 749fed8e25f53a761e13e882cab34f13b82d608f (plain)
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
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
.top-0    { top:    0; }
.right-0  { right:  0; }
.bottom-0 { bottom: 0; }
.left-0   { left:   0; }

.top-1    { top:    var(--spacing-medium); }
.right-1  { right:  var(--spacing-medium); }
.bottom-1 { bottom: var(--spacing-medium); }
.left-1   { left:   var(--spacing-medium); }

.top-2    { top:    2rem; }
.right-2  { right:  2rem; }
.bottom-2 { bottom: 2rem; }
.left-2   { left:   2rem; }

.top--1    { top:    -var(--spacing-medium); }
.right--1  { right:  -var(--spacing-medium); }
.bottom--1 { bottom: -var(--spacing-medium); }
.left--1   { left:   -var(--spacing-medium); }

.top--2    { top:    -2rem; }
.right--2  { right:  -2rem; }
.bottom--2 { bottom: -2rem; }
.left--2   { left:   -2rem; }


.absolute--fill {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

@media (--breakpoint-not-small) {
  .top-0-ns     { top:   0; }
  .left-0-ns    { left:  0; }
  .right-0-ns   { right: 0; }
  .bottom-0-ns  { bottom: 0; }
  .top-1-ns     { top:   var(--spacing-medium); }
  .left-1-ns    { left:  var(--spacing-medium); }
  .right-1-ns   { right: var(--spacing-medium); }
  .bottom-1-ns  { bottom: var(--spacing-medium); }
  .top-2-ns     { top:   2rem; }
  .left-2-ns    { left:  2rem; }
  .right-2-ns   { right: 2rem; }
  .bottom-2-ns  { bottom: 2rem; }
  .top--1-ns    { top:    -var(--spacing-medium); }
  .right--1-ns  { right:  -var(--spacing-medium); }
  .bottom--1-ns { bottom: -var(--spacing-medium); }
  .left--1-ns   { left:   -var(--spacing-medium); }
  .top--2-ns    { top:    -2rem; }
  .right--2-ns  { right:  -2rem; }
  .bottom--2-ns { bottom: -2rem; }
  .left--2-ns   { left:   -2rem; }
  .absolute--fill-ns {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }
}

@media (--breakpoint-medium) {
  .top-0-m     { top:   0; }
  .left-0-m    { left:  0; }
  .right-0-m   { right: 0; }
  .bottom-0-m  { bottom: 0; }
  .top-1-m     { top:   var(--spacing-medium); }
  .left-1-m    { left:  var(--spacing-medium); }
  .right-1-m   { right: var(--spacing-medium); }
  .bottom-1-m  { bottom: var(--spacing-medium); }
  .top-2-m     { top:   2rem; }
  .left-2-m    { left:  2rem; }
  .right-2-m   { right: 2rem; }
  .bottom-2-m  { bottom: 2rem; }
  .top--1-m    { top:    -var(--spacing-medium); }
  .right--1-m  { right:  -var(--spacing-medium); }
  .bottom--1-m { bottom: -var(--spacing-medium); }
  .left--1-m   { left:   -var(--spacing-medium); }
  .top--2-m    { top:    -2rem; }
  .right--2-m  { right:  -2rem; }
  .bottom--2-m { bottom: -2rem; }
  .left--2-m   { left:   -2rem; }
  .absolute--fill-m {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }
}

@media (--breakpoint-large) {
  .top-0-l     { top:   0; }
  .left-0-l    { left:  0; }
  .right-0-l   { right: 0; }
  .bottom-0-l  { bottom: 0; }
  .top-1-l     { top:   var(--spacing-medium); }
  .left-1-l    { left:  var(--spacing-medium); }
  .right-1-l   { right: var(--spacing-medium); }
  .bottom-1-l  { bottom: var(--spacing-medium); }
  .top-2-l     { top:   2rem; }
  .left-2-l    { left:  2rem; }
  .right-2-l   { right: 2rem; }
  .bottom-2-l  { bottom: 2rem; }
  .top--1-l    { top:    -var(--spacing-medium); }
  .right--1-l  { right:  -var(--spacing-medium); }
  .bottom--1-l { bottom: -var(--spacing-medium); }
  .left--1-l   { left:   -var(--spacing-medium); }
  .top--2-l    { top:    -2rem; }
  .right--2-l  { right:  -2rem; }
  .bottom--2-l { bottom: -2rem; }
  .left--2-l   { left:   -2rem; }
  .absolute--fill-l {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }
}