ui-kit/src/styles/common/_variables.scss at main · stoplightio/ui-kit · GitHub

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
@import './utils';

/*
 * CONFIG TO BE PASSED IN BY THE CONSUMER
 * $sl-config should never be called outside of this file, unless being set in another application
 */
$sl-config: () !default;

/*
 * DEFAULTS DEFINED BY STOPLIGHT
 * $sl-defaults should never be called outside of this file
 */

$sl-defaults: (
  namespace: 'bp3',
  colors: (
    transparent: transparent,
    black: #10161a,
    white: #fff,
    disabled: rgba(#394b59, 0.5),
    lighten: (
      1: rgba(255, 255, 255, 0.02),
      2: rgba(255, 255, 255, 0.05),
      3: rgba(255, 255, 255, 0.1),
      4: rgba(255, 255, 255, 0.15),
      5: rgba(255, 255, 255, 0.25),
      6: rgba(255, 255, 255, 0.35),
      7: rgba(255, 255, 255, 0.5),
      8: rgba(255, 255, 255, 0.6),
      9: rgba(255, 255, 255, 0.8),
    ),
    darken: (
      1: rgba(0, 0, 0, 0.03),
      2: rgba(0, 0, 0, 0.06),
      3: rgba(0, 0, 0, 0.1),
      4: rgba(0, 0, 0, 0.15),
      5: rgba(0, 0, 0, 0.25),
      6: rgba(0, 0, 0, 0.35),
      7: rgba(0, 0, 0, 0.5),
      8: rgba(0, 0, 0, 0.6),
      9: rgba(0, 0, 0, 0.8),
    ),
    gray: (
      1: #ebf1f5,
      2: #d8e1e8,
      3: #ced9e0,
      4: #a7b6c2,
      5: #738694,
      6: #394b59,
      7: #293742,
      8: #202b33,
      9: #182026,
    ),
    red: (
      1: #fff5f5,
      2: #fed7d7,
      3: #feb2b2,
      4: #fc8181,
      5: #f56565,
      6: #e53e3e,
      7: #c53030,
      8: #9b2c2c,
      9: #742a2a,
    ),
    orange: (
      1: #fffaf0,
      2: #feebc8,
      3: #fbd38d,
      4: #f6ad55,
      5: #ed8936,
      6: #dd6b20,
      7: #c05621,
      8: #9c4221,
      9: #7b341e,
    ),
    green: (
      1: #f0fff4,
      2: #c6f6d5,
      3: #9ae6b4,
      4: #68d391,
      5: #48bb78,
      6: #38a169,
      7: #2f855a,
      8: #276749,
      9: #22543d,
    ),
    blue: (
      1: #d4effd,
      2: #92cbec,
      3: #42adf0,
      4: #2998e7,
      5: #008eff,
      6: #0b6fcc,
      7: #0e59aa,
      8: #17447c,
      9: #0e305f,
    ),
    purple: (
      1: #faf5ff,
      2: #e9d8fd,
      3: #d6bcfa,
      4: #b794f4,
      5: #9f7aea,
      6: #805ad5,
      7: #6b46c1,
      8: #553c9a,
      9: #44337a,
    ),
  ),
);

/*
 * RESOLVED VARIABLES USED IN ./theme.scss
 * deep merge of defaults and consumer config
 * $sl-variables should never be called outside of ./theme.scss
 */
$sl-variables: map-extend($sl-defaults, $sl-config, true);