@policystudio/policy-studio-ui-vue 1.2.0-access.36 → 1.2.0-access.38

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 (32) hide show
  1. package/dist/css/psui_styles_output.css +129 -94
  2. package/doc/src/stories/Colors.mdx +3 -3
  3. package/doc/src/stories/Dropdown.stories.ts +4 -4
  4. package/doc/src/stories/Input.stories.ts +9 -9
  5. package/package.json +1 -1
  6. package/src/assets/scss/components/PsAccordion.scss +1 -1
  7. package/src/assets/scss/components/PsBadgeWithIcon.scss +1 -1
  8. package/src/assets/scss/components/PsChartLegend.scss +2 -2
  9. package/src/assets/scss/components/PsCheckbox.scss +36 -48
  10. package/src/assets/scss/components/PsChips.scss +3 -3
  11. package/src/assets/scss/components/PsClimateZoneBadge.scss +1 -1
  12. package/src/assets/scss/components/PsDraggable.scss +27 -35
  13. package/src/assets/scss/components/PsInlineSelector.scss +1 -1
  14. package/src/assets/scss/components/PsInputSelect.scss +6 -6
  15. package/src/assets/scss/components/PsInputTextArea.scss +1 -1
  16. package/src/assets/scss/components/PsRadioButton.scss +1 -1
  17. package/src/assets/scss/components/PsSlider.scss +2 -2
  18. package/src/assets/scss/components/PsTabHeader.scss +1 -1
  19. package/src/assets/scss/components/PsTagScope.scss +1 -1
  20. package/src/assets/scss/components/PsTooltip.scss +1 -1
  21. package/src/assets/scss/components/_PsTableResults.scss +1 -1
  22. package/src/assets/scss/components/table-layouts/LayoutComparison.scss +3 -3
  23. package/src/assets/scss/components/table-layouts/LayoutFlexible.scss +4 -4
  24. package/src/assets/scss/components/table-layouts/LayoutResults.scss +1 -1
  25. package/src/components/controls/PsDraggable.vue +4 -4
  26. package/src/components/datatable/PsDataTableItem.vue +1 -1
  27. package/src/components/forms/PsDropdownList.vue +1 -1
  28. package/src/components/table-results/PsTableResults.vue +10 -10
  29. package/src/components/table-results/PsTableResultsHead.vue +3 -3
  30. package/src/components/table-results/PsTableResultsHeadComparison.vue +2 -2
  31. package/src/components/table-results/PsTableResultsHeadFlexible.vue +3 -3
  32. package/src/components/tabs/PsTabHeader.vue +2 -2
package/doc/src/stories/Input.stories.ts CHANGED
@@ -100,7 +100,7 @@ const TemplateInputPassword = (args, { argTypes }) => ({
100
100
 
101
101
  <PsInput v-bind="{...$props, label: 'Resting with hint', placeholder: '', value: '', hint: 'Between 8 and 16 characters' }" >
102
102
  <template v-slot:append>
103
- <span class="material-icons-round psui-text-gray-50 psui-mr-2">
103
+ <span class="material-icons-round psui-text-gray-60 psui-mr-2">
104
104
  visibility_off
105
105
  </span>
106
106
  </template>
@@ -108,7 +108,7 @@ const TemplateInputPassword = (args, { argTypes }) => ({
108
108
 
109
109
  <PsInput label="Resting without hint" hint="Between 8 and 16 characters">
110
110
  <template v-slot:append>
111
- <span class="material-icons-round psui-text-gray-50 psui-mr-2">
111
+ <span class="material-icons-round psui-text-gray-60 psui-mr-2">
112
112
  visibility_off
113
113
  </span>
114
114
  </template>
@@ -116,7 +116,7 @@ const TemplateInputPassword = (args, { argTypes }) => ({
116
116
 
117
117
  <PsInput label="Resting with Placeholder" placeholder="This is a placeholder" hint="Between 8 and 16 characters">
118
118
  <template v-slot:append>
119
- <span class="material-icons-round psui-text-gray-50 psui-mr-2">
119
+ <span class="material-icons-round psui-text-gray-60 psui-mr-2">
120
120
  visibility_off
121
121
  </span>
122
122
  </template>
@@ -124,7 +124,7 @@ const TemplateInputPassword = (args, { argTypes }) => ({
124
124
 
125
125
  <PsInput v-bind="{...$props, label: 'Focus'}" hint="Between 8 and 16 characters">
126
126
  <template v-slot:append>
127
- <span class="material-icons-round psui-text-gray-50 psui-mr-2">
127
+ <span class="material-icons-round psui-text-gray-60 psui-mr-2">
128
128
  visibility_off
129
129
  </span>
130
130
  </template>
@@ -132,7 +132,7 @@ const TemplateInputPassword = (args, { argTypes }) => ({
132
132
 
133
133
  <PsInput v-bind="{...$props, label: 'Typing', placeholder: 'Type to see the effect...', value: '' }" hint="Between 8 and 16 characters" >
134
134
  <template v-slot:append>
135
- <span class="material-icons-round psui-text-gray-50 psui-mr-2">
135
+ <span class="material-icons-round psui-text-gray-60 psui-mr-2">
136
136
  visibility_off
137
137
  </span>
138
138
  </template>
@@ -140,7 +140,7 @@ const TemplateInputPassword = (args, { argTypes }) => ({
140
140
 
141
141
  <PsInput v-bind="{label: 'Active', active: true }" value="Password123" hint="Between 8 and 16 characters">
142
142
  <template v-slot:append>
143
- <span class="material-icons-round psui-text-gray-50 psui-mr-2">
143
+ <span class="material-icons-round psui-text-gray-60 psui-mr-2">
144
144
  visibility
145
145
  </span>
146
146
  </template>
@@ -159,7 +159,7 @@ const TemplateInputPassword = (args, { argTypes }) => ({
159
159
 
160
160
  <PsInput label="Disabled" :disabled="true" value="100,000" hint="Between 8 and 16 characters">
161
161
  <template v-slot:append>
162
- <span class="material-icons-round psui-text-gray-50 psui-mr-2">
162
+ <span class="material-icons-round psui-text-gray-60 psui-mr-2">
163
163
  visibility
164
164
  </span>
165
165
  </template>
@@ -167,7 +167,7 @@ const TemplateInputPassword = (args, { argTypes }) => ({
167
167
 
168
168
  <PsInput v-bind="{...$props, label: 'Disabled without value', disabled: true, value: '', hint: false }">
169
169
  <template v-slot:append>
170
- <span class="material-icons-round psui-text-gray-50 psui-mr-2">
170
+ <span class="material-icons-round psui-text-gray-60 psui-mr-2">
171
171
  visibility_off
172
172
  </span>
173
173
  </template>
@@ -175,7 +175,7 @@ const TemplateInputPassword = (args, { argTypes }) => ({
175
175
 
176
176
  <PsInput v-bind="{...$props, label: 'Active/Disabled', disabled: true, active: true }" hint="Between 8 and 16 characters">
177
177
  <template v-slot:append>
178
- <span class="material-icons-round psui-text-gray-50 psui-mr-2">
178
+ <span class="material-icons-round psui-text-gray-60 psui-mr-2">
179
179
  visibility_off
180
180
  </span>
181
181
  </template>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@policystudio/policy-studio-ui-vue",
3
- "version": "1.2.0-access.36",
3
+ "version": "1.2.0-access.38",
4
4
  "description": "Policy Studio UI",
5
5
  "author": "Policy Studio Team",
6
6
  "scripts": {
package/src/assets/scss/components/PsAccordion.scss CHANGED
@@ -18,7 +18,7 @@
18
18
  &.disabled {
19
19
  .psui-el-accordion-item-header {
20
20
  .psui-el-accordion-item-header-wrapper {
21
- @apply psui-text-gray-50 psui-pointer-events-none;
21
+ @apply psui-text-gray-60 psui-pointer-events-none;
22
22
 
23
23
  }
24
24
  }
package/src/assets/scss/components/PsBadgeWithIcon.scss CHANGED
@@ -4,7 +4,7 @@
4
4
  @apply psui-flex psui-items-center psui-py-1 psui-px-2 psui-rounded;
5
5
 
6
6
  &.layout-grey{
7
- @apply psui-bg-gray-10 psui-text-gray-50;
7
+ @apply psui-bg-gray-10 psui-text-gray-60;
8
8
  }
9
9
  &.layout-blue{
10
10
  @apply psui-bg-blue-20 psui-text-blue-60;
package/src/assets/scss/components/PsChartLegend.scss CHANGED
@@ -10,7 +10,7 @@
10
10
  }
11
11
 
12
12
  &-text {
13
- @apply psui-text-xsmall psui-text-gray-50 psui-font-bold;
13
+ @apply psui-text-xsmall psui-text-gray-60 psui-font-bold;
14
14
  }
15
15
 
16
16
  &-total {
@@ -18,7 +18,7 @@
18
18
  }
19
19
 
20
20
  &-percentage {
21
- @apply psui-text-gray-50 psui-text-16 psui-mt-1;
21
+ @apply psui-text-gray-60 psui-text-16 psui-mt-1;
22
22
  }
23
23
  }
24
24
 
package/src/assets/scss/components/PsCheckbox.scss CHANGED
@@ -1,107 +1,95 @@
1
1
  @layer components {
2
-
3
2
  .psui-el-checkbox {
4
- @apply psui-relative psui-text-gray-60;
5
-
3
+ @apply psui-relative psui-text-gray-60;
4
+
6
5
  &:focus {
7
- outline: none;
8
- }
6
+ @apply psui-outline-none;
7
+ }
9
8
 
10
9
  &:focus-visible {
11
- outline: 2px solid #2563EB;
12
- outline-offset: 2px;
13
- border-radius: 6px;
14
- }
10
+ @apply psui-outline psui-outline-2 psui-outline-focus-ring psui-outline-offset-2 psui-rounded-[6px];
11
+ }
15
12
 
16
13
  &.disabled {
17
14
  .psui-el-checkmark {
18
- @apply psui-cursor-default psui-text-gray-40 !important
15
+ @apply psui-cursor-default psui-text-gray-40 !important;
19
16
  }
20
17
 
21
18
  .psui-el-checkmark::before {
22
- @apply psui-text-gray-30 !important
19
+ @apply psui-text-gray-40 !important;
23
20
  }
24
21
  }
25
22
 
26
23
  &.size-small {
27
24
  @apply psui-text-14;
28
-
25
+
29
26
  &.layout-default {
30
- input:checked ~.psui-el-checkmark::before {
31
- content: 'check_box';
32
- font-family: 'Material Icons Round';
27
+ input:checked ~ .psui-el-checkmark::before {
28
+ @apply psui-content-['check\_box'] psui-font-['Material_Icons_Round'];
33
29
  }
34
30
  }
35
-
31
+
36
32
  &.layout-mixed {
37
- input:checked ~.psui-el-checkmark::before {
38
- content: 'indeterminate_check_box';
39
- font-family: 'Material Icons Round';
33
+ input:checked ~ .psui-el-checkmark::before {
34
+ @apply psui-content-['indeterminate\_check\_box'] psui-font-['Material_Icons_Round'];
40
35
  }
41
36
  }
37
+
42
38
  input {
43
39
  @apply psui-absolute psui-opacity-0 psui-h-0 psui-w-0;
44
40
 
45
41
  &:checked ~ .psui-el-checkmark::before {
46
- @apply psui-text-blue-50;
47
- font-size: 18px;
42
+ @apply psui-text-blue-60 psui-text-[18px];
48
43
  }
49
44
  }
45
+
50
46
  .psui-el-checkmark {
51
- @apply psui-flex psui-cursor-pointer psui-items-center;
52
- min-height: 18px;
47
+ @apply psui-flex psui-cursor-pointer psui-items-center psui-min-h-[18px];
53
48
 
54
49
  span {
55
- margin-left: 8px;
50
+ @apply psui-ml-[8px];
56
51
  }
57
52
 
58
53
  &::before {
59
- content:'check_box_outline_blank';
60
- @apply psui-text-gray-40;
61
- font-family:'Material Icons Round';
62
- font-size: 18px;
54
+ @apply psui-content-['check\_box\_outline\_blank'] psui-text-gray-60 psui-font-['Material_Icons_Round'] psui-text-[18px];
63
55
  }
64
- }
56
+ }
65
57
  }
66
58
 
67
59
  &.size-big {
68
60
  @apply psui-text-16;
69
61
 
70
62
  &.layout-mixed {
71
- input:checked ~.psui-el-checkmark::before {
72
- content: 'indeterminate_check_box';
73
- font-family: 'Material Icons Round';
63
+ input:checked ~ .psui-el-checkmark::before {
64
+ @apply psui-content-['indeterminate\_check\_box'] psui-font-['Material_Icons_Round'];
74
65
  }
75
66
  }
67
+
76
68
  &.layout-default {
77
- input:checked ~.psui-el-checkmark::before {
78
- content: 'check_box';
79
- font-family: 'Material Icons Round';
69
+ input:checked ~ .psui-el-checkmark::before {
70
+ @apply psui-content-['check\_box'] psui-font-['Material_Icons_Round'];
80
71
  }
81
72
  }
73
+
82
74
  input {
83
75
  @apply psui-absolute psui-opacity-0 psui-h-0 psui-w-0;
84
76
 
85
- &:checked ~ .psui-el-checkmark:before {
86
- @apply psui-text-blue-50;
87
- font-size: 24px;
77
+ &:checked ~ .psui-el-checkmark::before {
78
+ @apply psui-text-blue-60 psui-text-[24px];
88
79
  }
89
80
  }
81
+
90
82
  .psui-el-checkmark {
91
- @apply psui-flex psui-cursor-pointer psui-items-center;
92
- min-height: 24px;
93
-
83
+ @apply psui-flex psui-cursor-pointer psui-items-center psui-min-h-[24px];
84
+
94
85
  span {
95
- margin-left: 8px;
86
+ @apply psui-ml-[8px];
96
87
  }
97
88
 
98
- &:before {
99
- content:'check_box_outline_blank';
100
- @apply psui-text-gray-40 psui-align-text-bottom;
101
- font-family:'Material Icons Round';
102
- font-size: 24px;
89
+ &::before {
90
+ @apply psui-content-['check\_box\_outline\_blank'] psui-text-gray-60 psui-align-text-bottom psui-font-['Material_Icons_Round'] psui-text-[24px];
103
91
  }
104
92
  }
105
93
  }
106
94
  }
107
- }
95
+ }
package/src/assets/scss/components/PsChips.scss CHANGED
@@ -97,7 +97,7 @@
97
97
 
98
98
  .psui-el-chips-wrapper {
99
99
  &:before {
100
- @apply psui-inline-block psui-mr-1 psui-text-gray-50 psui-cursor-pointer psui-transition-all;
100
+ @apply psui-inline-block psui-mr-1 psui-text-gray-60 psui-cursor-pointer psui-transition-all;
101
101
  content: '';
102
102
  font-family: 'Material Icons Round';
103
103
  font-size: 18px;
@@ -195,7 +195,7 @@
195
195
  &.type-button {
196
196
  &.layout-with-icon {
197
197
  .psui-el-chips-wrapper {
198
- @apply psui-flex psui-items-center psui-justify-center psui-text-gray-50 psui-rounded-full;
198
+ @apply psui-flex psui-items-center psui-justify-center psui-text-gray-60 psui-rounded-full;
199
199
  padding: 6px 12px;
200
200
 
201
201
  &:hover {
@@ -216,7 +216,7 @@
216
216
  &:hover {
217
217
  &,
218
218
  .psui-el-chips-close {
219
- @apply psui-text-gray-50;
219
+ @apply psui-text-gray-60;
220
220
  }
221
221
 
222
222
  .psui-el-chips-icon-prepend {
package/src/assets/scss/components/PsClimateZoneBadge.scss CHANGED
@@ -1,6 +1,6 @@
1
1
  @layer components {
2
2
  .psui-el-climate-zone-badge {
3
- @apply psui-flex psui-bg-gray-10 psui-text-gray-50 psui-transition-all psui-duration-300 psui-ease-out psui-rounded psui-items-center;
3
+ @apply psui-flex psui-bg-gray-10 psui-text-gray-60 psui-transition-all psui-duration-300 psui-ease-out psui-rounded psui-items-center;
4
4
  width: fit-content;
5
5
  padding: 0px 6px;
6
6
 
package/src/assets/scss/components/PsDraggable.scss CHANGED
@@ -4,32 +4,27 @@
4
4
 
5
5
  .psui-el-draggable-wrapper {
6
6
  @apply psui-w-full psui-rounded-md psui-bg-gray-20 psui-p-2 psui-flex psui-items-center psui-flex-col;
7
- padding: 8px;
8
7
 
9
8
  &-title {
10
- @apply psui-w-full psui-flex psui-rounded-sm psui-items-center psui-justify-between psui-cursor-grab psui-mb-2;
11
- padding: 8px 16px;
12
-
9
+ @apply psui-w-full psui-flex psui-rounded-sm psui-items-center psui-justify-between psui-cursor-grab psui-mb-2 psui-py-2 psui-px-4;
10
+
13
11
  p {
14
12
  @apply psui-text-accentSmall psui-text-gray-80 psui-font-bold psui-uppercase;
15
- letter-spacing: 0.6px;
16
13
  }
17
-
14
+
18
15
  i {
19
- @apply psui-text-gray-40;
20
- font-size: 18px;
16
+ @apply psui-text-gray-40 psui-text-[18px];
21
17
  }
22
18
 
23
- &:hover{
19
+ &:hover {
24
20
  .psui-el-draggable-wrapper-title-icon {
25
- visibility: visible;
21
+ @apply psui-visible;
26
22
  }
27
23
  }
28
24
 
29
- &-icon{
30
- visibility: hidden;
25
+ &-icon {
26
+ @apply psui-invisible;
31
27
  }
32
-
33
28
  }
34
29
 
35
30
  &-list {
@@ -38,39 +33,39 @@
38
33
  }
39
34
 
40
35
  .psui-el-draggable-item {
41
- @apply psui-w-full psui-flex psui-rounded-sm psui-bg-white psui-items-center psui-cursor-grab psui-shadow-elevation-5;
42
- padding: 7px 16px;
36
+ @apply psui-w-full psui-flex psui-rounded-sm psui-bg-white psui-items-center psui-cursor-grab psui-shadow-elevation-5 psui-py-[7px] psui-px-4;
43
37
 
44
38
  &-title {
45
- @apply psui-text-gray-50 psui-text-14 psui-flex psui-items-center;
39
+ @apply psui-text-gray-60 psui-text-14 psui-flex psui-items-center;
46
40
 
47
41
  .psui-el-checkbox {
48
- @apply psui-text-gray-50;
42
+ @apply psui-text-gray-60;
49
43
 
50
44
  .psui-el-checkmark {
51
- &:before {
52
- @apply psui-mr-1 psui-text-gray-30;
45
+ &::before {
46
+ @apply psui-mr-1 psui-text-gray-60;
53
47
  }
54
48
  }
55
49
 
56
50
  &.active {
57
- @apply psui-text-gray-60;
51
+ @apply psui-text-gray-80;
58
52
  }
59
53
 
60
54
  &.disabled {
61
55
  .psui-el-checkmark {
62
- color: #798490 !important;
56
+ @apply !psui-text-gray-60;
63
57
  }
64
58
  }
65
59
  }
66
- &:hover{
60
+
61
+ &:hover {
67
62
  .psui-el-draggable-item-title-icon {
68
- visibility: visible;
63
+ @apply psui-visible;
69
64
  }
70
65
  }
71
66
 
72
- &-icon{
73
- visibility: hidden;
67
+ &-icon {
68
+ @apply psui-invisible;
74
69
  }
75
70
  }
76
71
 
@@ -78,19 +73,17 @@
78
73
  @apply psui-flex psui-text-gray-30 psui-ml-auto;
79
74
 
80
75
  i {
81
- font-size: 18px;
76
+ @apply psui-text-[18px];
82
77
  }
83
78
  }
84
79
 
85
80
  &:active,
86
81
  &.on-dragging {
87
- cursor: -webkit-grabbing;
88
- cursor: -moz-grabbing;
89
- cursor: grabbing;
82
+ @apply psui-cursor-grabbing;
90
83
  }
91
84
 
92
85
  &.on-drag-over {
93
- opacity: 0.2;
86
+ @apply psui-opacity-20;
94
87
  }
95
88
 
96
89
  .psui-el-checkbox.size-small {
@@ -98,13 +91,12 @@
98
91
  span {
99
92
  @apply psui-font-bold;
100
93
  }
101
- &:before {
102
- @apply psui-flex psui-items-center psui-justify-center;
103
- font-size: 24px;
104
- min-height: 24px;
94
+
95
+ &::before {
96
+ @apply psui-flex psui-items-center psui-justify-center psui-text-[24px] psui-min-h-[24px];
105
97
  }
106
98
  }
107
99
  }
108
100
  }
109
101
  }
110
- }
102
+ }
package/src/assets/scss/components/PsInlineSelector.scss CHANGED
@@ -56,7 +56,7 @@
56
56
  }
57
57
 
58
58
  p {
59
- @apply psui-text-gray-50
59
+ @apply psui-text-gray-60
60
60
  }
61
61
  }
62
62
 
package/src/assets/scss/components/PsInputSelect.scss CHANGED
@@ -16,7 +16,7 @@
16
16
 
17
17
  .psui-el-input-select-wrapper {
18
18
  &::after {
19
- @apply psui-text-gray-50 !important;
19
+ @apply psui-text-gray-60 !important;
20
20
  z-index: 100 !important;
21
21
  }
22
22
  }
@@ -35,7 +35,7 @@
35
35
  @apply psui-relative psui-w-auto;
36
36
 
37
37
  &::after {
38
- @apply psui-absolute psui-inline-block psui-text-gray-50;
38
+ @apply psui-absolute psui-inline-block psui-text-gray-60;
39
39
  content: 'arrow_drop_down';
40
40
  font-family: 'Material Icons Round';
41
41
  font-size: 24px;
@@ -74,7 +74,7 @@
74
74
  }
75
75
 
76
76
  .psui-el-input-helper {
77
- @apply psui-text-gray-50;
77
+ @apply psui-text-gray-60;
78
78
  font-size: 12px;
79
79
  line-height: 24px;
80
80
  }
@@ -85,7 +85,7 @@
85
85
  @apply psui-relative psui-w-full;
86
86
 
87
87
  &::after {
88
- @apply psui-absolute psui-inline-block psui-text-gray-50;
88
+ @apply psui-absolute psui-inline-block psui-text-gray-60;
89
89
  content: 'unfold_more';
90
90
  font-family: 'Material Icons Round';
91
91
  font-size: 18px;
@@ -102,11 +102,11 @@
102
102
 
103
103
  &:hover,
104
104
  &:active {
105
- @apply psui-border-green-20 psui-text-gray-50
105
+ @apply psui-border-green-20 psui-text-gray-60
106
106
  }
107
107
 
108
108
  &:focus {
109
- @apply psui-border-green-70 psui-text-gray-50
109
+ @apply psui-border-green-70 psui-text-gray-60
110
110
  }
111
111
 
112
112
  }
package/src/assets/scss/components/PsInputTextArea.scss CHANGED
@@ -43,7 +43,7 @@
43
43
  }
44
44
 
45
45
  .psui-el-input-textarea-message {
46
- @apply psui-text-gray-50 psui-flex psui-font-normal;
46
+ @apply psui-text-gray-60 psui-flex psui-font-normal;
47
47
  font-size: 12px;
48
48
  line-height: 24px;
49
49
  padding: 5px 0px;
package/src/assets/scss/components/PsRadioButton.scss CHANGED
@@ -1,7 +1,7 @@
1
1
  @layer components {
2
2
 
3
3
  .psui-el-radio {
4
- @apply psui-relative psui-text-gray-50 psui-flex;
4
+ @apply psui-relative psui-text-gray-60 psui-flex;
5
5
 
6
6
  &.disabled {
7
7
  .psui-el-checkmark {
package/src/assets/scss/components/PsSlider.scss CHANGED
@@ -4,7 +4,7 @@
4
4
  @apply psui-mb-2;
5
5
 
6
6
  span {
7
- @apply psui-text-gray-50 psui-text-14
7
+ @apply psui-text-gray-60 psui-text-14
8
8
  }
9
9
  }
10
10
 
@@ -56,7 +56,7 @@
56
56
  }
57
57
 
58
58
  &-bubble {
59
- @apply psui-bg-gray-20 psui-font-bold psui-text-gray-50 psui-px-2 psui-py-px psui-rounded-sm psui-float-left psui-ml-2;
59
+ @apply psui-bg-gray-20 psui-font-bold psui-text-gray-60 psui-px-2 psui-py-px psui-rounded-sm psui-float-left psui-ml-2;
60
60
  }
61
61
 
62
62
  &.layout-default {
package/src/assets/scss/components/PsTabHeader.scss CHANGED
@@ -166,7 +166,7 @@
166
166
  }
167
167
 
168
168
  button {
169
- @apply psui-bg-gray-10 psui-text-gray-50 psui-rounded-t;
169
+ @apply psui-bg-gray-10 psui-text-gray-60 psui-rounded-t;
170
170
  padding: 9px 12px;
171
171
 
172
172
  &:hover {
package/src/assets/scss/components/PsTagScope.scss CHANGED
@@ -1,6 +1,6 @@
1
1
  @layer components {
2
2
  .psui-el-tag-scope {
3
- @apply psui-flex psui-items-center psui-rounded psui-py-1 psui-pr-2 psui-h-6 psui-bg-gray-10 psui-text-gray-50;
3
+ @apply psui-flex psui-items-center psui-rounded psui-py-1 psui-pr-2 psui-h-6 psui-bg-gray-10 psui-text-gray-60;
4
4
  width: 150px;
5
5
 
6
6
  &-icon {
package/src/assets/scss/components/PsTooltip.scss CHANGED
@@ -114,7 +114,7 @@
114
114
  }
115
115
 
116
116
  .psui-el-tooltip-content-wrapper {
117
- @apply psui-text-gray-50;
117
+ @apply psui-text-gray-60;
118
118
 
119
119
  button {
120
120
  @apply psui-bg-blue-20 psui-text-blue-60;
package/src/assets/scss/components/_PsTableResults.scss CHANGED
@@ -19,7 +19,7 @@
19
19
  }
20
20
 
21
21
  .description {
22
- @apply .psui-flex .psui-flex-col .psui-text-gray-50 .psui-pl-10 .psui-text-right;
22
+ @apply .psui-flex .psui-flex-col psui-text-gray-60 .psui-pl-10 .psui-text-right;
23
23
  padding-top: 0.813rem;
24
24
  padding-bottom: 0.813rem;
25
25
  min-height: 3.5rem;
package/src/assets/scss/components/table-layouts/LayoutComparison.scss CHANGED
@@ -27,7 +27,7 @@
27
27
  }
28
28
 
29
29
  th {
30
- @apply psui-px-6 psui-py-4 psui-text-gray-50 psui-text-center psui-align-top;
30
+ @apply psui-px-6 psui-py-4 psui-text-gray-60 psui-text-center psui-align-top;
31
31
  padding-top: 0.688rem;
32
32
  padding-bottom: 0.188rem;
33
33
  min-width: 200px;
@@ -56,7 +56,7 @@
56
56
 
57
57
  &:first-of-type {
58
58
  th {
59
- @apply psui-text-left psui-text-gray-50 psui-text-16 psui-px-6;
59
+ @apply psui-text-left psui-text-gray-60 psui-text-16 psui-px-6;
60
60
  padding-top: 7px;
61
61
  padding-bottom: 7px;
62
62
 
@@ -92,7 +92,7 @@
92
92
  line-height: 18px;
93
93
 
94
94
  &.title {
95
- @apply psui-text-gray-50 psui-font-normal;
95
+ @apply psui-text-gray-60 psui-font-normal;
96
96
  }
97
97
  }
98
98
  }
package/src/assets/scss/components/table-layouts/LayoutFlexible.scss CHANGED
@@ -26,7 +26,7 @@
26
26
  @apply psui-text-right psui-w-auto psui-align-top;
27
27
 
28
28
  .description {
29
- @apply psui-text-xsmall psui-font-normal psui-text-gray-50;
29
+ @apply psui-text-xsmall psui-font-normal psui-text-gray-60;
30
30
  line-height: 110%;
31
31
  }
32
32
 
@@ -99,7 +99,7 @@
99
99
  }
100
100
 
101
101
  p:not(:first-of-type) {
102
- @apply psui-text-gray-50;
102
+ @apply psui-text-gray-60;
103
103
  }
104
104
 
105
105
  &:first-child {
@@ -157,7 +157,7 @@
157
157
  }
158
158
 
159
159
  td {
160
- @apply psui-text-gray-70 psui-h-[32px] psui-text-right psui-text-14;
160
+ @apply psui-text-gray-80 psui-h-[32px] psui-text-right psui-text-14;
161
161
 
162
162
  &.hover-color {
163
163
  background-color: #ecf7fb !important;
@@ -316,7 +316,7 @@
316
316
  padding-bottom: 9px;
317
317
 
318
318
  .title {
319
- @apply psui-text-14 psui-text-gray-50;
319
+ @apply psui-text-14 psui-text-gray-60;
320
320
  }
321
321
  }
322
322
  }
package/src/assets/scss/components/table-layouts/LayoutResults.scss CHANGED
@@ -23,7 +23,7 @@
23
23
  }
24
24
 
25
25
  th {
26
- @apply psui-pl-6 psui-text-gray-50 psui-text-right psui-w-auto psui-align-top psui-py-[13px];
26
+ @apply psui-pl-6 psui-text-gray-60 psui-text-right psui-w-auto psui-align-top psui-py-[13px];
27
27
 
28
28
  .description {
29
29
  @apply psui-text-14 psui-text-gray-60 psui-font-normal;