Skip to content
Snippets Groups Projects
Commit be2f08e6 authored by Gábor Hojtsy's avatar Gábor Hojtsy
Browse files

Issue #3044250 by kjay, shaal, pawandubey, markconroy, Gábor Hojtsy, lauriii:...

Issue #3044250 by kjay, shaal, pawandubey, markconroy, Gábor Hojtsy, lauriii: Make the highlighted region in Umami more flexible so it adapts to its use with Layout Builder and could be used to demonstrate placement of other blocks
parent 3d7ea45c
No related branches found
No related tags found
2 merge requests!7452Issue #1797438. HTML5 validation is preventing form submit and not fully...,!789Issue #3210310: Adjust Database API to remove deprecated Drupal 9 code in Drupal 10
/**
* @file
* Styles for help messages.
*/
.block-help {
margin-bottom: 1em;
padding: 1.26em;
word-wrap: break-word;
color: inherit;
border: 1px solid #b3daf0;
background-color: #eef5f9;
overflow-wrap: break-word;
}
.block-help__container {
padding-left: 24px; /* LTR */
background-image: url(/core/profiles/demo_umami/themes/umami/images/svg/help.svg);
background-repeat: no-repeat;
background-position: left 4px; /* LTR */
}
[dir=rtl] .block-help__container {
padding-right: 24px;
padding-left: 0;
background-position: right 4px;
}
.block-help__container > *:last-child {
margin-bottom: 0;
}
......@@ -4,6 +4,7 @@
*/
.messages {
margin-bottom: 1em;
padding: 20px;
word-wrap: break-word;
color: inherit;
......@@ -26,18 +27,21 @@
background-position: right;
}
.messages--status {
border: 1px solid #cbdebc;
background-color: #e6eee0;
}
.messages--status .messages__content {
background-image: url(/core/misc/icons/73b355/check.svg);
}
.messages--warning {
border: 1px solid #fae2a4;
background-color: #fcf1d4;
}
.messages--warning .messages__content {
background-image: url(/core/misc/icons/e29700/warning.svg);
}
.messages--error {
border: 1px solid #f8c8d5;
background-color: #f9e6eb;
}
.messages--error .messages__content {
......
/**
* @file
* This file is used to style the highlighted region.
*
*/
.layout-highlighted {
padding: 0 1.26em 1em;
background: #fff;
}
<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg"><g transform="translate(0 -1)" fill="none" fill-rule="evenodd"><circle fill="#009FFA" cx="8" cy="9" r="8"/><text font-family="HelveticaNeue-Bold, Helvetica Neue" font-size="14" font-weight="bold" fill="#FFF"><tspan x="4" y="14">?</tspan></text></g></svg>
{#
/**
* @file
* Theme override for help messages.
*
* Available variables:
* - plugin_id: The ID of the block implementation.
* - label: The configured label of the block if visible.
* - configuration: A list of the block's configuration values.
* - label: The configured label for the block.
* - label_display: The display settings for the label.
* - provider: The module or other provider that provided this block plugin.
* - Block plugin specific settings will also be stored here.
* - content: The content of this block.
* - attributes: array of HTML attributes populated by modules, intended to
* be added to the main container tag of this template.
* - id: A valid HTML ID and guaranteed unique.
* - title_attributes: Same as attributes, except applied to the main title
* tag that appears in the template.
* - title_prefix: Additional output populated by modules, intended to be
* displayed in front of the main title tag that appears in the template.
* - title_suffix: Additional output populated by modules, intended to be
* displayed after the main title tag that appears in the template.
*
* @see template_preprocess_block()
*/
#}
{%
set classes = [
'block',
'block-' ~ configuration.provider|clean_class,
'block-' ~ plugin_id|clean_class,
]
%}
<div{{ attributes.addClass(classes) }}>
<div class="block-help__container">
{{ title_prefix }}
{% if label %}
<h2{{ title_attributes }}>{{ label }}</h2>
{% endif %}
{{ title_suffix }}
{% block content %}
{{ content }}
{% endblock %}
</div>
</div>
......@@ -59,8 +59,8 @@
{% endif %}
{% if page.highlighted %}
<div class="container">
<div class="layout-highlighted">
<div class="layout-highlighted">
<div class="container">
{{ page.highlighted }}
</div>
</div>
......
......@@ -7,6 +7,7 @@ global:
css/components/blocks/banner/banner.css: {}
css/components/blocks/branding/branding.css: {}
css/components/blocks/disclaimer/disclaimer.css: {}
css/components/blocks/help/help.css: {}
css/components/blocks/page-title/page-title.css: {}
css/components/blocks/footer-promo/footer-promo.css: {}
css/components/blocks/language-switcher/language-switcher.css: {}
......@@ -34,6 +35,7 @@ global:
css/components/regions/bottom/bottom.css: {}
css/components/regions/footer/footer.css: {}
css/components/regions/header/header.css: {}
css/components/regions/highlighted/highlighted.css: {}
css/components/regions/pre-header/pre-header.css: {}
css/components/toolbar/toolbar.css: {}
layout:
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment