Skip to content

Commit 8bf5be5

Browse files
gcornutgcornut
authored
Merge pull request #747 from lumapps/revert/soften-dark-icon
Revert: soften dark text color on various components
2 parents b2200ca + e4e589f commit 8bf5be5

File tree

29 files changed

+173
-291
lines changed

29 files changed

+173
-291
lines changed

‎CHANGELOG.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
77

88
## [Unreleased]
99

10+
## [2.1.8][] - 2021-12-10
11+
12+
### Fixed
13+
14+
- Reverted soften dark color on icons that caused issues.
15+
1016
## [2.1.7][] - 2021-12-08
1117

1218
### Fixed
@@ -1208,3 +1214,5 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
12081214
[2.1.6]: https://github.com/lumapps/design-system/tree/v2.1.6
12091215
[unreleased]: https://github.com/lumapps/design-system/compare/v2.1.7...HEAD
12101216
[2.1.7]: https://github.com/lumapps/design-system/tree/v2.1.7
1217+
[unreleased]: https://github.com/lumapps/design-system/compare/v2.1.8...HEAD
1218+
[2.1.8]: https://github.com/lumapps/design-system/tree/v2.1.8

‎lerna.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
"message": "chore(release): release %s"
1111
}
1212
},
13-
"version": "2.1.7",
13+
"version": "2.1.8",
1414
"useWorkspaces": true,
1515
"npmClient": "yarn"
1616
}

‎packages/lumx-angularjs/package.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@
66
"url": "https://github.com/lumapps/design-system/issues"
77
},
88
"dependencies": {
9-
"@lumx/core": "^2.1.7",
10-
"@lumx/icons": "^2.1.7",
9+
"@lumx/core": "^2.1.8",
10+
"@lumx/icons": "^2.1.8",
1111
"focus-visible": "^5.0.2",
1212
"lodash": "4.17.21",
1313
"popper.js": "^1.16.0"
@@ -40,7 +40,7 @@
4040
"prepare": "install-peers || exit 0",
4141
"prepublishOnly": "yarn build"
4242
},
43-
"version": "2.1.7",
43+
"version": "2.1.8",
4444
"devDependencies": {
4545
"@babel/core": "^7.8.3",
4646
"@babel/plugin-proposal-class-properties": "^7.8.3",

‎packages/lumx-core/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@
4242
"version": "yarn version-changelog ../../CHANGELOG.md && yarn changelog-verify ../../CHANGELOG.md && git add ../../CHANGELOG.md"
4343
},
4444
"sideEffects": false,
45-
"version": "2.1.7",
45+
"version": "2.1.8",
4646
"devDependencies": {
4747
"@babel/core": "^7.8.3",
4848
"@babel/plugin-proposal-class-properties": "^7.8.3",

‎packages/lumx-core/src/css/design-tokens.css

Lines changed: 27 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/**
22
* Do not edit directly
3-
* Generated on Tue, 30 Nov 2021 09:20:09 GMT
3+
* Generated on Tue, 19 Oct 2021 08:35:24 GMT
44
*/
55

66
:root {
@@ -48,12 +48,7 @@
4848
0,
4949
0.12
5050
); /* Base dark color with 12% opacity */
51-
--lumx-button-emphasis-medium-state-default-theme-light-color: rgba(
52-
0,
53-
0,
54-
0,
55-
0.7
56-
); /* Base dark color with 70% opacity */
51+
--lumx-button-emphasis-medium-state-default-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
5752
--lumx-button-emphasis-medium-state-default-theme-light-border-color: transparent;
5853
--lumx-button-emphasis-medium-state-default-theme-dark-background-color: rgba(
5954
255,
@@ -71,12 +66,7 @@
7166
0,
7267
0.2
7368
); /* Base dark color with 20% opacity */
74-
--lumx-button-emphasis-medium-state-hover-theme-light-color: rgba(
75-
0,
76-
0,
77-
0,
78-
0.7
79-
); /* Base dark color with 70% opacity */
69+
--lumx-button-emphasis-medium-state-hover-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
8070
--lumx-button-emphasis-medium-state-hover-theme-light-border-color: transparent;
8171
--lumx-button-emphasis-medium-state-hover-theme-dark-background-color: rgba(
8272
255,
@@ -94,12 +84,7 @@
9484
0,
9585
0.38
9686
); /* Base dark color with 38% opacity */
97-
--lumx-button-emphasis-medium-state-active-theme-light-color: rgba(
98-
0,
99-
0,
100-
0,
101-
0.7
102-
); /* Base dark color with 70% opacity */
87+
--lumx-button-emphasis-medium-state-active-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
10388
--lumx-button-emphasis-medium-state-active-theme-light-border-color: transparent;
10489
--lumx-button-emphasis-medium-state-active-theme-dark-background-color: rgba(
10590
255,
@@ -112,12 +97,7 @@
11297
--lumx-button-emphasis-low-state-default-padding-horizontal: 8px;
11398
--lumx-button-emphasis-low-state-default-border-width: 0;
11499
--lumx-button-emphasis-low-state-default-theme-light-background-color: transparent;
115-
--lumx-button-emphasis-low-state-default-theme-light-color: rgba(
116-
0,
117-
0,
118-
0,
119-
0.7
120-
); /* Base dark color with 70% opacity */
100+
--lumx-button-emphasis-low-state-default-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
121101
--lumx-button-emphasis-low-state-default-theme-light-border-color: transparent;
122102
--lumx-button-emphasis-low-state-default-theme-dark-background-color: transparent;
123103
--lumx-button-emphasis-low-state-default-theme-dark-color: #fff; /* Neutral light color */
@@ -130,7 +110,7 @@
130110
0,
131111
0.12
132112
); /* Base dark color with 12% opacity */
133-
--lumx-button-emphasis-low-state-hover-theme-light-color: rgba(0, 0, 0, 0.7); /* Base dark color with 70% opacity */
113+
--lumx-button-emphasis-low-state-hover-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
134114
--lumx-button-emphasis-low-state-hover-theme-light-border-color: transparent;
135115
--lumx-button-emphasis-low-state-hover-theme-dark-background-color: rgba(
136116
255,
@@ -148,12 +128,7 @@
148128
0,
149129
0.2
150130
); /* Base dark color with 20% opacity */
151-
--lumx-button-emphasis-low-state-active-theme-light-color: rgba(
152-
0,
153-
0,
154-
0,
155-
0.7
156-
); /* Base dark color with 70% opacity */
131+
--lumx-button-emphasis-low-state-active-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
157132
--lumx-button-emphasis-low-state-active-theme-light-border-color: transparent;
158133
--lumx-button-emphasis-low-state-active-theme-dark-background-color: rgba(
159134
255,
@@ -255,8 +230,8 @@
255230
0,
256231
0,
257232
0,
258-
0.7
259-
); /* Base dark color with 70% opacity */
233+
0.87
234+
); /* Neutral dark color */
260235
--lumx-navigation-item-emphasis-low-state-default-theme-light-label-color: rgba(
261236
0,
262237
0,
@@ -268,8 +243,8 @@
268243
0,
269244
0,
270245
0,
271-
0.7
272-
); /* Base dark color with 70% opacity */
246+
0.87
247+
); /* Neutral dark color */
273248
--lumx-navigation-item-emphasis-low-state-default-theme-dark-background-color: transparent;
274249
--lumx-navigation-item-emphasis-low-state-default-theme-dark-border-color: rgba(
275250
255,
@@ -301,8 +276,8 @@
301276
0,
302277
0,
303278
0,
304-
0.7
305-
); /* Base dark color with 70% opacity */
279+
0.87
280+
); /* Neutral dark color */
306281
--lumx-navigation-item-emphasis-low-state-hover-theme-light-label-color: rgba(
307282
0,
308283
0,
@@ -319,8 +294,8 @@
319294
0,
320295
0,
321296
0,
322-
0.7
323-
); /* Base dark color with 70% opacity */
297+
0.87
298+
); /* Neutral dark color */
324299
--lumx-navigation-item-emphasis-low-state-hover-theme-dark-background-color: rgba(
325300
255,
326301
255,
@@ -362,8 +337,8 @@
362337
0,
363338
0,
364339
0,
365-
0.7
366-
); /* Base dark color with 70% opacity */
340+
0.87
341+
); /* Neutral dark color */
367342
--lumx-navigation-item-emphasis-low-state-active-theme-light-label-color: rgba(
368343
0,
369344
0,
@@ -380,8 +355,8 @@
380355
0,
381356
0,
382357
0,
383-
0.7
384-
); /* Base dark color with 70% opacity */
358+
0.87
359+
); /* Neutral dark color */
385360
--lumx-navigation-item-emphasis-low-state-active-theme-dark-background-color: rgba(
386361
255,
387362
255,
@@ -502,12 +477,7 @@
502477
--lumx-tabs-link-emphasis-low-state-default-border-bottom-width: 2px;
503478
--lumx-tabs-link-emphasis-low-state-default-border-left-width: 0;
504479
--lumx-tabs-link-emphasis-low-state-default-theme-light-background-color: transparent;
505-
--lumx-tabs-link-emphasis-low-state-default-theme-light-color: rgba(
506-
0,
507-
0,
508-
0,
509-
0.7
510-
); /* Base dark color with 70% opacity */
480+
--lumx-tabs-link-emphasis-low-state-default-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
511481
--lumx-tabs-link-emphasis-low-state-default-theme-light-border-color: rgba(
512482
0,
513483
0,
@@ -532,12 +502,7 @@
532502
0,
533503
0.12
534504
); /* Base dark color with 12% opacity */
535-
--lumx-tabs-link-emphasis-low-state-hover-theme-light-color: rgba(
536-
0,
537-
0,
538-
0,
539-
0.7
540-
); /* Base dark color with 70% opacity */
505+
--lumx-tabs-link-emphasis-low-state-hover-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
541506
--lumx-tabs-link-emphasis-low-state-hover-theme-light-border-color: rgba(
542507
0,
543508
0,
@@ -567,12 +532,7 @@
567532
0,
568533
0.2
569534
); /* Base dark color with 20% opacity */
570-
--lumx-tabs-link-emphasis-low-state-active-theme-light-color: rgba(
571-
0,
572-
0,
573-
0,
574-
0.7
575-
); /* Base dark color with 70% opacity */
535+
--lumx-tabs-link-emphasis-low-state-active-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
576536
--lumx-tabs-link-emphasis-low-state-active-theme-light-border-color: rgba(
577537
0,
578538
0,
@@ -597,12 +557,7 @@
597557
--lumx-tabs-link-emphasis-selected-state-default-border-bottom-width: 2px;
598558
--lumx-tabs-link-emphasis-selected-state-default-border-left-width: 0;
599559
--lumx-tabs-link-emphasis-selected-state-default-theme-light-background-color: transparent;
600-
--lumx-tabs-link-emphasis-selected-state-default-theme-light-color: rgba(
601-
0,
602-
0,
603-
0,
604-
0.7
605-
); /* Base dark color with 70% opacity */
560+
--lumx-tabs-link-emphasis-selected-state-default-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
606561
--lumx-tabs-link-emphasis-selected-state-default-theme-light-border-color: var(--lumx-color-primary-N);
607562
--lumx-tabs-link-emphasis-selected-state-default-theme-dark-background-color: transparent;
608563
--lumx-tabs-link-emphasis-selected-state-default-theme-dark-color: #fff; /* Neutral light color */
@@ -617,12 +572,7 @@
617572
0,
618573
0.12
619574
); /* Base dark color with 12% opacity */
620-
--lumx-tabs-link-emphasis-selected-state-hover-theme-light-color: rgba(
621-
0,
622-
0,
623-
0,
624-
0.7
625-
); /* Base dark color with 70% opacity */
575+
--lumx-tabs-link-emphasis-selected-state-hover-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
626576
--lumx-tabs-link-emphasis-selected-state-hover-theme-light-border-color: var(--lumx-color-primary-N);
627577
--lumx-tabs-link-emphasis-selected-state-hover-theme-dark-background-color: rgba(
628578
255,
@@ -642,12 +592,7 @@
642592
0,
643593
0.2
644594
); /* Base dark color with 20% opacity */
645-
--lumx-tabs-link-emphasis-selected-state-active-theme-light-color: rgba(
646-
0,
647-
0,
648-
0,
649-
0.7
650-
); /* Base dark color with 70% opacity */
595+
--lumx-tabs-link-emphasis-selected-state-active-theme-light-color: rgba(0, 0, 0, 0.87); /* Neutral dark color */
651596
--lumx-tabs-link-emphasis-selected-state-active-theme-light-border-color: var(--lumx-color-primary-N);
652597
--lumx-tabs-link-emphasis-selected-state-active-theme-dark-background-color: rgba(
653598
255,
@@ -782,7 +727,7 @@
782727
); /* Base light color with 80% opacity */
783728
--lumx-border-radius: 4px;
784729
--lumx-color-dark-N: rgba(0, 0, 0, 0.87); /* Neutral dark color */
785-
--lumx-color-dark-L1: rgba(0, 0, 0, 0.7); /* Base dark color with 70% opacity */
730+
--lumx-color-dark-L1: rgba(0, 0, 0, 0.8); /* Base dark color with 80% opacity */
786731
--lumx-color-dark-L2: rgba(0, 0, 0, 0.54); /* Base dark color with 54% opacity */
787732
--lumx-color-dark-L3: rgba(0, 0, 0, 0.38); /* Base dark color with 38% opacity */
788733
--lumx-color-dark-L4: rgba(0, 0, 0, 0.2); /* Base dark color with 20% opacity */
@@ -866,7 +811,7 @@
866811
--lumx-color-accent-L5: rgba(76, 175, 80, 0.1); /* Base green color with 10% opacity */
867812
--lumx-color-accent-L6: rgba(76, 175, 80, 0.05); /* Base green color with 5% opacity */
868813
--lumx-color-black-N: rgba(0, 0, 0, 0.87); /* Neutral dark color */
869-
--lumx-color-black-L1: rgba(0, 0, 0, 0.7); /* Base dark color with 70% opacity */
814+
--lumx-color-black-L1: rgba(0, 0, 0, 0.8); /* Base dark color with 80% opacity */
870815
--lumx-color-black-L2: rgba(0, 0, 0, 0.54); /* Base dark color with 54% opacity */
871816
--lumx-color-black-L3: rgba(0, 0, 0, 0.38); /* Base dark color with 38% opacity */
872817
--lumx-color-black-L4: rgba(0, 0, 0, 0.2); /* Base dark color with 20% opacity */

0 commit comments

Comments
 (0)