Left: | ||
Right: |
OLD | NEW |
---|---|
(Empty) | |
1 /*! | |
2 * This file is part of universal-design-language | |
3 * Copyright (C) 2016 Eyeo GmbH | |
4 * | |
5 * universal-design-language is free software: you can redistribute it and/or | |
6 * modify it under the terms of the GNU General Public License as published by | |
7 * the Free Software Foundation, either version 3 of the License, or | |
8 * (at your option) any later version. | |
9 * | |
10 * universal-design-language is distributed in the hope that it will be useful, | |
11 * but WITHOUT ANY WARRANTY; without even the implied warranty of | |
12 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the | |
13 * GNU General Public License for more details. | |
14 * | |
15 * You should have received a copy of the GNU General Public License | |
16 * along with web.starter-kit. If not, see <http://www.gnu.org/licenses/>. | |
17 */ | |
18 | |
19 /* colors | |
20 ******************************************************************************/ | |
21 | |
22 $white: #fafafa; | |
23 $gray-light: #e0e0e0; | |
24 $gray: #9e9e9e; | |
25 $gray-dark: #616161; | |
26 $black: #212121; | |
27 | |
28 $red-light: #ffcdd2; | |
29 $red: #f44336; | |
30 $red-dark: #b71c1c; | |
31 | |
32 $green-light: #c8e6c9; | |
33 $green: #4caf50; | |
34 $green-dark: #1b5e20; | |
35 | |
36 $blue-light: #bbdefb; | |
37 $blue: #2196f3; | |
38 $blue-dark: #0d47a1; | |
39 | |
40 $primary: $white; | |
saroyanm
2016/11/03 19:41:15
To what $primary variable suppose to apply ?
juliandoucette
2016/11/03 22:59:38
See comment below.
| |
41 $primary-foreground: $black; | |
42 $primary-background: $white; | |
43 | |
44 $inverted: $black; | |
saroyanm
2016/11/03 19:41:14
To what $inverted variable suppose to apply ?
juliandoucette
2016/11/03 22:59:39
See comment below.
| |
45 $inverted-foreground: $white; | |
46 $inverted-background: $black; | |
47 | |
48 $secondary: $gray-dark; | |
saroyanm
2016/11/03 19:41:14
To what $secondary variable suppose to apply ?
juliandoucette
2016/11/03 22:59:38
See comment below.
| |
49 $secondary-foreground: $gray-light; | |
50 $secondary-background: $gray-dark; | |
51 | |
52 $accent: $blue; | |
saroyanm
2016/11/03 19:41:14
To what $accent variable suppose to apply ?
juliandoucette
2016/11/03 22:59:38
Sorry for the confusion. These are common *design
saroyanm
2016/11/04 16:01:18
Acknowledged.
juliandoucette
2016/11/04 17:32:27
1. I will add comments describing the naming schem
juliandoucette
2016/11/08 15:52:00
Done.
| |
53 $accent-foreground: $white; | |
54 $accent-background: $blue-dark; | |
55 | |
56 $error: $red; | |
57 $error-foreground: $white; | |
58 $error-background: $red-dark; | |
59 | |
60 /* font sizes | |
61 ******************************************************************************/ | |
62 | |
63 $large-font: 24px; | |
64 $medium-font: 16px; | |
65 $small-font: 12px; | |
66 | |
67 /* font weights | |
68 ******************************************************************************/ | |
69 | |
70 $bold-weight: 600; | |
71 $normal-weight: 400; | |
72 $thin-weight: 300; | |
73 | |
74 /* spacing | |
75 ******************************************************************************/ | |
76 | |
77 $large-space: 56px; | |
78 $medium-space: 34px; | |
79 $small-space: 12px; | |
80 | |
81 /* breakpoints | |
82 ******************************************************************************/ | |
83 | |
84 $mobile-breakpoint: 576px; | |
85 $tablet-breakpoint: 768px; | |
86 $desktop-breakpoint: 992px; | |
OLD | NEW |