@eeacms/volto-eea-design-system 1.0.6 → 1.0.7

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 (46) hide show
  1. package/CHANGELOG.md +59 -0
  2. package/package.json +1 -1
  3. package/src/ui/Breadcrumbs/Breadcrumb.stories.jsx +6 -34
  4. package/src/ui/Breadcrumbs/Breadcrumbs.jsx +24 -24
  5. package/src/ui/Card/Card.stories.jsx +6 -2
  6. package/src/ui/Comment/Comment.stories.js +25 -19
  7. package/src/ui/ContextNavigation/ContextNavigation.stories.jsx +18 -4
  8. package/src/ui/DownloadLabeledIcon/DownloadLabeledIcon.stories.jsx +3 -2
  9. package/src/ui/Form/Button/Button.stories.jsx +1 -1
  10. package/src/ui/Header/Header.jsx +13 -3
  11. package/src/ui/Header/Header.stories.js +112 -210
  12. package/src/ui/Header/HeaderMenuPopUp.js +50 -55
  13. package/src/ui/InpageNavigation/InpageNavigation.jsx +4 -4
  14. package/src/ui/InpageNavigation/InpageNavigation.stories.jsx +5 -4
  15. package/src/ui/Label/Label.stories.js +3 -1
  16. package/src/ui/LabeledIconGroup/LabeledIconGroup.jsx +5 -4
  17. package/src/ui/LanguageLabeledIcon/LanguageLabeledIcon.stories.jsx +3 -2
  18. package/src/ui/Modal/Modal.stories.js +9 -2
  19. package/src/ui/NewTabLabeledIcon/NewTabLabeledIcon.jsx +9 -3
  20. package/src/ui/Tag/Tag.stories.jsx +1 -1
  21. package/theme/themes/eea/assets/logo/eionet.svg +80 -11
  22. package/theme/themes/eea/collections/breadcrumb.overrides +11 -0
  23. package/theme/themes/eea/elements/button.overrides +26 -7
  24. package/theme/themes/eea/elements/button.variables +1 -0
  25. package/theme/themes/eea/elements/label.overrides +12 -8
  26. package/theme/themes/eea/extras/contextNavigation.less +4 -2
  27. package/theme/themes/eea/extras/contextNavigation.variables +1 -1
  28. package/theme/themes/eea/extras/downloadLabeledIcon.less +31 -22
  29. package/theme/themes/eea/extras/downloadLabeledIcon.variables +16 -14
  30. package/theme/themes/eea/extras/header.less +8 -0
  31. package/theme/themes/eea/extras/header.variables +4 -1
  32. package/theme/themes/eea/extras/inpageNavigation.less +2 -0
  33. package/theme/themes/eea/extras/inpageNavigation.variables +2 -0
  34. package/theme/themes/eea/extras/labeledIconGroup.variables +3 -3
  35. package/theme/themes/eea/extras/languageLabeledIcon.less +28 -20
  36. package/theme/themes/eea/extras/languageLabeledIcon.variables +18 -16
  37. package/theme/themes/eea/extras/newTabLabeledIcon.less +21 -15
  38. package/theme/themes/eea/extras/newTabLabeledIcon.variables +7 -5
  39. package/theme/themes/eea/globals/site.overrides +4 -1
  40. package/theme/themes/eea/modules/checkbox.overrides +6 -0
  41. package/theme/themes/eea/modules/checkbox.variables +3 -3
  42. package/theme/themes/eea/modules/modal.overrides +13 -0
  43. package/theme/themes/eea/modules/modal.variables +5 -1
  44. package/theme/themes/eea/views/card.overrides +9 -0
  45. package/theme/themes/eea/views/card.variables +6 -2
  46. package/theme/themes/eea/views/item.overrides +2 -2
package/theme/themes/eea/modules/checkbox.variables CHANGED
@@ -162,7 +162,7 @@
162
162
  left @sliderTransitionDuration @defaultEasing
163
163
  ;
164
164
 
165
- @toggleLaneBackground: @transparentBlack;
165
+ @toggleLaneBackground: @grey-2;
166
166
  @toggleLaneHeight: @toggleHandleSize;
167
167
  @toggleLaneBoxShadow: none;
168
168
  @toggleLaneVerticalOffset: 0rem;
@@ -174,8 +174,8 @@
174
174
  @toggleLabelOffset: 0.15em;
175
175
 
176
176
 
177
- @toggleFocusColor: @veryStrongTransparentBlack;
178
- @toggleHoverColor: @toggleFocusColor;
177
+ @toggleFocusColor: @grey-3;
178
+ @toggleHoverColor: @grey-3;
179
179
 
180
180
  @toggleOffLabelColor: @checkboxColor;
181
181
  @toggleOffHandleBoxShadow: none;
package/theme/themes/eea/modules/modal.overrides CHANGED
@@ -5,3 +5,16 @@
5
5
  .ui.modal > :last-child {
6
6
  overflow: hidden; // clear floats from modal
7
7
  }
8
+
9
+ .ui.modal .ui.button.close {
10
+ background: @closeButtonBackground;
11
+ padding: @closeButtonPadding;
12
+
13
+ i {
14
+ color: @closeColor;
15
+ }
16
+ }
17
+
18
+ .ui.modal .ui.button.close:focus-visible {
19
+ outline: @focusVisibleOutline;
20
+ }
package/theme/themes/eea/modules/modal.variables CHANGED
@@ -15,7 +15,11 @@
15
15
  /* Close Icon */
16
16
  @closeOpacity: 0.8;
17
17
  @closeSize: 1.25em;
18
- @closeColor: @black;
18
+ @closeColor: @grey-6;
19
+
20
+ /* Close Button */
21
+ @closeButtonBackground: transparent;
22
+ @closeButtonPadding: 0;
19
23
 
20
24
  @closeHitbox: 2.25rem;
21
25
  @closeDistance: 0.25rem;
package/theme/themes/eea/views/card.overrides CHANGED
@@ -446,3 +446,12 @@
446
446
  -webkit-box-orient: vertical;
447
447
  -webkit-line-clamp: var(--title-max-lines, 3);
448
448
  }
449
+
450
+ // Spacing adjustment to display outline with overflow hidden
451
+ .ui.card .header {
452
+ padding: @headerPadding;
453
+ }
454
+ .ui.card .header > a {
455
+ display: @headerLinkDisplay;
456
+ }
457
+
package/theme/themes/eea/views/card.variables CHANGED
@@ -81,11 +81,15 @@
81
81
 
82
82
 
83
83
  /* Header */
84
- @headerMargin: '';
84
+ @headerMargin: -@em-space-2 -@em-space-1 -@em-space-1 -@em-space-1;
85
85
  @headerFontWeight: @bold;
86
86
  @headerFontSize: 1.125rem;
87
- @headerLineHeightOffset: -(@lineHeight - 1em) / 2;
87
+
88
88
  @headerColor: inherit;
89
+ @headerLinkDisplay: block;
90
+
91
+ @headerPadding: @em-space-1;
92
+ @headerLineHeightOffset: -(@headerPadding * 2);
89
93
 
90
94
  /* Metadata */
91
95
  @metaJustifyContent: space-between;
package/theme/themes/eea/views/item.overrides CHANGED
@@ -208,7 +208,7 @@
208
208
  }
209
209
 
210
210
  // Flex wrapper for list of items
211
- .ui.items.flex-items-wrapper .item {
211
+ .ui.items.flex-items-wrapper > .item {
212
212
  width: @tabletFlexItemWidth;
213
213
  }
214
214
  }
@@ -237,7 +237,7 @@
237
237
  }
238
238
 
239
239
  // Flex wrapper for list of items
240
- .ui.items.flex-items-wrapper .item {
240
+ .ui.items.flex-items-wrapper > .item {
241
241
  width: @desktopFlexItemWidth;
242
242
  }
243
243
  }