larva modules: page-404

Available Variants

prototype

404

OOPS! Something went wrong here!

Here is a pretty small amount of text for the tagline. It is a very flexible components, and is really just a single line of text.

Here are some suggestions that might be the page you were looking for:

  • item_one
  • item_two

Or try searching for it here...

page-404 README

This needs docs!
Create a README.md in the pattern's directory and add details about using this pattern in markdown.

page-404 Twig The markup file. 
<section class="page-404 // {{ wrapper_classes }}">
	<div class="{{ page_404_inner_classes }}">
		{% if c_heading %}
			{% include "@larva/components/c-heading/c-heading.twig" with c_heading %}
		{% endif %}

		{% if c_svg %}
			{% include "@larva/components/c-svg/c-svg.twig" with c_svg %}
		{% endif %}

		{% if c_title %}
			{% include "@larva/components/c-title/c-title.twig" with c_title %}
		{% endif %}

		{% if c_tagline %}
			{% include "@larva/components/c-tagline/c-tagline.twig" with c_tagline %}
		{% endif %}

		{% if c_suggestion_title %}
			{% include "@larva/components/c-title/c-title.twig" with c_suggestion_title %}
		{% endif %}

		{% if suggested_link_items %}
			{% include "@larva/modules/list/list.twig" with suggested_link_items %}
		{% endif %}

		{% if c_search_title %}
			{% include "@larva/components/c-title/c-title.twig" with c_search_title %}
		{% endif %}

		{% if search_form %}
			{% include "@larva/modules/search-form/search-form.twig" with search_form %}
		{% endif %}

	</div>
</section>
page-404 JSON The data object for this pattern. 
{
	"button_outer_classes": "lrv-u-flex lrv-u-justify-content-center lrv-u-align-items-center lrv-u-flex-direction-column@mobile-max",
	"c_heading": {
		"c_heading_classes": "lrv-a-screen-reader-only",
		"c_heading_id_attr": "section-heading",
		"c_heading_text": "404",
		"c_heading_url": "",
		"c_heading_link_classes": "",
		"c_heading_outer": false,
		"c_heading_outer_classes": "",
		"c_heading_is_primary_heading": true
	},
	"c_suggestion_title": {
		"c_title_classes": "lrv-u-text-align-left lrv-u-margin-b-075",
		"c_title_tag_text": "",
		"c_title_id_attr": "title-of-a-story",
		"c_title_text": "Here are some suggestions that might be the page you were looking for:",
		"c_title_markup": "",
		"c_title_link_classes": "",
		"c_title_url": false
	},
	"c_search_title": {
		"c_title_classes": "lrv-u-text-align-left",
		"c_title_tag_text": "",
		"c_title_id_attr": "title-of-a-story",
		"c_title_text": "Or try searching for it here...",
		"c_title_markup": "",
		"c_title_link_classes": "",
		"c_title_url": false
	},
	"c_svg": {
		"c_svg_classes": "lrv-u-max-width-100p",
		"c_svg_name": "logo-404"
	},
	"c_tagline": {
		"c_tagline_classes": "",
		"c_tagline_text": "Here is a pretty small amount of text for the tagline. It is a very flexible components, and is really just a single line of text."
	},
	"c_title": {
		"c_title_classes": "lrv-a-font-secondary-l lrv-u-text-transform-uppercase lrv-u-margin-b-125",
		"c_title_tag_text": "",
		"c_title_id_attr": "title-of-a-story",
		"c_title_text": "OOPS! Something went wrong here!",
		"c_title_markup": "",
		"c_title_link_classes": "",
		"c_title_url": false
	},
	"page_404_inner_classes": "lrv-u-margin-lr-auto lrv-u-padding-lr-1",
	"search_form": {
		"search_form_classes": "lrv-u-text-align-left lrv-u-margin-t-1 search-form-404",
		"search_form_action_url": "/?s=",
		"search_form_is_swiftype": false,
		"search_form_input_classes": "lrv-u-border-a-1 lrv-u-width-100p",
		"search_form_input_placeholder_attr": "Search",
		"search_form_submit_classes": ""
	},
	"suggested_link_items": {
		"list_classes": "lrv-u-text-align-left lrv-u-padding-b-1",
		"list_markup": "Paragraph Text.",
		"list_type_name": "u",
		"list_items": [
			{
				"list_markup": "item_one"
			},
			{
				"list_markup": "item_two"
			}
		],
		"list_item_classes": ""
	},
	"wrapper_classes": "lrv-u-text-align-center lrv-u-padding-t-1 lrv-u-padding-b-2 lrv-u-margin-b-2 lrv-u-max-width-830 lrv-u-margin-lr-auto"
}