@total_onion/onion-library 1.0.96 → 1.0.97
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.
|
@@ -1,16 +1,11 @@
|
|
|
1
1
|
{# Do not edit this file outside of the component library as your changes will be lost with future updates. #}
|
|
2
2
|
{% set blockClassName = "group-container-v3" %}
|
|
3
|
-
{% if fields and fields.block_overflow is not defined %}
|
|
4
|
-
{% set fields = fields|merge({ 'block_overflow': false }) %}
|
|
5
|
-
{% endif %}
|
|
6
3
|
{% set classNameEntryPoint = include('entry-points/entry-point-classes.twig', { fields, block }, with_context = false) %}
|
|
7
4
|
{% set htmlEntryPoint = include('entry-points/entry-point-html-v3.twig', { fields, block, blockClassName, options, environment, is_preview, nav_menus, cta_styles }, with_context = false) %}
|
|
8
5
|
{% set dataAttributeEntryPoint = include('entry-points/entry-point-data-attribute.twig', { fields, block }, with_context = false) %}
|
|
9
6
|
{% set styleEntryPoint = include('entry-points/entry-point-style.twig', { fields, block, displaytype, is_preview }, with_context = false) %}
|
|
10
7
|
{% set previewEntryPoint = include('entry-points/entry-point-preview-info.twig', { fields, block, displaytype, is_preview }, with_context = false) %}
|
|
11
|
-
|
|
12
|
-
{% set fallbackBackgroundColour = '--block-background-colour: ' ~ fields.background_colour ~ ';' %}
|
|
13
|
-
{% endif %}
|
|
8
|
+
|
|
14
9
|
{% set layoutType = fields.layout_type|ru %}
|
|
15
10
|
{% set layoutStyles = '' %}
|
|
16
11
|
{% if layoutType == 'flex' %}
|
|
@@ -20,14 +15,12 @@
|
|
|
20
15
|
{% set layoutStyles = include('components/grid-layout-container-v3.twig') %}
|
|
21
16
|
{% set layoutClass = 'grid-layout-container' %}
|
|
22
17
|
{% endif %}
|
|
23
|
-
|
|
24
18
|
{% set gridGapMults = include('components/grid-gap-mults.twig') %}
|
|
25
19
|
{% set blockElementType = fields.block_element_type|default('section')|ru %}
|
|
26
20
|
{% set imageSizes = '(min-width: 1440px) ' ~ (100 / fields.grid_columns_desktop|default(1))|round ~ 'vw, (min-width: 1024px) ' ~ (100 / fields.grid_columns_desktop|default(1))|round ~ 'vw, (min-width: 768px) ' ~ (100 / fields.grid_columns_portrait|default(1))|round ~ 'vw, (min-width: 300px) ' ~(100 / fields.grid_columns_mobile|default(1))|round ~ 'vw, 100vw' %}
|
|
27
21
|
|
|
28
22
|
{% set sectionStyles = styleEntryPoint ~ fallbackBackgroundColour ~ gridGapMults ~ containerOverflowType ~ blockPosition %}
|
|
29
23
|
|
|
30
|
-
|
|
31
24
|
{{previewEntryPoint}}
|
|
32
25
|
<style>
|
|
33
26
|
.{{blockClassName}}.{{block.id}}{
|
|
@@ -48,7 +41,7 @@
|
|
|
48
41
|
<div class="group-container-v3__grid-container {{layoutClass}} {{block.id}}">
|
|
49
42
|
|
|
50
43
|
{% for section in fields.sections %}
|
|
51
|
-
{% set gridLayoutElement = include('components/grid-layout-element.twig', { fields: section, block }, with_context = false) %}
|
|
44
|
+
{% set gridLayoutElement = include('components/grid-layout-element-v3.twig', { fields: section, block }, with_context = false) %}
|
|
52
45
|
{% if block %}
|
|
53
46
|
{% set block = block|merge({'anchor' : '','className' : '', 'id': block.id ~ '-' ~ loop.index }) %}
|
|
54
47
|
{% endif %}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
{% set flexDirectionDesktop = '--flex-direction-desktop: ' ~ fields.flex_layout.flex_direction_desktop|ru|default('row') ~ ';' %}
|
|
2
2
|
{% set flexDirectionPortrait = '--flex-direction-portrait: ' ~ fields.flex_layout.flex_direction_portrait|ru|default('row') ~ ';' %}
|
|
3
|
-
|
|
4
3
|
{% set flexDirectionMobile = '--flex-direction-mobile: ' ~ fields.flex_layout.flex_direction_mobile|ru|default('row') ~ ';' %}
|
|
5
4
|
|
|
6
5
|
{% set flexWrapDesktop = '--flex-wrap-desktop: ' ~ fields.flex_layout.flex_wrap_desktop|ru|default('nowrap') ~ ';' %}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
{% set gridColumnStart = '--grid-column-start:' ~ fields.grid_layout_element.grid_column_start ~ ';' %}
|
|
2
|
+
{% set gridColumnSpan = '--grid-column-span:' ~ fields.grid_layout_element.grid_column_span ~ ';' %}
|
|
3
|
+
{% set gridRowStart = '--grid-row-start:' ~ fields.grid_layout_element.grid_row_start ~ ';' %}
|
|
4
|
+
{% set gridRowSpan = '--grid-row-span:' ~ fields.grid_layout_element.grid_row_span ~ ';' %}
|
|
5
|
+
{% set gridColumnStartPortrait = '--grid-column-start-portrait:' ~ fields.grid_layout_element.grid_column_start_portrait|default(fields.grid_layout_element.grid_column_start_mobile) ~ ';' %}
|
|
6
|
+
{% set gridColumnSpanPortrait = '--grid-column-span-portrait:' ~ fields.grid_layout_element.grid_column_span_portrait|default(fields.grid_layout_element.grid_column_span_mobile) ~ ';' %}
|
|
7
|
+
{% set gridRowStartPortrait = '--grid-row-start-portrait:' ~ fields.grid_layout_element.grid_row_start_portrait|default(fields.grid_layout_element.grid_row_start_mobile) ~ ';' %}
|
|
8
|
+
{% set gridRowSpanPortrait = '--grid-row-span-portrait:' ~ fields.grid_layout_element.grid_row_span_portrait|default(fields.grid_layout_element.grid_row_span_mobile) ~ ';' %}
|
|
9
|
+
{% set gridColumnStartMobile = '--grid-column-start-mobile:' ~ fields.grid_layout_element.grid_column_start_mobile ~ ';' %}
|
|
10
|
+
{% set gridColumnSpanMobile = '--grid-column-span-mobile:' ~ fields.grid_layout_element.grid_column_span_mobile ~ ';' %}
|
|
11
|
+
{% set gridRowStartMobile = '--grid-row-start-mobile:' ~ fields.grid_layout_element.grid_row_start_mobile ~ ';' %}
|
|
12
|
+
{% set gridRowSpanMobile = '--grid-row-span-mobile:' ~ fields.grid_layout_element.grid_row_span_mobile ~ ';' %}
|
|
13
|
+
{% set gridVerticalPlacement = '--grid-vertical-placement-desktop:' ~ fields.grid_layout_element.grid_vertical_placement|ru ~ ';' %}
|
|
14
|
+
{% set gridHorizontalPlacement = '--grid-horizontal-placement-desktop:' ~ fields.grid_layout_element.grid_horizontal_placement|ru ~ ';' %}
|
|
15
|
+
{% set gridHorizontalPlacementPortrait = '--grid-horizontal-placement-portrait:' ~ ((fields.grid_layout_element.grid_layout_portrait.grid_horizontal_placement_portrait == '__default') ? fields.grid_layout_element.grid_horizontal_placement|ru : fields.grid_layout_element.grid_layout_portrait.grid_horizontal_placement_portrait|ru) ~ ';' %}
|
|
16
|
+
{% set gridVerticalPlacementPortrait = '--grid-vertical-placement-portrait:' ~ ((fields.grid_layout_element.grid_layout_portrait.grid_vertical_placement_portrait == '__default') ? fields.grid_layout_element.grid_vertical_placement|ru : fields.grid_layout_element.grid_layout_portrait.grid_vertical_placement_portrait|ru) ~ ';' %}
|
|
17
|
+
{% set gridHorizontalPlacementMobile = '--grid-horizontal-placement-mobile:' ~ ((fields.grid_layout_element.grid_layout_mobile.grid_horizontal_placement_mobile == '__default') ? fields.grid_layout_element.grid_horizontal_placement|ru : fields.grid_layout_element.grid_layout_mobile.grid_horizontal_placement_mobile|ru) ~ ';' %}
|
|
18
|
+
{% set gridVerticalPlacementMobile = '--grid-vertical-placement-mobile:' ~ ((fields.grid_layout_element.grid_layout_mobile.grid_vertical_placement_mobile == '__default') ? fields.grid_layout_element.grid_vertical_placement|ru : fields.grid_layout_element.grid_layout_mobile.grid_vertical_placement_mobile|ru) ~ ';' %}
|
|
19
|
+
{% set gridLayoutElement = gridColumnStartMobile ~ gridColumnSpanMobile ~ gridRowStartMobile ~ gridRowSpanMobile ~ gridColumnStartPortrait ~ gridColumnSpanPortrait ~ gridRowStartPortrait ~ gridRowSpanPortrait ~ gridColumnStart ~ gridColumnSpan ~ gridRowStart ~ gridRowSpan ~ gridHorizontalPlacement ~ gridVerticalPlacement ~ gridHorizontalPlacementPortrait ~ gridVerticalPlacementPortrait ~ gridHorizontalPlacementMobile ~ gridVerticalPlacementMobile %}
|
|
20
|
+
{{gridLayoutElement}}
|