Skip to content

Commit

Permalink
Merge pull request #61 from saschadube/feature/4.3-text-color
Browse files Browse the repository at this point in the history 
add text color option for transparent header to Flipcard, Image Comparison and Timeline elements
  • Loading branch information
@forrestkirby
forrestkirby committed Feb 8, 2024
2 parents 3223c3e + ab33a11 commit dd987d8
Show file tree
Hide file tree
Showing 9 changed files with 80 additions and 6 deletions.
30 changes: 28 additions & 2 deletions modules/elements/elements/hd-flipcard/element.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -775,6 +775,18 @@
},
"enable": "image && image_svg_inline"
},
"image_text_color": {
"label": "Text Color",
"description": "Set light or dark color mode for text, buttons and controls if a sticky transparent navbar is displayed above.",
"type": "select",
"options": {
"None": "",
"Light": "light",
"Dark": "dark"
},
"source": true,
"enable": "image"
},
"link_style": {
"label": "Style",
"description": "Set the link style.",
Expand Down Expand Up @@ -1440,6 +1452,18 @@
"text": "Load image eagerly",
"enable": "image_back"
},
"image_back_text_color": {
"label": "Text Color",
"description": "Set light or dark color mode for text, buttons and controls if a sticky transparent navbar is displayed above.",
"type": "select",
"options": {
"None": "",
"Light": "light",
"Dark": "dark"
},
"source": true,
"enable": "image_back"
},
"link_back_style": {
"label": "Style",
"description": "Set the link style.",
Expand Down Expand Up @@ -1661,7 +1685,8 @@
"image_margin",
"image_svg_inline",
"image_svg_animate",
"image_svg_color"
"image_svg_color",
"image_text_color"
]
},
{
Expand Down Expand Up @@ -1752,7 +1777,8 @@
"image_back_svg_inline",
"image_back_svg_animate",
"image_back_svg_color",
"image_back_loading"
"image_back_loading",
"image_back_text_color"
]
},
{
Expand Down
1 change: 1 addition & 0 deletions modules/elements/elements/hd-flipcard/templates/template-image.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@

'uk-text-{image_svg_color} {@image_svg_inline}' => $this->isImage($props['image']) == 'svg',
'uk-margin[-{image_margin}]-top {@!image_margin: remove} {@!image_box_decoration}' => $props['image_align'] == 'between' || ($props['image_align'] == 'bottom' && !($props['panel_style'] && $props['panel_image_no_padding'])),
'uk-inverse-{image_text_color}',
],

'src' => $props['image'],
Expand Down
1 change: 1 addition & 0 deletions modules/elements/elements/hd-flipcard/templates/template-image_back.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@

'uk-text-{image_back_svg_color} {@image_back_svg_inline}' => $this->isImage($props['image_back']) == 'svg',
'uk-margin[-{image_back_margin}]-top {@!image_back_margin: remove} {@!image_back_box_decoration} {@!image_back_transition}' => $props['image_back_align'] == 'between' || ($props['image_back_align'] == 'bottom' && !($props['panel_back_style'] && $props['panel_back_image_no_padding'])),
'uk-inverse-{image_back_text_color}',
],

'src' => $props['image_back'],
Expand Down
14 changes: 13 additions & 1 deletion modules/elements/elements/hd-image-comparison/element.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -175,6 +175,17 @@
"text": "Inverse style",
"enable": "$match(image_box_decoration, '^(default|primary|secondary)$')"
},
"text_color": {
"label": "Text Color",
"description": "Set light or dark color mode for text, buttons and controls if a sticky transparent navbar is displayed above.",
"type": "select",
"options": {
"None": "",
"Light": "light",
"Dark": "dark"
},
"source": true
},
"icon_color": {
"label": "Slider Icon Color",
"description": "Select the icon color.",
Expand Down Expand Up @@ -302,7 +313,8 @@
"image_border",
"image_box_shadow",
"image_box_decoration",
"image_box_decoration_inverse"
"image_box_decoration_inverse",
"text_color"
]
},
{
Expand Down
8 changes: 7 additions & 1 deletion modules/elements/elements/hd-image-comparison/templates/template.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,13 @@

$uniqid = uniqid('hd-');

$el = $this->el('div');
$el = $this->el('div', [

'class' => [
'uk-inverse-{text_color}',
],

]);

// Image Before
$image_before = $this->el('image', [
Expand Down
15 changes: 14 additions & 1 deletion modules/elements/elements/hd-timeline/element.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -857,6 +857,18 @@
},
"enable": "show_image && image_svg_inline"
},
"image_text_color": {
"label": "Text Color",
"description": "Set light or dark color mode for text, buttons and controls if a sticky transparent navbar is displayed above.",
"type": "select",
"options": {
"None": "",
"Light": "light",
"Dark": "dark"
},
"source": true,
"enable": "show_image"
},
"link_target": {
"label": "Target",
"type": "checkbox",
Expand Down Expand Up @@ -1092,7 +1104,8 @@
"image_margin",
"image_svg_inline",
"image_svg_animate",
"image_svg_color"
"image_svg_color",
"image_text_color"
]
},
{
Expand Down
14 changes: 13 additions & 1 deletion modules/elements/elements/hd-timeline_item/element.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,6 +98,18 @@
"source": true,
"enable": "image"
},
"image_text_color": {
"label": "Text Color",
"description": "Set light or dark color mode for text, buttons and controls if a sticky transparent navbar is displayed above.",
"type": "select",
"options": {
"None": "",
"Light": "light",
"Dark": "dark"
},
"source": true,
"enable": "image"
},
"status": "${builder.statusItem}",
"source": "${builder.source}"
},
Expand Down Expand Up @@ -132,7 +144,7 @@
{
"label": "Image",
"type": "group",
"fields": ["image_focal_point"]
"fields": ["image_focal_point", "image_text_color"]
}
]
},
Expand Down
2 changes: 2 additions & 0 deletions modules/elements/elements/hd-timeline_item/templates/template-image.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@
'uk-transition-{image_transition} uk-transition-opaque' => $props['link'] && ($element['image_link'] || $element['panel_link']),

'uk-text-{image_svg_color} {@image_svg_inline}' => $this->isImage($props['image']) == 'svg',

'uk-inverse-{0}' => $element['image_text_color'],
],

'src' => $props['image'],
Expand Down
1 change: 1 addition & 0 deletions modules/elements/elements/hd-timeline_item/templates/template.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@

// Override default settings
$element['panel_style'] = $props['panel_style'] ?: $element['panel_style'];
$element['image_text_color'] = $props['image_text_color'] ?: $element['image_text_color'];

// Image
$props['image'] = $this->render("{$__dir}/template-image", compact('props'));
Expand Down

0 comments on commit dd987d8

Please sign in to comment.