Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Delta Between Two Patch Sets: scss/_variables.scss

Issue 29361647: Issue 4607 - Default content styles (Closed)
Left Patch Set: Removed missing grid dependency. Created Nov. 3, 2016, 5:48 p.m.
Right Patch Set: See comments for details Created Dec. 1, 2016, 2:05 p.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
Left: Side by side diff | Download
Right: Side by side diff | Download
« no previous file with change/comment | « scss/_content.scss ('k') | scss/main.scss » ('j') | no next file with change/comment »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
LEFTRIGHT
1 /*! 1 /*!
2 * This file is part of universal-design-language 2 * This file is part of website-defaults
3 * Copyright (C) 2016 Eyeo GmbH 3 * Copyright (C) 2016 Eyeo GmbH
4 * 4 *
5 * universal-design-language is free software: you can redistribute it and/or 5 * website-defaults is free software: you can redistribute it and/or
6 * modify it under the terms of the GNU General Public License as published by 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 7 * the Free Software Foundation, either version 3 of the License, or
8 * (at your option) any later version. 8 * (at your option) any later version.
9 * 9 *
10 * universal-design-language is distributed in the hope that it will be useful, 10 * website-defaults is distributed in the hope that it will be useful,
11 * but WITHOUT ANY WARRANTY; without even the implied warranty of 11 * but WITHOUT ANY WARRANTY; without even the implied warranty of
12 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 12 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
13 * GNU General Public License for more details. 13 * GNU General Public License for more details.
14 * 14 *
15 * You should have received a copy of the GNU General Public License 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/>. 16 * along with website-defaults. If not, see <http://www.gnu.org/licenses/>.
17 */ 17 */
18 18
19 /* colors 19 /*******************************************************************************
20 * Variables
21 *******************************************************************************
22 * ~ WARNING ~ DO NOT EDIT THIS FILE!
23 * Set variables within project specfic SCSS before including website defaults.
24 *******************************************************************************
25 * - Brand colors
26 * - Fonts
27 * - Spacing
28 * - Breakpoints
20 ******************************************************************************/ 29 ******************************************************************************/
21 30
22 $white: #fafafa; 31 /* Brand colors
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 ******************************************************************************/ 32 ******************************************************************************/
62 33
63 $large-font: 24px; 34 /* Primary - The most widely used across all screens and components. */
64 $medium-font: 16px;
65 $small-font: 12px;
66 35
67 /* font weights 36 $primary: #212121 !default;
37 $primary-light: #fff !default;
38 $primary-dark: #000 !default;
39
40 /* Secondary - Used to indicate a related action or information. */
41
42 $secondary: #9e9e9e !default;
43 $secondary-light: #eee !default;
44 $secondary-dark: #424242 !default;
45
46 /* Accent - Used for action buttons and interactive elements. */
47
48 $accent: #1565c0 !default;
49 $accent-light: #e3f2fd !default;
50 $accent-dark: #0d47a1 !default;
51
52 /* Error - Used for error messages and warnings. */
53
54 $error: #f44336 !default;
55 $error-light: #ffebee !default;
56 $error-dark: #b71c1c !default;
57
58 /* Fonts
68 ******************************************************************************/ 59 ******************************************************************************/
69 60
70 $bold-weight: 600; 61 $primary-font: sans-serif !default;
71 $normal-weight: 400; 62 $secondary-font: serif !default;
72 $thin-weight: 300; 63 $monospace-font: monospace !default;
73 64
74 /* spacing 65 $large-font: 20px !default;
66 $medium-font: 16px !default;
67 $small-font: 12px !default;
68
69 $bold-weight: 600 !default;
70 $normal-weight: 400 !default;
71 $thin-weight: 300 !default;
72
73 /* Spacing
75 ******************************************************************************/ 74 ******************************************************************************/
76 75
77 $large-space: 56px; 76 $large-space: 64px !default;
78 $medium-space: 34px; 77 $medium-space: 32px !default;
79 $small-space: 12px; 78 $small-space: 16px !default;
80 79
81 /* breakpoints 80 /* Breakpoints
82 ******************************************************************************/ 81 ******************************************************************************/
83 82
84 $mobile-breakpoint: 576px;
85 $tablet-breakpoint: 768px; 83 $tablet-breakpoint: 768px;
86 $desktop-breakpoint: 992px; 84 $desktop-breakpoint: 992px;
85
86 /* Container widths
87 ******************************************************************************/
88
89 $mobile-width: 540px !default;
90 $tablet-width: 720px !default;
91 $desktop-width: 960px !default;
LEFTRIGHT

Powered by Google App Engine
This is Rietveld