@ilo-org/styles 0.6.1 → 0.7.1

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 (37) hide show
  1. package/build/css/components/index.css +782 -1092
  2. package/build/css/components/index.css.map +1 -1
  3. package/build/css/global.css +1 -1
  4. package/build/css/index.css +782 -1092
  5. package/build/css/index.css.map +1 -1
  6. package/build/css/monorepo.css +782 -1092
  7. package/build/css/monorepo.css.map +1 -1
  8. package/build/minified/index.css +1 -1
  9. package/build/minified/index.css.map +1 -1
  10. package/build/minified/monorepo.css +1 -1
  11. package/build/minified/monorepo.css.map +1 -1
  12. package/css/components/card.css +1 -1
  13. package/css/components/cardgroup.css +1 -1
  14. package/css/components/herocard.css +1 -1
  15. package/css/global.css.map +1 -1
  16. package/css/index.css +1 -1
  17. package/css/index.css.map +1 -1
  18. package/css/monorepo.css +1 -1
  19. package/css/monorepo.css.map +1 -1
  20. package/package.json +1 -1
  21. package/scss/_mixins.scss +19 -20
  22. package/scss/components/_card.scss +79 -1376
  23. package/scss/components/_cardgroup.scss +66 -24
  24. package/scss/components/_datacard.scss +90 -0
  25. package/scss/components/_detailcard.scss +150 -0
  26. package/scss/components/_factlistcard.scss +110 -0
  27. package/scss/components/_featurecard.scss +218 -0
  28. package/scss/components/_herocard.scss +3 -19
  29. package/scss/components/_multilinkcard.scss +189 -0
  30. package/scss/components/_promocard.scss +157 -0
  31. package/scss/components/_statcard.scss +76 -0
  32. package/scss/components/_textcard.scss +135 -0
  33. package/scss/components/index.scss +8 -0
  34. package/css/components/experiment.css +0 -1
  35. package/css/components/formcontrol.css +0 -1
  36. package/css/components/textinput.css +0 -1
  37. package/css/components/toggle.css +0 -1
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ilo-org/styles",
3
3
  "description": "Styles for products using ILO's Design System",
4
- "version": "0.6.1",
4
+ "version": "0.7.1",
5
5
  "repository": {
6
6
  "type": "git",
7
7
  "url": "https://github.com/international-labour-organization/designsystem.git",
package/scss/_mixins.scss CHANGED
@@ -333,25 +333,24 @@
333
333
  // ======================================
334
334
  // Cornercut
335
335
  // ======================================
336
- @mixin cornercut($color: $brand-ilo-dark-blue, $height: 40px, $width: 73px) {
337
- // 1.8125x
338
- &::before {
339
- background: inherit;
340
- content: "";
341
- display: block;
342
- height: $height;
343
- position: absolute;
344
- width: calc(100% - $width);
345
- }
346
336
 
347
- &::after {
348
- @include dataurlicon("triangledecoration", $color);
349
- background-position: bottom right;
350
- background-size: cover;
351
- content: "";
352
- height: $height;
353
- display: block;
354
- position: absolute;
355
- width: $width + 0.4;
356
- }
337
+ @mixin cornercut($width: $spacing-padding-8, $height: $spacing-padding-5) {
338
+ clip-path: polygon(
339
+ 0 0,
340
+ calc(100% - $width) 0,
341
+ 100% $height,
342
+ 100% 100%,
343
+ 0 100%
344
+ );
345
+ }
346
+
347
+ // ======================================
348
+ // Dropshadow for cards
349
+ // ======================================
350
+
351
+ @mixin card-drop-shadow {
352
+ filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038))
353
+ drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054))
354
+ drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08))
355
+ drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
357
356
  }