@total_onion/onion-library 1.0.86 → 1.0.88

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.
@@ -319,65 +319,6 @@
319
319
  "acfe_layout_col": "auto",
320
320
  "acfe_layout_allowed_col": false
321
321
  },
322
- "layout_66aba9299e9f8": {
323
- "key": "layout_66aba9299e9f8",
324
- "name": "accordion_v3",
325
- "label": "Accordion v3",
326
- "display": "block",
327
- "sub_fields": [
328
- {
329
- "key": "field_layout_66aba9299e9f8_title",
330
- "label": "",
331
- "name": "acfe_flexible_layout_title",
332
- "aria-label": "",
333
- "type": "text",
334
- "instructions": "",
335
- "required": false,
336
- "conditional_logic": false,
337
- "wrapper": {
338
- "width": "",
339
- "class": "",
340
- "id": ""
341
- },
342
- "maxlength": false,
343
- "default_value": "Accordion v3",
344
- "placeholder": "Accordion v3",
345
- "prepend": "",
346
- "append": "",
347
- "wpml_cf_preferences": 2
348
- },
349
- {
350
- "key": "field_layout_66aba9299e9f8_toggle",
351
- "label": "",
352
- "name": "acfe_flexible_toggle",
353
- "aria-label": "",
354
- "type": "acfe_hidden",
355
- "instructions": "",
356
- "required": false,
357
- "conditional_logic": false,
358
- "wrapper": {
359
- "width": "",
360
- "class": "",
361
- "id": ""
362
- },
363
- "default_value": false,
364
- "wpml_cf_preferences": 2
365
- }
366
- ],
367
- "min": "",
368
- "max": "",
369
- "acfe_flexible_render_template": false,
370
- "acfe_flexible_render_style": false,
371
- "acfe_flexible_render_script": false,
372
- "acfe_flexible_thumbnail": false,
373
- "acfe_flexible_settings": false,
374
- "acfe_flexible_settings_size": "medium",
375
- "acfe_layout_locations": [],
376
- "acfe_flexible_modal_edit_size": false,
377
- "acfe_flexible_category": false,
378
- "acfe_layout_col": "auto",
379
- "acfe_layout_allowed_col": false
380
- },
381
322
  "layout_68722d588e103": {
382
323
  "key": "layout_68722d588e103",
383
324
  "name": "video_trigger_button_v3",
@@ -456,5 +397,5 @@
456
397
  "acfe_display_title": "",
457
398
  "acfe_meta": "",
458
399
  "acfe_note": "",
459
- "modified": 1753351964
400
+ "modified": 1753551510
460
401
  }
@@ -2,6 +2,13 @@
2
2
  @use 'Assets/scss/modules/library-modules/core-root-variables-v3/core-root-variables-v3';
3
3
  @use 'Assets/scss/modules/library-modules/core-css-sizing-vars-v3/core-css-sizing-vars-v3';
4
4
  @use 'Assets/scss/modules/library-modules/core-typography-v3/core-typography-v3';
5
- @use 'Assets/scss/modules/library-modules/core-generic-v3/core-generic-v3';
6
5
  @use 'Assets/scss/modules/library-modules/core-css-modules-v3/core-css-modules-v3';
7
- @include core-typography-v3.core-typography-v3();
6
+ @use 'Assets/scss/modules/library-modules/core-generic-v3/core-generic-v3';
7
+
8
+ @mixin coreCriticalV3() {
9
+ @include core-root-variables-v3.coreRootVariablesV3();
10
+ @include core-css-sizing-vars-v3.coreCssSizingVarsV3();
11
+ @include core-typography-v3.coreTypographyV3();
12
+ @include core-css-modules-v3.coreCssModulesV3();
13
+ @include core-generic-v3.coreGenericV3();
14
+ }
@@ -4,9 +4,10 @@
4
4
  @use 'Assets/scss/modules/library-modules/block-settings/block-settings';
5
5
  @use 'Assets/scss/modules/library-modules/social-networks/social-networks';
6
6
  @use 'Assets/scss/modules/library-modules/core-cta/core-cta';
7
-
8
- @include block-padding.blockPadding();
9
- @include social-networks.socialNetworks();
10
- @include animations.animations();
11
- @include block-settings.blockSettings();
12
- @include core-cta.core-cta();
7
+ @mixin coreCssModulesV3() {
8
+ @include block-padding.blockPadding();
9
+ @include social-networks.socialNetworks();
10
+ @include animations.animations();
11
+ @include block-settings.blockSettings();
12
+ @include core-cta.core-cta();
13
+ }
@@ -2,96 +2,97 @@
2
2
  @use 'Assets/scss/theme/breakpoints';
3
3
  @use 'Assets/scss/modules/library-modules/core-mixins-v3/core-mixins-v3';
4
4
  @use 'Assets/scss/modules/library-modules/core-functions-v3/core-functions-v3';
5
-
6
- body {
7
- --screen-width: var(--screen-width-mobile);
8
- --font-reference: var(--font-reference-mobile);
9
- --design-reference: var(--mobile-design-reference);
10
- @include core-mixins-v3.device(breakpoints.$tabPortrait) {
11
- --screen-width: var(--screen-width-portrait);
12
- --font-reference: var(--font-reference-portrait);
13
- --design-reference: var(--portrait-design-reference);
14
- }
15
- @include core-mixins-v3.device(breakpoints.$tabLandscape) {
16
- --screen-width: var(--screen-width-landscape);
17
- --font-reference: var(--font-reference-landscape);
18
- --design-reference: var(--landscape-design-reference);
19
- }
20
- @include core-mixins-v3.device(breakpoints.$desktop) {
21
- --screen-width: var(--screen-width-desktop);
22
- --font-reference: var(--font-reference-desktop);
23
- --design-reference: var(--desktop-design-reference);
5
+ @mixin coreCssSizingVarsV3() {
6
+ body {
7
+ --screen-width: var(--screen-width-mobile);
8
+ --font-reference: var(--font-reference-mobile);
9
+ --design-reference: var(--mobile-design-reference);
10
+ @include core-mixins-v3.device(breakpoints.$tabPortrait) {
11
+ --screen-width: var(--screen-width-portrait);
12
+ --font-reference: var(--font-reference-portrait);
13
+ --design-reference: var(--portrait-design-reference);
14
+ }
15
+ @include core-mixins-v3.device(breakpoints.$tabLandscape) {
16
+ --screen-width: var(--screen-width-landscape);
17
+ --font-reference: var(--font-reference-landscape);
18
+ --design-reference: var(--landscape-design-reference);
19
+ }
20
+ @include core-mixins-v3.device(breakpoints.$desktop) {
21
+ --screen-width: var(--screen-width-desktop);
22
+ --font-reference: var(--font-reference-desktop);
23
+ --design-reference: var(--desktop-design-reference);
24
+ }
25
+ @include core-mixins-v3.device(breakpoints.$desktop-fullhd) {
26
+ --screen-width: var(--screen-width-fullhd);
27
+ --font-reference: var(--font-reference-fullhd);
28
+ --design-reference: var(--fullhd-design-reference);
29
+ }
24
30
  }
25
- @include core-mixins-v3.device(breakpoints.$desktop-fullhd) {
26
- --screen-width: var(--screen-width-fullhd);
27
- --font-reference: var(--font-reference-fullhd);
28
- --design-reference: var(--fullhd-design-reference);
29
- }
30
- }
31
- body {
32
- --global-inline-spacing: #{core-functions-v3.fluidSize(
33
- var(--mobile-inline),
34
- 'mobile'
35
- )};
36
-
37
- @include core-mixins-v3.device(breakpoints.$tabPortrait) {
31
+ body {
38
32
  --global-inline-spacing: #{core-functions-v3.fluidSize(
39
- var(--portrait-inline),
40
- 'portrait'
33
+ var(--mobile-inline),
34
+ 'mobile'
41
35
  )};
42
- }
43
36
 
44
- @include core-mixins-v3.device(breakpoints.$tabLandscape) {
45
- --global-inline-spacing: #{core-functions-v3.fluidSize(
46
- var(--landscape-inline),
47
- 'landscape'
48
- )};
49
- }
37
+ @include core-mixins-v3.device(breakpoints.$tabPortrait) {
38
+ --global-inline-spacing: #{core-functions-v3.fluidSize(
39
+ var(--portrait-inline),
40
+ 'portrait'
41
+ )};
42
+ }
50
43
 
51
- @include core-mixins-v3.device(breakpoints.$desktop) {
52
- --global-inline-spacing: #{core-functions-v3.fluidSize(
53
- var(--desktop-inline),
54
- 'desktop'
55
- )};
44
+ @include core-mixins-v3.device(breakpoints.$tabLandscape) {
45
+ --global-inline-spacing: #{core-functions-v3.fluidSize(
46
+ var(--landscape-inline),
47
+ 'landscape'
48
+ )};
49
+ }
50
+
51
+ @include core-mixins-v3.device(breakpoints.$desktop) {
52
+ --global-inline-spacing: #{core-functions-v3.fluidSize(
53
+ var(--desktop-inline),
54
+ 'desktop'
55
+ )};
56
+ }
56
57
  }
57
- }
58
58
 
59
- body {
60
- --heading-block-spacing: var(--heading-block-spacing-mobile);
59
+ body {
60
+ --heading-block-spacing: var(--heading-block-spacing-mobile);
61
61
 
62
- @include core-mixins-v3.device(breakpoints.$tabPortrait) {
63
- --heading-block-spacing: var(--heading-block-spacing-portrait);
64
- }
62
+ @include core-mixins-v3.device(breakpoints.$tabPortrait) {
63
+ --heading-block-spacing: var(--heading-block-spacing-portrait);
64
+ }
65
65
 
66
- @include core-mixins-v3.device(breakpoints.$tabLandscape) {
67
- --heading-block-spacing: var(--heading-block-spacing-desktop);
66
+ @include core-mixins-v3.device(breakpoints.$tabLandscape) {
67
+ --heading-block-spacing: var(--heading-block-spacing-desktop);
68
+ }
68
69
  }
69
- }
70
- body {
71
- --paragraph-block-spacing: var(--paragraph-block-spacing-mobile);
70
+ body {
71
+ --paragraph-block-spacing: var(--paragraph-block-spacing-mobile);
72
72
 
73
- @include core-mixins-v3.device(breakpoints.$tabPortrait) {
74
- --paragraph-block-spacing: var(--paragraph-block-spacing-portrait);
75
- }
73
+ @include core-mixins-v3.device(breakpoints.$tabPortrait) {
74
+ --paragraph-block-spacing: var(--paragraph-block-spacing-portrait);
75
+ }
76
76
 
77
- @include core-mixins-v3.device(breakpoints.$tabLandscape) {
78
- --paragraph-block-spacing: var(--paragraph-block-spacing-desktop);
77
+ @include core-mixins-v3.device(breakpoints.$tabLandscape) {
78
+ --paragraph-block-spacing: var(--paragraph-block-spacing-desktop);
79
+ }
79
80
  }
80
- }
81
- body {
82
- --list-item-block-spacing: var(--list-item-block-spacing-mobile);
81
+ body {
82
+ --list-item-block-spacing: var(--list-item-block-spacing-mobile);
83
83
 
84
- @include core-mixins-v3.device(breakpoints.$tabPortrait) {
85
- --list-item-block-spacing: var(--list-item-block-spacing-portrait);
86
- }
84
+ @include core-mixins-v3.device(breakpoints.$tabPortrait) {
85
+ --list-item-block-spacing: var(--list-item-block-spacing-portrait);
86
+ }
87
87
 
88
- @include core-mixins-v3.device(breakpoints.$tabLandscape) {
89
- --list-item-block-spacing: var(--list-item-block-spacing-desktop);
88
+ @include core-mixins-v3.device(breakpoints.$tabLandscape) {
89
+ --list-item-block-spacing: var(--list-item-block-spacing-desktop);
90
+ }
91
+ }
92
+ body {
93
+ --global-content-max-width: #{core-functions-v3.fluidSize(
94
+ var(--global-content-max-width-setting),
95
+ 'static'
96
+ )};
90
97
  }
91
- }
92
- body {
93
- --global-content-max-width: #{core-functions-v3.fluidSize(
94
- var(--global-content-max-width-setting),
95
- 'static'
96
- )};
97
- }
98
+ } // End of mixin
@@ -11,8 +11,8 @@ function core_design_system_v3()
11
11
  $options = GLOBAL_SETTINGS;
12
12
  if ($options) {
13
13
  $output = '
14
- <style id="core-design-system">
15
- :root {
14
+ <style id="core-design-system-v3">
15
+ body {
16
16
  --mobile-inline:' . ($options['mobile_inline'] ?? 0) . ';
17
17
  --portrait-inline:' . ($options['portrait_inline'] ?? 0) . ';
18
18
  --landscape-inline:' . ($options['landscape_inline'] ?? 0) . ';
@@ -1,140 +1,141 @@
1
- // LIBRARY FILE - Do not modify/override here as your changes will be lost when the package is updated.
2
- @use 'Assets/scss/modules/library-modules/core-mixins/core-mixins';
3
- @use 'Assets/scss/modules/library-modules/core-cta/core-cta';
1
+ @use 'Assets/scss/modules/library-modules/core-mixins-v3/core-mixins-v3';
2
+ @use 'Assets/scss/modules/library-modules/core-typography-mixins-v3/core-typography-mixins-v3';
4
3
  @use 'Assets/scss/theme/breakpoints';
5
4
 
6
- /* Box sizing rules */
7
- *,
8
- *::before,
9
- *::after {
10
- box-sizing: border-box;
11
- }
12
-
13
- html {
14
- min-height: 100%;
15
- container-type: inline-size;
16
- &.lock-position {
17
- @include core-mixins.lockPosition();
5
+ @mixin coreGenericV3() {
6
+ /* Box sizing rules */
7
+ *,
8
+ *::before,
9
+ *::after {
10
+ box-sizing: border-box;
18
11
  }
19
- }
20
-
21
- .lazy-fade {
22
- opacity: 0;
23
- }
24
- .loaded:not(.cmpl-block-animations) {
25
- opacity: 1;
26
- }
27
12
 
28
- .js-enabled-hide {
29
- display: none;
30
- }
31
-
32
- body {
33
- display: flex;
34
- flex-direction: column;
35
- scroll-behavior: smooth;
36
- text-rendering: optimizeSpeed;
37
- margin: 0; //reset default margin
38
- padding: 0; //reset default padding
39
- height: auto;
40
- min-height: 100vh;
41
- position: relative;
42
- @include core-mixins.fontSecondary();
43
- background: var(--body-background-colour);
44
- --default-text-colour-mobile: var(--theme-primary-text-colour);
45
- color: var(--default-text-colour-mobile);
46
-
47
- @include core-mixins.device(breakpoints.$tabLandscape) {
48
- --default-text-colour-desktop: var(--theme-primary-text-colour);
49
- color: var(--default-text-colour-desktop);
50
- }
51
-
52
- &.lock-position {
53
- @include core-mixins.lockPosition();
54
- }
55
-
56
- &.hide-nav {
57
- .site-header {
58
- display: none;
13
+ html {
14
+ min-height: 100%;
15
+ container-type: inline-size;
16
+ &.lock-position {
17
+ @include core-mixins-v3.lockPosition();
59
18
  }
60
19
  }
61
- }
62
20
 
63
- .body-container-background-image,
64
- .page-container-background-image {
65
- &__picture {
66
- height: 100%;
67
- position: var(--body-background-image-position-type);
68
- inset: 0;
21
+ .lazy-fade {
22
+ opacity: 0;
23
+ }
24
+ .loaded:not(.cmpl-block-animations) {
25
+ opacity: 1;
69
26
  }
70
27
 
71
- &__image {
72
- height: 100%;
73
- object-fit: var(--body-background-image-fit);
74
- object-position: var(--body-background-image-position);
28
+ .js-enabled-hide {
29
+ display: none;
75
30
  }
76
- }
77
31
 
78
- .body-container-background-video {
79
- position: fixed;
80
- object-fit: cover;
81
- inset: 0;
82
- width: 100%;
83
- }
32
+ body {
33
+ display: flex;
34
+ flex-direction: column;
35
+ scroll-behavior: smooth;
36
+ text-rendering: optimizeSpeed;
37
+ margin: 0; //reset default margin
38
+ padding: 0; //reset default padding
39
+ height: auto;
40
+ min-height: 100vh;
41
+ position: relative;
42
+ @include core-typography-mixins-v3.fontSecondary();
43
+ background: var(--body-background-colour);
44
+ --default-text-colour-mobile: var(--theme-primary-text-colour);
45
+ color: var(--default-text-colour-mobile);
46
+
47
+ @include core-mixins-v3.device(breakpoints.$tabLandscape) {
48
+ --default-text-colour-desktop: var(--theme-primary-text-colour);
49
+ color: var(--default-text-colour-desktop);
50
+ }
84
51
 
85
- img {
86
- width: 100%;
87
- height: auto;
88
- display: block;
89
- }
52
+ &.lock-position {
53
+ @include core-mixins-v3.lockPosition();
54
+ }
90
55
 
91
- main {
92
- height: auto;
93
- width: 100%;
94
- max-width: var(--global-content-max-width-main);
95
- margin-inline: auto;
96
- background-image: var(--main-container-background-image);
97
- background-repeat: repeat;
98
- container-type: inline-size;
99
- }
56
+ &.hide-nav {
57
+ .site-header {
58
+ display: none;
59
+ }
60
+ }
61
+ }
100
62
 
101
- header,
102
- footer,
103
- section {
104
- width: 100%;
105
- max-width: 100%;
106
- }
107
- section[data-assetkey] {
108
- // container-type: inline-size;
109
- }
110
- .site-footer-block {
111
- margin-top: auto;
112
- }
113
- .grecaptcha-badge {
114
- z-index: 50;
115
- bottom: 0 !important;
116
- }
63
+ .body-container-background-image,
64
+ .page-container-background-image {
65
+ &__picture {
66
+ height: 100%;
67
+ position: var(--body-background-image-position-type);
68
+ inset: 0;
69
+ }
70
+
71
+ &__image {
72
+ height: 100%;
73
+ object-fit: var(--body-background-image-fit);
74
+ object-position: var(--body-background-image-position);
75
+ }
76
+ }
77
+
78
+ .body-container-background-video {
79
+ position: fixed;
80
+ object-fit: cover;
81
+ inset: 0;
82
+ width: 100%;
83
+ }
117
84
 
118
- .evidon-consent-button,
119
- .evidon-prefdiag-overlay,
120
- .evidon-banner {
121
- color: var(--black);
122
85
  img {
123
- width: auto;
86
+ width: 100%;
87
+ height: auto;
88
+ display: block;
124
89
  }
125
90
 
126
- a {
127
- text-decoration: underline;
128
- font-size: unset;
91
+ main {
92
+ height: auto;
93
+ width: 100%;
94
+ max-width: var(--global-content-max-width-main);
95
+ margin-inline: auto;
96
+ background-image: var(--main-container-background-image);
97
+ background-repeat: repeat;
98
+ container-type: inline-size;
129
99
  }
130
- }
131
100
 
132
- /* Remove all animations and transitions for people that prefer not to see them */
133
- @media (prefers-reduced-motion: reduce) {
134
- * {
135
- animation-duration: 0.01ms !important;
136
- animation-iteration-count: 1 !important;
137
- transition-duration: 0.01ms !important;
138
- scroll-behavior: auto !important;
101
+ header,
102
+ footer,
103
+ section {
104
+ width: 100%;
105
+ max-width: 100%;
106
+ }
107
+ section[data-assetkey] {
108
+ // container-type: inline-size;
109
+ }
110
+ .site-footer-block {
111
+ margin-top: auto;
112
+ }
113
+ .grecaptcha-badge {
114
+ z-index: 50;
115
+ bottom: 0 !important;
116
+ }
117
+
118
+ .evidon-consent-button,
119
+ .evidon-prefdiag-overlay,
120
+ .evidon-banner {
121
+ color: var(--black);
122
+ img {
123
+ width: auto;
124
+ }
125
+
126
+ a {
127
+ text-decoration: underline;
128
+ font-size: unset;
129
+ }
130
+ }
131
+
132
+ /* Remove all animations and transitions for people that prefer not to see them */
133
+ @media (prefers-reduced-motion: reduce) {
134
+ * {
135
+ animation-duration: 0.01ms !important;
136
+ animation-iteration-count: 1 !important;
137
+ transition-duration: 0.01ms !important;
138
+ scroll-behavior: auto !important;
139
+ }
139
140
  }
140
141
  }