larva modules: expandable-search
Available Variants
prototypeexpandable-search
README
This needs docs!
Create a README.md in the pattern's directory and add details about using this pattern in markdown.
expandable-search
Twig The markup file.
<div class="expandable-search-outer // {{ expandable_search_outer_classes }}">
{% include "@larva/objects/o-icon-button/o-icon-button.twig" with o_icon_button_search %}
<div class="expandable-search // {{ expandable_search_classes }}" hidden>
<div class="expandable_search-inner {{ expandable_search_inner_classes }}" data-header-search-trigger="">
{% include "@larva/modules/search-form/search-form.twig" with search_form %}
</div>
</div>
</div>
expandable-search
JSON The data object for this pattern.
{
"expandable_search_outer_classes": "js-ExpandableSearch lrv-u-flex lrv-u-margin-l-auto lrv-a-glue-parent",
"expandable_search_classes": "js-ExpandableSearch-target lrv-a-unstyle-button lrv-u-color-black js-fade js-fade-is-out",
"expandable_search_inner_classes": "lrv-u-height-auto lrv-a-glue lrv-a-glue--l-0 lrv-a-glue--t-50p lrv-u-flex lrv-u-transform-translateY-n50p",
"o_icon_button_search": {
"o_icon_button_classes": "lrv-a-unstyle-button lrv-a-unstyle-link lrv-u-cursor-pointer lrv-u-flex js-ExpandableSearch-trigger",
"o_icon_button_ga_tracking": {},
"o_icon_button_rel_attr": "",
"o_icon_button_screen_reader_text": "Click to Expand Search Input",
"o_icon_button_target_attr": "",
"c_icon": {
"c_icon_link_classes": "",
"c_icon_name": "search",
"c_icon_target_attr": "_blank",
"c_icon_link_screen_reader_text": "Icon Link",
"c_icon_url": false,
"c_icon_classes": " lrv-u-display-block lrv-u-width-24 lrv-u-height-24 lrv-u-color-brand-primary:hover",
"c_icon_rel_name": "noopener noreferrer",
"c_icon_screen_reader_tag_text": "",
"c_icon_screen_reader_text": "Plus Icon",
"c_icon_screen_reader_title_attr": "Plus Icon"
},
"c_span": false
},
"search_form": {
"search_form_classes": "",
"search_form_action_url": "#",
"search_form_is_swiftype": false,
"search_form_input_classes": "",
"search_form_input_placeholder_attr": "Search...",
"search_form_submit_classes": ""
}
}