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
$background1: #f7f7f7;
$content: #282828;
$content2: #666;
$border1: #ccc;
$blue1: #1b77d3;
$blue2: #3db7ff;
$darkBlue: #064989;
$green1: #7ab317;
$green2: #a8d46f;
$orange1: #efa026;
//$orange1: #ffb036;
//$orange2: #F18828;
$orange2: #ee801c;
$red1: #ce1836;
$yellow1: #f2d000;
$yellow2: #fcefa9;
$darkYellow: #a58c00;
/* spacing */
$spacingSmaller: 5px;
$spacingSmall: 10px;
$spacingMedium: 15px;
$spacingLarge: 30px;
/* z-index stack */
$belowSidebar: 10;
$sidebar: 20;
$aboveSidebar: 30;
$belowDialog: 90;
$dialog: 100;
$aboveDialog: 110;
$transitionDurationFast: 0.1s;
$transitionDuration: 0.2s;
$transitionDurationSlow: 0.4s;
@mixin fullBleedLeft() {
&::before {
background: inherit;
border-bottom: inherit;
bottom: -1px;
content: "";
display: block;
position: absolute;
right: 100%;
top: 0;
width: 999px;
z-index: $belowSidebar;
}
}
@mixin fullBleedRight() {
&::after {
background: inherit;
border-bottom: inherit;
bottom: -1px;
content: "";
display: block;
left: 100%;
position: absolute;
top: 0;
width: 999px;
z-index: $belowSidebar;
}
}