@festo-ui/web-essentials 5.0.0-dev.107 → 5.0.0-dev.112

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 (23) hide show
  1. package/dist/css/festo-web-essentials.css +21 -2
  2. package/dist/css/festo-web-essentials.css.map +1 -1
  3. package/dist/css/festo-web-essentials.min.css +2 -2
  4. package/dist/css/festo-web-essentials.min.css.map +1 -1
  5. package/dist/css/organisms/festo-web-essentials-organisms.css +13 -8
  6. package/dist/css/organisms/festo-web-essentials-organisms.css.map +1 -1
  7. package/dist/css/organisms/festo-web-essentials-organisms.min.css +1 -1
  8. package/dist/css/organisms/festo-web-essentials-organisms.min.css.map +1 -1
  9. package/dist/css/themes/flatpickr/festo.css +1 -1
  10. package/dist/css/themes/flatpickr/festo.css.map +1 -1
  11. package/dist/css/themes/flatpickr/festo.min.css +1 -1
  12. package/dist/scss/_misc.scss +15 -0
  13. package/dist/scss/_root.scss +0 -1
  14. package/dist/scss/_variables.scss +0 -1
  15. package/dist/scss/festo-web-essentials.scss +2 -1
  16. package/dist/scss/organisms/_image-gallery.scss +14 -13
  17. package/dist/scss/themes/flatpickr/festo.scss +1 -1
  18. package/package.json +1 -1
  19. package/scss/_misc.scss +15 -0
  20. package/scss/_root.scss +0 -1
  21. package/scss/_variables.scss +0 -1
  22. package/scss/festo-web-essentials.scss +1 -0
  23. package/scss/organisms/_image-gallery.scss +14 -13
package/dist/scss/_root.scss CHANGED
@@ -63,7 +63,6 @@
63
63
  --fwe-control-scrollbar: #d2d5d9; // 80% * --fwe-control-dark + 20% * #FFFFFF
64
64
 
65
65
  --fwe-background: #f2f3f5;
66
- --fwe-background-image-gallery: #707070;
67
66
 
68
67
  --fwe-border: #d8dce1;
69
68
  --fwe-border-disabled: #e6e9ec; // 64% * --fwe-gray-300 + 36% * #FFFFFF
package/dist/scss/_variables.scss CHANGED
@@ -64,7 +64,6 @@ $control-border-darker: var(--fwe-control-border-darker) !default;
64
64
 
65
65
  $background: var(--fwe-background) !default;
66
66
  $background-modal: rgba(black, 0.7) !default;
67
- $background-image-gallery: var(--fwe-background-image-gallery) !default;
68
67
 
69
68
  $border: var(--fwe-border) !default;
70
69
  $border-disabled: var(--fwe-border-disabled) !default;
package/dist/scss/festo-web-essentials.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * Festo UI - Web Essentials v5.0.0-dev.107 (https://storybook.festo.design/)
2
+ * Festo UI - Web Essentials v5.0.0-dev.112 (https://storybook.festo.design/)
3
3
  * Copyright 2022 Festo SE & Co. KG
4
4
  * Licensed under Apache-2.0
5
5
  */
@@ -16,6 +16,7 @@
16
16
  @import "normalize";
17
17
  @import "utils";
18
18
 
19
+ @import "misc";
19
20
  @import "display";
20
21
  @import "spacing";
21
22
  @import "border";
package/dist/scss/organisms/_image-gallery.scss CHANGED
@@ -8,7 +8,7 @@
8
8
  max-width: unset;
9
9
  max-height: 100vh;
10
10
  overflow-x: hidden;
11
- overflow-y: auto;
11
+ overflow-y: hidden;
12
12
 
13
13
  .fwe-btn-link i.fwe-icon-menu-close.fwe-modal-image-gallery-close {
14
14
  padding-right: 0px;
@@ -40,7 +40,7 @@
40
40
  .fwe-image-gallery-container {
41
41
  display: flex;
42
42
  flex-direction: column;
43
- overflow: auto;
43
+ overflow: hidden;
44
44
  }
45
45
 
46
46
  .fwe-image-gallery-content {
@@ -59,7 +59,7 @@
59
59
  .fwe-image-gallery {
60
60
  width: 100%;
61
61
  height: 288px;
62
- background-color: $background-image-gallery;
62
+ background-color: white;
63
63
  user-select: none;
64
64
 
65
65
  svg,
@@ -92,6 +92,7 @@
92
92
  height: 64px;
93
93
  opacity: 0.33;
94
94
  transition: opacity 0.3s;
95
+ cursor: pointer;
95
96
 
96
97
  &:last-child {
97
98
  margin-right: 0px;
@@ -113,17 +114,19 @@
113
114
  object-fit: cover;
114
115
  width: 88px;
115
116
  height: 56px;
116
- background-color: $background-image-gallery;
117
+ background-color: white;
117
118
  }
118
119
 
119
120
  &.swiper-slide-thumb-active,
120
121
  &:hover {
121
122
  opacity: 1;
122
-
123
123
  &::after {
124
124
  opacity: 1;
125
125
  }
126
126
  }
127
+ &.swiper-slide-thumb-active {
128
+ cursor: default;
129
+ }
127
130
  }
128
131
  }
129
132
 
@@ -141,13 +144,14 @@
141
144
  margin-right: 8px;
142
145
  opacity: 0.33;
143
146
  transition: opacity 0.3s;
147
+ cursor: pointer;
144
148
 
145
149
  img {
146
150
  position: absolute;
147
151
  height: 56px;
148
152
  width: 88px;
149
153
  min-width: 88px;
150
- background: $background-image-gallery;
154
+ background: white;
151
155
  object-fit: cover;
152
156
  }
153
157
 
@@ -169,11 +173,14 @@
169
173
  &.fwe-active,
170
174
  &:hover {
171
175
  opacity: 1;
172
-
173
176
  &::after {
174
177
  opacity: 1;
175
178
  }
176
179
  }
180
+
181
+ &.fwe-active {
182
+ cursor: default;
183
+ }
177
184
  }
178
185
  }
179
186
 
@@ -225,12 +232,6 @@
225
232
  margin-top: none;
226
233
  }
227
234
  }
228
-
229
- &--with-thumbnails {
230
- .fwe-image-gallery-wrapper {
231
- width: 984px;
232
- }
233
- }
234
235
  }
235
236
 
236
237
  .fwe-image-gallery,
package/dist/scss/themes/flatpickr/festo.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * Festo UI - Web Essentials v5.0.0-dev.107 (https://storybook.festo.design/)
2
+ * Festo UI - Web Essentials v5.0.0-dev.112 (https://storybook.festo.design/)
3
3
  * Copyright 2022 Festo SE & Co. KG
4
4
  * Licensed under Apache-2.0
5
5
  */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@festo-ui/web-essentials",
3
- "version": "5.0.0-dev.107",
3
+ "version": "5.0.0-dev.112",
4
4
  "description": "CSS framework and utils to build FESTO web applications",
5
5
  "keywords": [
6
6
  "css",
package/scss/_misc.scss ADDED
@@ -0,0 +1,15 @@
1
+ .fwe-object-fit-contain {
2
+ object-fit: contain !important;
3
+ }
4
+
5
+ .fwe-object-fit-cover {
6
+ object-fit: cover !important;
7
+ }
8
+
9
+ .fwe-object-fit-fill {
10
+ object-fit: fill !important;
11
+ }
12
+
13
+ .fwe-object-fit-scale-down {
14
+ object-fit: scale-down !important;
15
+ }
package/scss/_root.scss CHANGED
@@ -63,7 +63,6 @@
63
63
  --fwe-control-scrollbar: #d2d5d9; // 80% * --fwe-control-dark + 20% * #FFFFFF
64
64
 
65
65
  --fwe-background: #f2f3f5;
66
- --fwe-background-image-gallery: #707070;
67
66
 
68
67
  --fwe-border: #d8dce1;
69
68
  --fwe-border-disabled: #e6e9ec; // 64% * --fwe-gray-300 + 36% * #FFFFFF
package/scss/_variables.scss CHANGED
@@ -64,7 +64,6 @@ $control-border-darker: var(--fwe-control-border-darker) !default;
64
64
 
65
65
  $background: var(--fwe-background) !default;
66
66
  $background-modal: rgba(black, 0.7) !default;
67
- $background-image-gallery: var(--fwe-background-image-gallery) !default;
68
67
 
69
68
  $border: var(--fwe-border) !default;
70
69
  $border-disabled: var(--fwe-border-disabled) !default;
package/scss/festo-web-essentials.scss CHANGED
@@ -16,6 +16,7 @@
16
16
  @import "normalize";
17
17
  @import "utils";
18
18
 
19
+ @import "misc";
19
20
  @import "display";
20
21
  @import "spacing";
21
22
  @import "border";
package/scss/organisms/_image-gallery.scss CHANGED
@@ -8,7 +8,7 @@
8
8
  max-width: unset;
9
9
  max-height: 100vh;
10
10
  overflow-x: hidden;
11
- overflow-y: auto;
11
+ overflow-y: hidden;
12
12
 
13
13
  .fwe-btn-link i.fwe-icon-menu-close.fwe-modal-image-gallery-close {
14
14
  padding-right: 0px;
@@ -40,7 +40,7 @@
40
40
  .fwe-image-gallery-container {
41
41
  display: flex;
42
42
  flex-direction: column;
43
- overflow: auto;
43
+ overflow: hidden;
44
44
  }
45
45
 
46
46
  .fwe-image-gallery-content {
@@ -59,7 +59,7 @@
59
59
  .fwe-image-gallery {
60
60
  width: 100%;
61
61
  height: 288px;
62
- background-color: $background-image-gallery;
62
+ background-color: white;
63
63
  user-select: none;
64
64
 
65
65
  svg,
@@ -92,6 +92,7 @@
92
92
  height: 64px;
93
93
  opacity: 0.33;
94
94
  transition: opacity 0.3s;
95
+ cursor: pointer;
95
96
 
96
97
  &:last-child {
97
98
  margin-right: 0px;
@@ -113,17 +114,19 @@
113
114
  object-fit: cover;
114
115
  width: 88px;
115
116
  height: 56px;
116
- background-color: $background-image-gallery;
117
+ background-color: white;
117
118
  }
118
119
 
119
120
  &.swiper-slide-thumb-active,
120
121
  &:hover {
121
122
  opacity: 1;
122
-
123
123
  &::after {
124
124
  opacity: 1;
125
125
  }
126
126
  }
127
+ &.swiper-slide-thumb-active {
128
+ cursor: default;
129
+ }
127
130
  }
128
131
  }
129
132
 
@@ -141,13 +144,14 @@
141
144
  margin-right: 8px;
142
145
  opacity: 0.33;
143
146
  transition: opacity 0.3s;
147
+ cursor: pointer;
144
148
 
145
149
  img {
146
150
  position: absolute;
147
151
  height: 56px;
148
152
  width: 88px;
149
153
  min-width: 88px;
150
- background: $background-image-gallery;
154
+ background: white;
151
155
  object-fit: cover;
152
156
  }
153
157
 
@@ -169,11 +173,14 @@
169
173
  &.fwe-active,
170
174
  &:hover {
171
175
  opacity: 1;
172
-
173
176
  &::after {
174
177
  opacity: 1;
175
178
  }
176
179
  }
180
+
181
+ &.fwe-active {
182
+ cursor: default;
183
+ }
177
184
  }
178
185
  }
179
186
 
@@ -225,12 +232,6 @@
225
232
  margin-top: none;
226
233
  }
227
234
  }
228
-
229
- &--with-thumbnails {
230
- .fwe-image-gallery-wrapper {
231
- width: 984px;
232
- }
233
- }
234
235
  }
235
236
 
236
237
  .fwe-image-gallery,