larva modules: expandable-search

Available Variants

prototype
expandable-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": ""
	}
}