@madj2k/fe-frontend-kit 2.0.21 → 2.0.22

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@madj2k/fe-frontend-kit",
3
- "version": "2.0.21",
3
+ "version": "2.0.22",
4
4
  "description": "Shared frontend utilities, menus and mixins for projects",
5
5
  "main": "index.js",
6
6
  "style": "index.scss",
@@ -19,11 +19,13 @@
19
19
  /// @group Typography
20
20
  /// @param {Map} $font-formats - A map of font style definitions. Defaults to the global `$font-formats` map.
21
21
  /// @param {String} $font-format - The key name of the format to apply (e.g., 'h1', 'copy-small').
22
+ /// @param {String} $tablet-breakpoint - The breakpoint name for tablet styles (default: lg).
23
+ /// @param {String} $desktop-breakpoint - The breakpoint name for desktop styles (default: xl).
22
24
  ///
23
25
  /// @author Steffen Kroggel <developer@steffenkroggel>
24
26
  /// @license GNU General Public License v3.0 https://www.gnu.org/licenses/gpl-3.0.en.html
25
27
  ///
26
- @mixin font-format($font-formats, $font-format: 'h1') {
28
+ @mixin font-format($font-formats, $font-format: 'h1', $tablet-breakpoint: lg, $desktop-breakpoint: xl) {
27
29
  $format-data: map-get($font-formats, $font-format);
28
30
  $mobile-data: map-get($format-data, 'mobile');
29
31
  $default-data: map-get($format-data, 'default');
@@ -38,7 +40,7 @@
38
40
  }
39
41
 
40
42
  @if map-has-key($format-data, 'tablet') {
41
- @include media-breakpoint-up(lg) {
43
+ @include media-breakpoint-up($tablet-breakpoint) {
42
44
  @each $key in $keys {
43
45
  #{$key}: map-get(map-get($format-data, 'tablet'), $key);
44
46
  }
@@ -46,12 +48,23 @@
46
48
  }
47
49
 
48
50
  @if map-has-key($format-data, 'desktop') {
49
- @include media-breakpoint-up(xl) {
51
+ @include media-breakpoint-up($desktop-breakpoint) {
50
52
  @each $key in $keys {
51
53
  #{$key}: map-get(map-get($format-data, 'desktop'), $key);
52
54
  }
53
55
  }
54
56
  }
57
+
58
+ // dynamic breakpoints (but not mobile, default, tablet, desktop)
59
+ @each $variant, $values in $format-data {
60
+ @if not index(('mobile', 'default', 'tablet', 'desktop'), $variant) {
61
+ @include media-breakpoint-up($variant) {
62
+ @each $key in $keys {
63
+ #{$key}: map-get($values, $key);
64
+ }
65
+ }
66
+ }
67
+ }
55
68
  }
56
69
 
57
70
  /// Enables word breaking and hyphenation for improved long text handling.
@@ -144,7 +144,7 @@
144
144
 
145
145
  /** addition class for usage with position:absolute */
146
146
  #{$wrap-class}-padding {
147
- @include page-padding-only($default-padding);
147
+ @include page-padding-only($padding-x);
148
148
  }
149
149
  }
150
150