gent_styleguide 6.0.15 → 6.0.17

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 (31) hide show
  1. package/build/css/main.css +1 -1
  2. package/build/styleguide/fonts/gent-icons-v6.eot +0 -0
  3. package/build/styleguide/fonts/gent-icons-v6.ttf +0 -0
  4. package/build/styleguide/fonts/gent-icons-v6.woff +0 -0
  5. package/build/styleguide/fonts/gent-icons-v6.woff2 +0 -0
  6. package/build/styleguide/img/svg/accolade.svg +2 -2
  7. package/build/styleguide/img/svg/build/accolade--blue.svg +2 -2
  8. package/build/styleguide/img/svg/build/accolade--cyan.svg +2 -2
  9. package/build/styleguide/img/svg/build/accolade--gray-light.svg +2 -2
  10. package/build/styleguide/img/svg/build/accolade--gray-medium.svg +2 -2
  11. package/build/styleguide/img/svg/build/accolade--gray-ultra-light.svg +2 -2
  12. package/build/styleguide/img/svg/build/accolade--gray.svg +2 -2
  13. package/build/styleguide/img/svg/build/accolade--green-light.svg +2 -2
  14. package/build/styleguide/img/svg/build/accolade--green-pastel.svg +2 -2
  15. package/build/styleguide/img/svg/build/accolade--green.svg +2 -2
  16. package/build/styleguide/img/svg/build/accolade--orange-light.svg +2 -2
  17. package/build/styleguide/img/svg/build/accolade--orange-pastel.svg +2 -2
  18. package/build/styleguide/img/svg/build/accolade--orange.svg +2 -2
  19. package/build/styleguide/img/svg/build/accolade--red-light.svg +2 -2
  20. package/build/styleguide/img/svg/build/accolade--red-pastel.svg +2 -2
  21. package/build/styleguide/img/svg/build/accolade--red.svg +2 -2
  22. package/build/styleguide/img/svg/build/accolade--white.svg +2 -2
  23. package/build/styleguide/sass/00-mixins/element-styles/_accolade.scss +1 -1
  24. package/build/styleguide/sass/00-mixins/svg/_svg-icons.scss +2 -2
  25. package/build/styleguide/sass/11-base/forms/_forms.scss +6 -0
  26. package/build/styleguide/sass/21-atoms/field-message/_field-message.scss +21 -0
  27. package/build/styleguide/sass/21-atoms/figcaption/_figcaption.scss +2 -0
  28. package/build/styleguide/sass/31-molecules/cta-block/_cta-block.scss +8 -5
  29. package/build/styleguide/sass/31-molecules/form-item/_form-item.scss +2 -1
  30. package/build/styleguide/sass/31-molecules/teaser/_teaser.scss +2 -1
  31. package/package.json +1 -1
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -1,3 +1,3 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="36" height="19" viewBox="0 0 36 19">
2
- <path fill="#23333A" fill-rule="evenodd" d="M36 18.998L0 19c4.782.006 9.37-1.992 12.755-5.555C16.14 9.882 18.045 5.047 17.95 0c.006 5.045 1.91 9.88 5.296 13.443 3.385 3.563 7.973 5.562 12.754 5.555z"/>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="51" height="19" fill="none" viewBox="0 0 51 19">
2
+ <path fill="#001823" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/>
3
3
  </svg>
@@ -14,7 +14,7 @@
14
14
  /// @param {string} $color - Text theme color.
15
15
  /// @param {string} $background-color - The background theme color.
16
16
  ///
17
- @mixin accolade($v-position: "top", $h-position: "right", $width: 50px, $height: 18px, $color: "color-zero", $background-color: "color-secondary") {
17
+ @mixin accolade($v-position: "top", $h-position: "right", $width: 51px, $height: 19px, $color: "color-zero", $background-color: "color-secondary") {
18
18
  @include theme('color', $color, 'caption-color');
19
19
  @include theme('background-color', $background-color, 'caption-background-color');
20
20
 
@@ -119,11 +119,11 @@
119
119
  }
120
120
 
121
121
  @if $icon == 'accolade' {
122
- @return '<svg xmlns="http://www.w3.org/2000/svg" width="#{$width}" height="#{$height}" viewBox="0 0 36 19"><path fill="#{$fill-color}" fill-rule="evenodd" d="M50.0702 0C31.2247 0 26.7846 7.44663 25.2657 18H24.8745C23.3559 7.44663 18.9157 0 0.0701904 0H25.0701H50.0702Z"/> </svg>';
122
+ @return '<svg xmlns="http://www.w3.org/2000/svg" width="#{$width}" height="#{$height}" viewBox="0 0 51 19"><path fill="#{$fill-color}" d="M51 1C31.8 1 27.28 8.45 25.73 19h-.4C23.79 8.45 19.27 1 .07 1V0H51v1Z"/></svg>';
123
123
  }
124
124
 
125
125
  @if $icon == 'accolade-inverse' {
126
- @return '<svg xmlns="http://www.w3.org/2000/svg" width="#{$width}" height="#{$height}" viewBox="0 0 40 18"><path fill="#{$fill-color}" fill-rule="nonzero" d="M20 0c-.219 5.005-1.73 8.973-5.115 12.536C11.505 16.093 6.797 18 2.023 18H0V0h20zm0 0h20v18h-2.023c-4.774 0-9.482-1.907-12.862-5.464C21.73 8.973 20.219 5.005 20 0z"/></svg>';
126
+ @return '<svg xmlns="http://www.w3.org/2000/svg" width="#{$width}" height="#{$height}" viewBox="0 0 51 19"><path fill="#{$fill-color}" fill-rule="nonzero" d="M.07 18c18.85 0 23.29-7.45 24.8-18h.39c1.52 10.55 5.96 18 24.8 18h-50Z"/></svg>';
127
127
  }
128
128
 
129
129
  @if $icon == 'accolade-stroke' {
@@ -366,6 +366,12 @@ $field-icon-padding: 50px;
366
366
  .form-disclaimer {
367
367
  @include theme('color', 'color-tertiary--lighten-1', 'form-disclaimer-color');
368
368
 
369
+ .highlight__inner &,
370
+ .feature-block &,
371
+ .feature-block.secondary & {
372
+ @include theme('color', 'color-zero');
373
+ }
374
+
369
375
  margin: 24px 0;
370
376
  font-size: .6rem;
371
377
  }
@@ -51,6 +51,27 @@
51
51
  right: -1px;
52
52
  width: 31px;
53
53
  }
54
+
55
+ .feature-block.secondary & {
56
+ &::before,
57
+ &::after {
58
+ @include theme('background-color', 'color-secondary', 'feature-block-secondary-background-color');
59
+ }
60
+ }
61
+
62
+ .feature-block & {
63
+ &::before,
64
+ &::after {
65
+ @include theme('background-color', 'color-primary', 'feature-block-primary-background-color');
66
+ }
67
+ }
68
+
69
+ .highlight__inner & {
70
+ &::before,
71
+ &::after {
72
+ @include theme('background-color', 'color-tertiary-light', 'highlight-background');
73
+ }
74
+ }
54
75
  }
55
76
 
56
77
  a {
@@ -8,6 +8,8 @@ figcaption {
8
8
  line-height: 175%;
9
9
 
10
10
  .full-image & {
11
+ margin: 0;
12
+
11
13
  &::before {
12
14
  display: none;
13
15
  }
@@ -73,6 +73,14 @@
73
73
  @include phablet {
74
74
  margin-bottom: 130px;
75
75
  }
76
+
77
+ .cta-block__content {
78
+ @include phablet {
79
+ top: auto;
80
+ bottom: -90px;
81
+ left: -60px;
82
+ }
83
+ }
76
84
  }
77
85
 
78
86
  &.image-left {
@@ -95,9 +103,6 @@
95
103
  padding-left: 20px;
96
104
 
97
105
  @include phablet {
98
- top: auto;
99
- bottom: -90px;
100
- left: -60px;
101
106
  padding-left: 0;
102
107
  }
103
108
  }
@@ -134,8 +139,6 @@
134
139
  padding-right: 20px;
135
140
 
136
141
  @include phablet {
137
- bottom: -90px;
138
- left: -60px;
139
142
  padding-right: 0;
140
143
  }
141
144
  }
@@ -37,7 +37,8 @@
37
37
  }
38
38
 
39
39
  &:not(.stacked) {
40
- .form-label {
40
+ .form-label,
41
+ legend {
41
42
  @include desktop {
42
43
  width: 50%;
43
44
  max-width: 410px;
@@ -314,7 +314,8 @@
314
314
  }
315
315
  }
316
316
 
317
- p {
317
+ p,
318
+ .opening-hours-accordion {
318
319
  display: none;
319
320
 
320
321
  @include tablet {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gent_styleguide",
3
- "version": "6.0.15",
3
+ "version": "6.0.17",
4
4
  "description": "Styleguide Stad.Gent",
5
5
  "devDependencies": {
6
6
  "@babel/core": "^7.20.12",