@appscode/design-system 2.0.41-alpha.3 → 2.0.41-alpha.5

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 (5) hide show
  1. package/package.json +1 -1
  2. package/vue-components/styles/base/utilities/_global.scss +3 -1
  3. package/vue-components/styles/base/utilities/_typography.scss +3 -0
  4. package/vue-components/styles/components/_button.scss +22 -22
  5. package/vue-components/styles/components/form-fields/_input.scss +5 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@appscode/design-system",
3
- "version": "2.0.41-alpha.3",
3
+ "version": "2.0.41-alpha.5",
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/_global.scss CHANGED
@@ -663,7 +663,7 @@ body:has(.has-info-content) {
663
663
  margin-left: auto;
664
664
  position: fixed;
665
665
  right: 0;
666
- background: #fff;
666
+ background: $white-100;
667
667
  top: 0;
668
668
  z-index: 99999;
669
669
  box-shadow: -3px 2px 10px 3px rgba(0, 0, 0, 0.1);
@@ -675,6 +675,8 @@ body:has(.has-info-content) {
675
675
 
676
676
  .tag:not(body) {
677
677
  &.is-primary {
678
+ background-color: $primary;
679
+ color: $white-100;
678
680
  &.is-light {
679
681
  color: $ac-primary;
680
682
  background-color: $primary-95;
package/vue-components/styles/base/utilities/_typography.scss CHANGED
@@ -138,3 +138,6 @@ strong {
138
138
  .material-icons {
139
139
  font-size: 1em;
140
140
  }
141
+ .has-text-primary {
142
+ color: $ac-primary;
143
+ }
package/vue-components/styles/components/_button.scss CHANGED
@@ -1,38 +1,38 @@
1
1
  .button {
2
- &.is-primary {
3
- background-color: $ac-primary;
4
- &:hover {
5
- background-color: $primary-30;
6
- }
7
- &.is-outlined {
8
- border-color: $ac-primary;
9
- // background-color: $ac-primary;
10
- color: $ac-primary;
11
- &:hover {
12
- border-color: $primary-30;
13
- background-color: $ac-primary;
14
- }
15
- &.is-light {
16
- background-color: $primary-95;
17
- &:hover {
18
- background-color: $ac-primary;
19
- color: $white-100;
20
- }
21
- }
22
- }
23
- }
24
2
  &.ac-button {
25
3
  padding: 8px 16px;
26
4
  font-weight: 500;
27
5
  line-height: 1;
28
6
 
29
7
  &.is-primary {
8
+ background-color: $ac-primary;
9
+ &:hover {
10
+ background-color: $primary-30;
11
+ }
30
12
  &.is-light {
31
13
  color: $ac-primary;
14
+ background-color: $primary-95;
15
+ &:hover {
16
+ background-color: $primary-90;
17
+ }
32
18
  &:focus:not(:hover) {
33
19
  color: inherit;
34
20
  }
35
21
  }
22
+ &:disabled:not(.is-light) {
23
+ background-color: $ac-primary;
24
+ border-color: $ac-primary;
25
+ }
26
+ &.is-outlined {
27
+ border-color: $ac-primary;
28
+ color: $ac-primary;
29
+ background-color: transparent;
30
+ &:hover {
31
+ border-color: $primary-30;
32
+ background-color: $ac-primary;
33
+ color: $white-100;
34
+ }
35
+ }
36
36
  }
37
37
  &.is-warning {
38
38
  &.is-light {
package/vue-components/styles/components/form-fields/_input.scss CHANGED
@@ -516,6 +516,11 @@
516
516
  border-color: $primary-30 !important;
517
517
  }
518
518
 
519
+ .switch[type="checkbox"].is-primary:checked + label::before,
520
+ .switch[type="checkbox"].is-primary:checked + label:before {
521
+ background-color: $ac-primary;
522
+ }
523
+
519
524
  .is-checkradio[type="checkbox"] + label::after,
520
525
  .is-checkradio[type="checkbox"] + label:after {
521
526
  border-width: 0.2rem;