@appscode/design-system 2.0.38 → 2.0.40

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/main.scss +0 -2
  2. package/package.json +1 -1
  3. package/vue-components/styles/base/utilities/_colors.scss +5 -25
  4. package/vue-components/styles/components/footer/_footer-area.scss +2 -2
  5. package/vue-components/styles/components/sidebar/_left-sidebar.scss +1 -1
  6. package/vue-components/styles/theme/_appscode.scss +5 -24
package/main.scss CHANGED
@@ -1,6 +1,4 @@
1
1
  @charset "utf-8";
2
- $secondary-hue: 208;
3
- $secondary-saturation: 77%;
4
2
  // customize bulma css
5
3
  @import "@/components/vue-components/styles/base/utilities/_customize-bulma.scss";
6
4
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@appscode/design-system",
3
- "version": "2.0.38",
3
+ "version": "2.0.40",
4
4
  "description": "A design system for Appscode websites and dashboards made using Bulma",
5
5
  "main": "main.scss",
6
6
  "scripts": {
package/vue-components/styles/base/utilities/_colors.scss CHANGED
@@ -23,34 +23,14 @@ $primary-97: hsl($primary-hue, $primary-saturation, 97%);
23
23
  $primary-light-grey: hsl($primary-hue, 30%, 96%);
24
24
  $primary-dark-grey: hsl($primary-hue, 30%, 10%);
25
25
 
26
- // secondary color guides
27
- $secondary-hue: 197;
28
- $secondary-saturation: 50%;
29
- $secondary-5: hsl($secondary-hue, $secondary-saturation, 5%);
30
- $secondary-10: hsl($secondary-hue, $secondary-saturation, 10%);
31
- $secondary-20: hsl($secondary-hue, $secondary-saturation, 20%);
32
- $secondary: hsl($secondary-hue, $secondary-saturation, 20%);
33
- $secondary-30: hsl($secondary-hue, $secondary-saturation, 30%);
34
- $secondary-40: hsl($secondary-hue, $secondary-saturation, 40%);
35
- $secondary-50: hsl($secondary-hue, $secondary-saturation, 50%);
36
- $secondary-60: hsl($secondary-hue, $secondary-saturation, 60%);
37
- $secondary-70: hsl($secondary-hue, $secondary-saturation, 70%);
38
- $secondary-80: hsl($secondary-hue, $secondary-saturation, 80%);
39
- $secondary-90: hsl($secondary-hue, $secondary-saturation, 90%);
40
- $secondary-93: hsl($secondary-hue, $secondary-saturation, 93%);
41
- $secondary-95: hsl($secondary-hue, $secondary-saturation, 95%);
42
- $secondary-97: hsl($secondary-hue, $secondary-saturation, 97%);
43
-
44
- $secondary-light-grey: hsl($secondary-hue, 30%, 96%);
45
- $secondary-dark-grey: hsl($secondary-hue, 30%, 10%);
46
-
47
- $color-text: hsl($secondary-hue, 10%, 35%);
48
- $color-heading: hsl($secondary-hue, 10%, 10%);
49
- $color-label: hsl($secondary-hue, 20%, 50%);
50
- $color-link: hsl($secondary-hue, 40%, 20%);
26
+ $color-text: hsl($primary-hue, 10%, 35%);
27
+ $color-heading: hsl($primary-hue, 10%, 10%);
28
+ $color-label: hsl($primary-hue, 20%, 50%);
29
+ $color-link: hsl($primary-hue, 40%, 20%);
51
30
  $color-border-light: hsl($primary-hue, 40%, 95%);
52
31
  $color-border: hsl($primary-hue, 50%, 90%);
53
32
  $color-border-dark: hsl($primary-hue, 10%, 80%);
33
+ $color-sidebar: hsl($primary-hue, $primary-saturation, 10%);
54
34
 
55
35
  // green color guides
56
36
  $green-hue: 141;
package/vue-components/styles/components/footer/_footer-area.scss CHANGED
@@ -7,8 +7,8 @@
7
7
  width: calc(100% - 250px);
8
8
  min-height: 30px;
9
9
  padding: 0 20px;
10
- background: $secondary;
11
- border-top: 1px solid $secondary-30;
10
+ background: $color-sidebar;
11
+ border-top: 1px solid rgba(255, 255, 255, 0.2);
12
12
  z-index: 9999;
13
13
  transition: 0.3s ease-in-out;
14
14
  }
package/vue-components/styles/components/sidebar/_left-sidebar.scss CHANGED
@@ -2,7 +2,7 @@
2
2
  position: fixed;
3
3
  top: 0px;
4
4
  z-index: 9999;
5
- background-color: $secondary;
5
+ background-color: $color-sidebar;
6
6
  width: 250px;
7
7
  transition: 0.3s ease-in-out;
8
8
  }
package/vue-components/styles/theme/_appscode.scss CHANGED
@@ -18,30 +18,11 @@ $primary-97: hsl($primary-hue, $primary-saturation, 97%);
18
18
  $primary-light-grey: hsl($primary-hue, 30%, 96%);
19
19
  $primary-dark-grey: hsl($primary-hue, 30%, 10%);
20
20
 
21
- $secondary-hue: 197;
22
- $secondary-saturation: 50%;
23
- $secondary-5: hsl($secondary-hue, $secondary-saturation, 5%);
24
- $secondary-10: hsl($secondary-hue, $secondary-saturation, 10%);
25
- $secondary-20: hsl($secondary-hue, $secondary-saturation, 20%);
26
- $secondary: hsl($secondary-hue, $secondary-saturation, 20%);
27
- $secondary-30: hsl($secondary-hue, $secondary-saturation, 30%);
28
- $secondary-40: hsl($secondary-hue, $secondary-saturation, 40%);
29
- $secondary-50: hsl($secondary-hue, $secondary-saturation, 50%);
30
- $secondary-60: hsl($secondary-hue, $secondary-saturation, 60%);
31
- $secondary-70: hsl($secondary-hue, $secondary-saturation, 70%);
32
- $secondary-80: hsl($secondary-hue, $secondary-saturation, 80%);
33
- $secondary-90: hsl($secondary-hue, $secondary-saturation, 90%);
34
- $secondary-93: hsl($secondary-hue, $secondary-saturation, 93%);
35
- $secondary-95: hsl($secondary-hue, $secondary-saturation, 95%);
36
- $secondary-97: hsl($secondary-hue, $secondary-saturation, 97%);
37
-
38
- $secondary-light-grey: hsl($secondary-hue, 30%, 96%);
39
- $secondary-dark-grey: hsl($secondary-hue, 30%, 10%);
40
-
41
- $color-text: hsl($secondary-hue, 10%, 35%);
42
- $color-heading: hsl($secondary-hue, 10%, 10%);
43
- $color-label: hsl($secondary-hue, 20%, 50%);
44
- $color-link: hsl($secondary-hue, 40%, 20%);
21
+ $color-text: hsl($primary-hue, 10%, 35%);
22
+ $color-heading: hsl($primary-hue, 10%, 10%);
23
+ $color-label: hsl($primary-hue, 20%, 50%);
24
+ $color-link: hsl($primary-hue, 40%, 20%);
45
25
  $color-border-light: hsl($primary-hue, 30%, 95%);
46
26
  $color-border: hsl($primary-hue, 30%, 90%);
47
27
  $color-border-dark: hsl($primary-hue, 10%, 80%);
28
+ $color-sidebar: hsl($primary-hue, $primary-saturation, 5%);