Commit 95ea1c1c authored by benjamin melançon's avatar benjamin melançon 🛠

Merge branch '1.x' of gitlab.com:drutopia/drutopia_paragraph_title into 1.x

parents 622cb22e ef450a30
......@@ -11,4 +11,8 @@ dependencies:
- minimalhtmltitle
- paragraphs
- text
- ui_patterns
- ui_patterns_ds
- ui_patterns_layouts
- ui_patterns_library
package: Drutopia
......@@ -9,5 +9,17 @@ function drutopia_paragraph_title_theme() {
'template' => 'paragraph--title',
'base hook' => 'paragraph'
],
'field__field_title' => [
'template' => 'field--field-title',
'base hook' => 'field',
],
'field__field_subtitle' => [
'template' => 'field--field-subtitle',
'base hook' => 'field',
],
'field__field_style_color' => [
'template' => 'field--field-style-color',
'base hook' => 'field',
],
];
}
{#
/**
* @file
* Theme override for a field.
*
* To override output, copy the "field.html.twig" from the templates directory
* to your theme's directory and customize it, just like customizing other
* Drupal templates such as page.html.twig or node.html.twig.
*
* Instead of overriding the theming for all fields, you can also just override
* theming for a subset of fields using
* @link themeable Theme hook suggestions. @endlink For example,
* here are some theme hook suggestions that can be used for a field_foo field
* on an article node type:
* - field--node--field-foo--article.html.twig
* - field--node--field-foo.html.twig
* - field--node--article.html.twig
* - field--field-foo.html.twig
* - field--text-with-summary.html.twig
* - field.html.twig
*
* Available variables:
* - attributes: HTML attributes for the containing element.
* - label_hidden: Whether to show the field label or not.
* - title_attributes: HTML attributes for the title.
* - label: The label for the field.
* - multiple: TRUE if a field can contain multiple items.
* - items: List of all the field items. Each item contains:
* - attributes: List of HTML attributes for each item.
* - content: The field item's content.
* - entity_type: The entity type to which the field belongs.
* - field_name: The name of the field.
* - field_type: The type of the field.
* - label_display: The display settings for the label.
*
* @see template_preprocess_field()
*/
#}
{% for item in items %}
{{ item.content}}
{% endfor %}
{#
/**
* @file
* Theme override for a field.
*
* To override output, copy the "field.html.twig" from the templates directory
* to your theme's directory and customize it, just like customizing other
* Drupal templates such as page.html.twig or node.html.twig.
*
* Instead of overriding the theming for all fields, you can also just override
* theming for a subset of fields using
* @link themeable Theme hook suggestions. @endlink For example,
* here are some theme hook suggestions that can be used for a field_foo field
* on an article node type:
* - field--node--field-foo--article.html.twig
* - field--node--field-foo.html.twig
* - field--node--article.html.twig
* - field--field-foo.html.twig
* - field--text-with-summary.html.twig
* - field.html.twig
*
* Available variables:
* - attributes: HTML attributes for the containing element.
* - label_hidden: Whether to show the field label or not.
* - title_attributes: HTML attributes for the title.
* - label: The label for the field.
* - multiple: TRUE if a field can contain multiple items.
* - items: List of all the field items. Each item contains:
* - attributes: List of HTML attributes for each item.
* - content: The field item's content.
* - entity_type: The entity type to which the field belongs.
* - field_name: The name of the field.
* - field_type: The type of the field.
* - label_display: The display settings for the label.
*
* @see template_preprocess_field()
*/
#}
{# Child templates can specify classes to be added to items. #}
{% set item_classes = item_classes ?? ['subtitle'] %}
{% for item in items %}
{%
set item = item|merge({
'attributes': item.attributes.addClass(item_classes)
})
%}
<h2{{ item.attributes }}>{{ item.content}} </h2>
{% endfor %}
{#
/**
* @file
* Theme override for a field.
*
* To override output, copy the "field.html.twig" from the templates directory
* to your theme's directory and customize it, just like customizing other
* Drupal templates such as page.html.twig or node.html.twig.
*
* Instead of overriding the theming for all fields, you can also just override
* theming for a subset of fields using
* @link themeable Theme hook suggestions. @endlink For example,
* here are some theme hook suggestions that can be used for a field_foo field
* on an article node type:
* - field--node--field-foo--article.html.twig
* - field--node--field-foo.html.twig
* - field--node--article.html.twig
* - field--field-foo.html.twig
* - field--text-with-summary.html.twig
* - field.html.twig
*
* Available variables:
* - attributes: HTML attributes for the containing element.
* - label_hidden: Whether to show the field label or not.
* - title_attributes: HTML attributes for the title.
* - label: The label for the field.
* - multiple: TRUE if a field can contain multiple items.
* - items: List of all the field items. Each item contains:
* - attributes: List of HTML attributes for each item.
* - content: The field item's content.
* - entity_type: The entity type to which the field belongs.
* - field_name: The name of the field.
* - field_type: The type of the field.
* - label_display: The display settings for the label.
*
* @see template_preprocess_field()
*/
#}
{# Child templates can specify classes to be added to items. #}
{% set item_classes = item_classes ?? ['title'] %}
{% for item in items %}
{%
set item = item|merge({
'attributes': item.attributes.addClass(item_classes)
})
%}
<h1{{ item.attributes }}>{{ item.content}} </h1>
{% endfor %}
{# Overrides field--field-subtitle.html.twig for case study teasers (which use
the title paragraph 'preview' view mode). #}
{% for item in items %}
{{ item.content}}
{% endfor %}
{#
/**
* @file
* Default theme implementation to display a paragraph.
*
* Available variables:
* - paragraph: Full paragraph entity.
* Only method names starting with "get", "has", or "is" and a few common
* methods such as "id", "label", and "bundle" are available. For example:
* - paragraph.getCreatedTime() will return the paragraph creation timestamp.
* - paragraph.id(): The paragraph ID.
* - paragraph.bundle(): The type of the paragraph, for example, "image" or "text".
* - paragraph.getOwnerId(): The user ID of the paragraph author.
* See Drupal\paragraphs\Entity\Paragraph for a full list of public properties
* and methods for the paragraph object.
* - content: All paragraph items. Use {{ content }} to print them all,
* or print a subset such as {{ content.field_example }}. Use
* {{ content|without('field_example') }} to temporarily suppress the printing
* of a given child element.
* - attributes: HTML attributes for the containing element.
* The attributes.class element may contain one or more of the following
* classes:
* - paragraphs: The current template type (also known as a "theming hook").
* - paragraphs--type-[type]: The current paragraphs type. For example, if the paragraph is an
* "Image" it would result in "paragraphs--type--image". Note that the machine
* name will often be in a short form of the human readable label.
* - paragraphs--view-mode--[view_mode]: The View Mode of the paragraph; for example, a
* preview would result in: "paragraphs--view-mode--preview", and
* default: "paragraphs--view-mode--default".
* - view_mode: View mode; for example, "preview" or "full".
* - logged_in: Flag for authenticated user status. Will be true when the
* current user is a logged-in member.
* - is_admin: Flag for admin user status. Will be true when the current user
* is an administrator.
*
* @see template_preprocess_paragraph()
*
* @ingroup themeable
*/
#}
{%
set classes = [
'card',
'card-project',
not paragraph.isPublished() ? 'paragraph--unpublished'
]
%}
{% if content.field_style_color %}
{% set classes = classes|merge(['is-'~content.field_style_color|render|striptags|trim]) %}
{% endif %}
{% block paragraph %}
<a href="{{ path('entity.node.canonical', {'node': paragraph.getParentEntity().id()}) }}"{{ attributes.addClass(classes) }}>
{% block content %}
<div class="card-image" style="background-image: url({{ content.field_image|render|striptags|trim }}">
</div>
<div class="card-content content">
{# TODO something othar than this awful hack of stripping away h1, h2 #}
<h3 class="title">{{ content.field_title|render|striptags|trim }}</h3>
<p class="subtitle">{{ content.field_subtitle|render|striptags|trim }}</p>
</div>
{% endblock %}
</a>
{% endblock paragraph %}
{#
/**
* The paragraph preview view mode is used in the node teaser view mode.
*
* @see agaric/templates/paragraph/paragraph--title.html.twig for variables.
*/
#}
{%
set classes = [
'hero',
not paragraph.isPublished() ? 'paragraph--unpublished'
]
%}
{% if paragraph.field_style_color is not empty %}
{% set classes = classes|merge(['is-'~paragraph.field_style_color.value]) %}
{% endif %}
{% if paragraph.field_style_titlebar.value == false %}
{% set classes = classes|merge(['hero-project']) %}
{% endif %}
{% if paragraph.field_style_classes is not empty %}
{% set styles=[] %}
{% for style in paragraph.field_style_classes %}
{% set styles = styles|merge([style.value]) %}
{% endfor %}
{% set classes = classes|merge(styles) %}
{% endif %}
{% if paragraph.field_style_titlebar.value == true and paragraph.field_image is not empty %}
{% set attributes = attributes.setAttribute('data-headerbg', 'transparent').setAttribute('style', 'background-image: url('~file_url(paragraph.field_image.entity.uri.value)~')') %}
{% endif %}
{% block paragraph %}
{% block content %}
{{ content.field_image }}
<p class="byline is-mono">{{ content.field_subtitle }}</p>
{% endblock %}
{% endblock paragraph %}
{#
/**
* @file
* Default theme implementation to display a pargraph section.
*
* It extracts the title paragraph, if any, from a body paragraphs listing.
*
* @ingroup themeable
*/
#}
{% set title_paragraph_index = null %}
{% set has_title_paragraph = false %}
{% if paragraphs.field_body_paragraph %}
{% for i, paragraph in paragraphs.field_body_paragraph if i|first != '#' %}
{% if paragraphs.field_body_paragraph['#items'][i].entity.type.0.entity.id == 'title' %}
{% set has_title_paragraph = true %}
{% set title_paragraph_index = i %}
<div class="column is-one-third">
{{ paragraph }}
</div>
{% endif %}
{% endfor %}
{% endif %}
{% if not has_title_paragraph %}
<!-- This content (node/{{ paragraphs.field_body_paragraph['#object'].id }})
not shown because it does not have a title paragraph. -->
{% endif %}
tile:
label: Tile
description: A small teaser linking to content from a list displayed as a grid.
variants:
default:
label: Default
description: A plain tile.
berry:
label: Berry
description: A purple-colored tile.
cinnamon:
label: Cinnamon
description: An orange-colored tile.
blue:
label: Blue
description: A blue-colored tile.
marine:
label: Marine
description: A blue-green tile.
fields:
title:
type: text
label: Title
description: Tile title.
preview: ACME Dynamite
subtitle:
type: text
label: Subtitle
description: Tile subtitle.
preview: An explosive web site
title_paragraph:
label: Title paragraph
description: Extract the title paragraph, if any, from a body paragraphs listing.
fields:
paragraphs:
type: text
label: Title paragraph
description: Accepts a paragarph field; outputs only the title paragraph.
preview: '<a href="#" class="is-child card card-project is-cinnamon">
<div class="card-image" style="background-image:url(../assets/img/fpo-drtb-connamon.jpg)">
</div>
<div class="card-content">
<p class="title">DRTB Network</p>
<p class="subtitle">Community directory</p>
</div>
</a>'
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment