diff --git a/framework/elements/grid/grid.php b/framework/elements/grid/grid.php index 7f6001ad..5cb33239 100644 --- a/framework/elements/grid/grid.php +++ b/framework/elements/grid/grid.php @@ -31,22 +31,18 @@ $style = new Style('#'. $element->id); $style_dark = new Style('#'. $element->id, 'dark'); $row_column_cls = ''; -$xxl_column = $params->get('xxl_column', ''); -$row_column_cls .= $xxl_column ? ' row-cols-xxl-' . $xxl_column : ''; -$xl_column = $params->get('xl_column', ''); -$row_column_cls .= $xl_column ? ' row-cols-xl-' . $xl_column : ''; -$lg_column = $params->get('lg_column', 3); -$row_column_cls .= $lg_column ? ' row-cols-lg-' . $lg_column : ''; -$md_column = $params->get('md_column', 1); -$row_column_cls .= $md_column ? ' row-cols-md-' . $md_column : ''; -$sm_column = $params->get('sm_column', 1); -$row_column_cls .= $sm_column ? ' row-cols-sm-' . $sm_column : ''; -$xs_column = $params->get('xs_column', 1); -$row_column_cls .= $xs_column ? ' row-cols-' . $xs_column : ''; $responsive_key = ['xxl', 'xl', 'lg', 'md', 'sm', 'xs']; foreach ($responsive_key as $key) { + $default = match ($key) { + 'xxl', 'xl' => '', + 'lg' => 3, + default => 1 + }; + $column = $params->get($key . '_column', $default); + if ($key !== 'xs') { + $row_column_cls .= $column ? ' row-cols-'. $key .'-' . $column : ''; $row_gutter = $params->get('row_gutter_'.$key, ''); $column_gutter = $params->get('column_gutter_'. $key, ''); if ($row_gutter) { @@ -56,6 +52,7 @@ $row_column_cls .= ' gx-' . $key . '-' . $column_gutter; } } else { + $row_column_cls .= $column ? ' row-cols-' . $column : ''; $row_gutter = $params->get('row_gutter', 3); $column_gutter = $params->get('column_gutter', 3); $row_column_cls .= ' gy-' . $row_gutter; @@ -80,18 +77,20 @@ } else { $media_width_cls.= 'order-0'; } -$xxl_column_media = $params->get('xxl_column_media', ''); -$media_width_cls .= $xxl_column_media ? ' col-xxl-' . $xxl_column_media : ''; -$xl_column_media = $params->get('xl_column_media', ''); -$media_width_cls .= $xl_column_media ? ' col-xl-' . $xl_column_media : ''; -$lg_column_media = $params->get('lg_column_media', 4); -$media_width_cls .= $lg_column_media ? ' col-lg-' . $lg_column_media : ''; -$md_column_media = $params->get('md_column_media', 12); -$media_width_cls .= $md_column_media ? ' col-md-' . $md_column_media : ''; -$sm_column_media = $params->get('sm_column_media', 12); -$media_width_cls .= $sm_column_media ? ' col-sm-' . $sm_column_media : ''; -$xs_column_media = $params->get('xs_column_media', 12); -$media_width_cls .= $xs_column_media ? ' col-' . $xs_column_media : ''; + +foreach ($responsive_key as $device) { + $default = match ($device) { + 'xxl', 'xl' => '', + 'lg' => 4, + default => 12 + }; + $column_media = $params->get($device . '_column_media', $default); + if ($device === 'xs') { + $media_width_cls.= $column_media ? ' col-' . $column_media . ($media_position == 'right' && $column_media < 12 ? ' text-end' : '') : ''; + } else { + $media_width_cls.= $column_media ? ' col-' . $device . '-' . $column_media . ($media_position == 'right' && $column_media < 12 ? ' text-'.$device.'-end' : '') : ''; + } +} $icon_size = $params->get('icon_size', 60); diff --git a/framework/elements/grid/grid.xml b/framework/elements/grid/grid.xml index 622f94b6..d33e2222 100644 --- a/framework/elements/grid/grid.xml +++ b/framework/elements/grid/grid.xml @@ -287,7 +287,7 @@ - +