improved projet page, created projet archives page
This commit is contained in:
@@ -0,0 +1,91 @@
|
||||
uuid: 682395cd-d791-41ab-ac31-4199911aa22f
|
||||
langcode: fr
|
||||
status: true
|
||||
dependencies:
|
||||
config:
|
||||
- core.entity_view_mode.node.tableau_liste
|
||||
- field.field.node.projet.body
|
||||
- field.field.node.projet.field_artiste_s_invite_s
|
||||
- field.field.node.projet.field_dates
|
||||
- field.field.node.projet.field_fichiers
|
||||
- field.field.node.projet.field_images
|
||||
- field.field.node.projet.field_invite_accompagne_curate_p
|
||||
- field.field.node.projet.field_partenaire_s
|
||||
- field.field.node.projet.field_portage
|
||||
- field.field.node.projet.field_projet_s_lie_s
|
||||
- field.field.node.projet.field_type_de_projet
|
||||
- image.style.large
|
||||
- node.type.projet
|
||||
module:
|
||||
- datetime_range
|
||||
- image_delta_formatter
|
||||
- layout_builder
|
||||
- text
|
||||
- user
|
||||
third_party_settings:
|
||||
layout_builder:
|
||||
enabled: false
|
||||
allow_custom: false
|
||||
id: node.projet.tableau_liste
|
||||
targetEntityType: node
|
||||
bundle: projet
|
||||
mode: tableau_liste
|
||||
content:
|
||||
body:
|
||||
type: text_summary_or_trimmed
|
||||
label: hidden
|
||||
settings:
|
||||
trim_length: 100
|
||||
third_party_settings: { }
|
||||
weight: 4
|
||||
region: content
|
||||
field_artiste_s_invite_s:
|
||||
type: entity_reference_label
|
||||
label: hidden
|
||||
settings:
|
||||
link: false
|
||||
third_party_settings: { }
|
||||
weight: 1
|
||||
region: content
|
||||
field_dates:
|
||||
type: daterange_default
|
||||
label: hidden
|
||||
settings:
|
||||
timezone_override: ''
|
||||
format_type: d_m_y
|
||||
from_to: both
|
||||
separator: '-'
|
||||
third_party_settings: { }
|
||||
weight: 2
|
||||
region: content
|
||||
field_images:
|
||||
type: image_delta_formatter
|
||||
label: hidden
|
||||
settings:
|
||||
deltas:
|
||||
- 1
|
||||
deltas_reversed: false
|
||||
image_link: content
|
||||
image_style: large
|
||||
image_loading:
|
||||
attribute: lazy
|
||||
third_party_settings: { }
|
||||
weight: 0
|
||||
region: content
|
||||
field_type_de_projet:
|
||||
type: entity_reference_label
|
||||
label: hidden
|
||||
settings:
|
||||
link: false
|
||||
third_party_settings: { }
|
||||
weight: 3
|
||||
region: content
|
||||
hidden:
|
||||
field_fichiers: true
|
||||
field_invite_accompagne_curate_p: true
|
||||
field_partenaire_s: true
|
||||
field_portage: true
|
||||
field_projet_s_lie_s: true
|
||||
langcode: true
|
||||
links: true
|
||||
search_api_excerpt: true
|
||||
@@ -0,0 +1,11 @@
|
||||
uuid: ac968411-2b96-4643-b24a-4e77735f024c
|
||||
langcode: fr
|
||||
status: true
|
||||
dependencies:
|
||||
module:
|
||||
- node
|
||||
id: node.tableau_liste
|
||||
label: 'Tableau liste'
|
||||
description: ''
|
||||
targetEntityType: node
|
||||
cache: true
|
||||
@@ -0,0 +1,187 @@
|
||||
uuid: ad48e5a0-36b0-4e30-82d1-0644e114c98c
|
||||
langcode: fr
|
||||
status: true
|
||||
dependencies:
|
||||
config:
|
||||
- core.entity_view_mode.node.tableau_liste
|
||||
- node.type.projet
|
||||
- system.menu.main
|
||||
module:
|
||||
- datetime
|
||||
- node
|
||||
- user
|
||||
id: archives
|
||||
label: Archives
|
||||
module: views
|
||||
description: ''
|
||||
tag: ''
|
||||
base_table: node_field_data
|
||||
base_field: nid
|
||||
display:
|
||||
default:
|
||||
id: default
|
||||
display_title: Default
|
||||
display_plugin: default
|
||||
position: 0
|
||||
display_options:
|
||||
title: Archives
|
||||
fields:
|
||||
title:
|
||||
id: title
|
||||
table: node_field_data
|
||||
field: title
|
||||
relationship: none
|
||||
group_type: group
|
||||
admin_label: ''
|
||||
entity_type: node
|
||||
entity_field: title
|
||||
plugin_id: field
|
||||
label: ''
|
||||
exclude: false
|
||||
alter:
|
||||
alter_text: false
|
||||
make_link: false
|
||||
absolute: false
|
||||
word_boundary: false
|
||||
ellipsis: false
|
||||
strip_tags: false
|
||||
trim: false
|
||||
html: false
|
||||
element_type: ''
|
||||
element_class: ''
|
||||
element_label_type: ''
|
||||
element_label_class: ''
|
||||
element_label_colon: true
|
||||
element_wrapper_type: ''
|
||||
element_wrapper_class: ''
|
||||
element_default_classes: true
|
||||
empty: ''
|
||||
hide_empty: false
|
||||
empty_zero: false
|
||||
hide_alter_empty: true
|
||||
click_sort_column: value
|
||||
type: string
|
||||
settings:
|
||||
link_to_entity: true
|
||||
group_column: value
|
||||
group_columns: { }
|
||||
group_rows: true
|
||||
delta_limit: 0
|
||||
delta_offset: 0
|
||||
delta_reversed: false
|
||||
delta_first_last: false
|
||||
multi_type: separator
|
||||
separator: ', '
|
||||
field_api_classes: false
|
||||
pager:
|
||||
type: none
|
||||
options:
|
||||
offset: 0
|
||||
exposed_form:
|
||||
type: basic
|
||||
options:
|
||||
submit_button: Appliquer
|
||||
reset_button: false
|
||||
reset_button_label: Réinitialiser
|
||||
exposed_sorts_label: 'Trier par'
|
||||
expose_sort_order: true
|
||||
sort_asc_label: Asc
|
||||
sort_desc_label: Desc
|
||||
access:
|
||||
type: perm
|
||||
options:
|
||||
perm: 'access content'
|
||||
cache:
|
||||
type: tag
|
||||
options: { }
|
||||
empty: { }
|
||||
sorts:
|
||||
field_dates_value:
|
||||
id: field_dates_value
|
||||
table: node__field_dates
|
||||
field: field_dates_value
|
||||
relationship: none
|
||||
group_type: group
|
||||
admin_label: ''
|
||||
plugin_id: datetime
|
||||
order: DESC
|
||||
expose:
|
||||
label: ''
|
||||
field_identifier: ''
|
||||
exposed: false
|
||||
granularity: second
|
||||
arguments: { }
|
||||
filters:
|
||||
status:
|
||||
id: status
|
||||
table: node_field_data
|
||||
field: status
|
||||
entity_type: node
|
||||
entity_field: status
|
||||
plugin_id: boolean
|
||||
value: '1'
|
||||
group: 1
|
||||
expose:
|
||||
operator: ''
|
||||
type:
|
||||
id: type
|
||||
table: node_field_data
|
||||
field: type
|
||||
entity_type: node
|
||||
entity_field: type
|
||||
plugin_id: bundle
|
||||
value:
|
||||
projet: projet
|
||||
style:
|
||||
type: default
|
||||
row:
|
||||
type: 'entity:node'
|
||||
options:
|
||||
relationship: none
|
||||
view_mode: tableau_liste
|
||||
query:
|
||||
type: views_query
|
||||
options:
|
||||
query_comment: ''
|
||||
disable_sql_rewrite: false
|
||||
distinct: false
|
||||
replica: false
|
||||
query_tags: { }
|
||||
relationships: { }
|
||||
css_class: views-archives-projets
|
||||
header: { }
|
||||
footer: { }
|
||||
display_extenders: { }
|
||||
cache_metadata:
|
||||
max-age: -1
|
||||
contexts:
|
||||
- 'languages:language_content'
|
||||
- 'languages:language_interface'
|
||||
- 'user.node_grants:view'
|
||||
- user.permissions
|
||||
tags: { }
|
||||
page_1:
|
||||
id: page_1
|
||||
display_title: Page
|
||||
display_plugin: page
|
||||
position: 1
|
||||
display_options:
|
||||
display_extenders: { }
|
||||
path: archives
|
||||
menu:
|
||||
type: normal
|
||||
title: archives
|
||||
description: ''
|
||||
weight: -48
|
||||
expanded: false
|
||||
menu_name: main
|
||||
parent: ''
|
||||
context: '0'
|
||||
cache_metadata:
|
||||
max-age: -1
|
||||
contexts:
|
||||
- 'languages:language_content'
|
||||
- 'languages:language_interface'
|
||||
- 'user.node_grants:view'
|
||||
- user.permissions
|
||||
tags: { }
|
||||
+6
-6
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
@@ -55,8 +55,9 @@ gsap.registerPlugin(ScrollTrigger);
|
||||
initTitles();
|
||||
initBurgerMenu();
|
||||
initSmoothScroll();
|
||||
initColumnScrollSync();
|
||||
initHomeColumnScrollSync();
|
||||
initFsLightbox();
|
||||
initPageFull();
|
||||
// initVues()
|
||||
}
|
||||
|
||||
@@ -89,7 +90,7 @@ gsap.registerPlugin(ScrollTrigger);
|
||||
};
|
||||
|
||||
function initTitles() {
|
||||
const titles = document.querySelectorAll('#block-leshed-identitedusite>a, article.node-type-projet>header>h2, article.node-type-projet>.cols>.left>h2');
|
||||
const titles = document.querySelectorAll('#block-leshed-identitedusite>a, article.node-type-projet>header>h2, article.node-type-projet>.cols>.left>h2, article.node-type-projet.view-mode-full h2.node-title');
|
||||
for (const txt of titles) {
|
||||
txt.classList.add("variable-title");
|
||||
const splitted = Splitting({ target: txt, by: 'chars' });
|
||||
@@ -100,43 +101,6 @@ gsap.registerPlugin(ScrollTrigger);
|
||||
}
|
||||
}
|
||||
|
||||
const pageTitle = document.querySelector('article.node-type-projet.view-mode-full h2.node-title');
|
||||
console.log('pageTitle', pageTitle);
|
||||
|
||||
|
||||
if (pageTitle) {
|
||||
// needs requestAnimationFrame to get the real titleHeight after splitting
|
||||
requestAnimationFrame(() => {
|
||||
requestAnimationFrame(() => {
|
||||
|
||||
const initTitleH = pageTitle.offsetHeight;
|
||||
// console.log(`initTitleH: ${initTitleH}`);
|
||||
const titleScaleTarget = 0.4;
|
||||
const end = initTitleH - initTitleH * titleScaleTarget;
|
||||
// console.log(`end: ${end}`);
|
||||
|
||||
gsap_mm.add('(min-width: 768px)', () => {
|
||||
gsap.to(pageTitle, {
|
||||
scale: titleScaleTarget,
|
||||
y: end,
|
||||
ease: 'none',
|
||||
scrollTrigger: {
|
||||
scroller: scroller,
|
||||
start: 0,
|
||||
end: end, // scroll maximum du conteneur (robuste au resize)
|
||||
scrub: true,
|
||||
invalidateOnRefresh: true,
|
||||
},
|
||||
});
|
||||
})
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -301,8 +265,8 @@ gsap.registerPlugin(ScrollTrigger);
|
||||
* `main[role="main"]`, pas dans la fenêtre : GSAP utilise donc ce conteneur
|
||||
* comme `scroller`.
|
||||
*/
|
||||
function initColumnScrollSync() {
|
||||
console.log('initColumnScrollSync');
|
||||
function initHomeColumnScrollSync() {
|
||||
console.log('initHomeColumnScrollSync');
|
||||
|
||||
const firstColumn = document.querySelector('.layout--twocol-section--50-50 .layout__region--first');
|
||||
const secondColumn = document.querySelector('.layout--twocol-section--50-50 .layout__region--second');
|
||||
@@ -344,6 +308,89 @@ gsap.registerPlugin(ScrollTrigger);
|
||||
window.addEventListener('load', () => ScrollTrigger.refresh());
|
||||
}
|
||||
|
||||
function initPageFull(){
|
||||
console.log('initPageFull');
|
||||
|
||||
// PAGE TITLE SCALING DOWN
|
||||
const pageTitle = document.querySelector('article.node-type-projet.view-mode-full h2.node-title');
|
||||
console.log('pageTitle', pageTitle);
|
||||
|
||||
if (pageTitle) {
|
||||
// needs requestAnimationFrame to get the real titleHeight after splitting
|
||||
requestAnimationFrame(() => {
|
||||
requestAnimationFrame(() => {
|
||||
|
||||
const initTitleH = pageTitle.offsetHeight;
|
||||
// console.log(`initTitleH: ${initTitleH}`);
|
||||
const titleScaleTarget = 0.4;
|
||||
const end = initTitleH - initTitleH * titleScaleTarget;
|
||||
// console.log(`end: ${end}`);
|
||||
|
||||
gsap_mm.add('(min-width: 768px)', () => {
|
||||
gsap.to(pageTitle, {
|
||||
scale: titleScaleTarget,
|
||||
y: end,
|
||||
ease: 'none',
|
||||
scrollTrigger: {
|
||||
scroller: scroller,
|
||||
start: 0,
|
||||
end: end, // scroll maximum du conteneur (robuste au resize)
|
||||
scrub: true,
|
||||
invalidateOnRefresh: true,
|
||||
},
|
||||
});
|
||||
})
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// BLOCAGE DE LA COLONNE GAUCHE
|
||||
// La gauche défile normalement puis se fige (pin) quand le bas de son
|
||||
// contenu atteint le bas du viewport, pendant que la colonne droite (plus
|
||||
// haute) continue. Piloté en GSAP plutôt qu'en `position: sticky` (qui ne
|
||||
// prend pas dans ce contexte scroller custom + GSAP). `.cols` est en
|
||||
// `align-items: flex-start`, donc .col.left a bien la hauteur de son
|
||||
// contenu (sinon `bottom bottom` tomberait à la fin du scroll).
|
||||
const cols = document.querySelector('article.node-type-projet.view-mode-full .cols');
|
||||
const leftColumn = cols && cols.querySelector('.col.left');
|
||||
if (cols && leftColumn) {
|
||||
// Doit rester identique au scale-down du titre (voir plus haut).
|
||||
const titleScaleTarget = 0.4;
|
||||
// Seuil de scroll (px) après lequel la colonne gauche se fige :
|
||||
// - gauche plus haute que le viewport : quand son bas atteint le bas ;
|
||||
// - gauche plus courte : quand le scale-down du titre est terminé, pour
|
||||
// qu'elle remonte AVEC le titre puis s'arrête (sans disparaître en haut).
|
||||
const leftFreezeStart = () => {
|
||||
const overflow = leftColumn.offsetHeight - scroller.clientHeight;
|
||||
if (overflow > 0) return overflow;
|
||||
return pageTitle ? pageTitle.offsetHeight * (1 - titleScaleTarget) : 0;
|
||||
};
|
||||
|
||||
gsap_mm.add('(min-width: 768px)', () => {
|
||||
// On NE pin PAS (le pin sort l'élément du flux et casse le flex .cols).
|
||||
// On translate la colonne : défilement natif jusqu'à `leftFreezeStart`,
|
||||
// puis contre-translation 1:1 du scroll → elle se fige, tout en restant
|
||||
// un flex-item normal (la colonne droite garde sa place).
|
||||
gsap.fromTo(leftColumn,
|
||||
{ y: 0 },
|
||||
{
|
||||
y: () => (scroller.scrollHeight - scroller.clientHeight) - leftFreezeStart(),
|
||||
ease: 'none',
|
||||
scrollTrigger: {
|
||||
scroller: scroller,
|
||||
start: leftFreezeStart, // px de scroll où la gauche se fige
|
||||
end: 'max',
|
||||
scrub: true,
|
||||
invalidateOnRefresh: true,
|
||||
},
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
function initFsLightbox(){
|
||||
console.log('initFsLightbox');
|
||||
// console.log(window.FsLightbox);
|
||||
|
||||
@@ -205,6 +205,50 @@ header[role="banner"]{
|
||||
// }
|
||||
}
|
||||
|
||||
@mixin projetListe{
|
||||
>header{
|
||||
>h2{
|
||||
font-size: 5em;
|
||||
}
|
||||
}
|
||||
// only with images, title overlap the image
|
||||
div.field_artiste_s_invite_s.field-items.multiple{
|
||||
// display: flex;
|
||||
// flex-direction: row;
|
||||
.field-item{
|
||||
display: inline-block;
|
||||
&:not(:last-of-type):after{
|
||||
content: ", ";
|
||||
}
|
||||
}
|
||||
}
|
||||
&.has-image{
|
||||
>header{
|
||||
>h2{
|
||||
position: relative;
|
||||
max-height: 1em;
|
||||
overflow: visible;
|
||||
z-index: 10;
|
||||
// text-shadow: 0 0 10px #fff;
|
||||
// box-shadow: 0 0 15px #f00;
|
||||
// filter: drop-shadow(0 0 5px #fff);
|
||||
}
|
||||
div.field_images{
|
||||
position:relative;
|
||||
// width: 100%;
|
||||
z-index: 5;
|
||||
a{
|
||||
display:block;
|
||||
img{
|
||||
width:100%;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// _____ _____ __ ____ ___ _ ____
|
||||
// |_ _/ _ \ \ / / / ___/ _ \| | / ___|
|
||||
// | || | | \ \ /\ / / | | | | | | | \___ \
|
||||
@@ -228,40 +272,7 @@ div.layout.layout--twocol-section--50-50{
|
||||
margin-bottom: 2em;
|
||||
max-width: 100%;
|
||||
article.node-type-projet{
|
||||
>header{
|
||||
>h2{
|
||||
font-size: 5em;
|
||||
}
|
||||
}
|
||||
>div{
|
||||
// margin-top: 3em;
|
||||
}
|
||||
// only with images, title overlap the image
|
||||
&.has-image{
|
||||
>header{
|
||||
>h2{
|
||||
position: relative;
|
||||
max-height: 1em;
|
||||
overflow: visible;
|
||||
z-index: 10;
|
||||
// text-shadow: 0 0 10px #fff;
|
||||
// box-shadow: 0 0 15px #f00;
|
||||
// filter: drop-shadow(0 0 5px #fff);
|
||||
}
|
||||
div.field_images{
|
||||
position:relative;
|
||||
// width: 100%;
|
||||
z-index: 5;
|
||||
a{
|
||||
display:block;
|
||||
img{
|
||||
width:100%;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@include projetListe();
|
||||
}
|
||||
|
||||
}
|
||||
@@ -279,12 +290,15 @@ article.node-type-projet.view-mode-full{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: $colsgap;
|
||||
// column-gap: 2em;
|
||||
align-items: flex-start;
|
||||
div.col{
|
||||
flex:0 0 calc(50% - $colsgap / 2);
|
||||
max-width: calc(50% - $colsgap / 2);
|
||||
|
||||
&.left{
|
||||
z-index: 10;
|
||||
// padding-bottom: 5em;
|
||||
// box-sizing: border-box;
|
||||
>h2.node-title{
|
||||
position: relative;
|
||||
font-size: 12em;
|
||||
@@ -313,6 +327,11 @@ article.node-type-projet.view-mode-full{
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
>div.spacer{
|
||||
display: block;
|
||||
height: 5em;
|
||||
}
|
||||
}
|
||||
&.right{
|
||||
// Étire .field_images sur toute la hauteur de la colonne (= colonne la
|
||||
@@ -389,3 +408,29 @@ article.node-type-projet.view-mode-full{
|
||||
|
||||
}
|
||||
|
||||
// __ ___ _ _ _ ____ _ _
|
||||
// \ \ / (_) _____ _____ / \ _ __ ___| |__ (_)_ _____ ___ | _ \ _ __ ___ (_) ___| |_
|
||||
// \ \ / /| |/ _ \ \ /\ / / __| / _ \ | '__/ __| '_ \| \ \ / / _ \/ __| | |_) | '__/ _ \| |/ _ \ __|
|
||||
// \ V / | | __/\ V V /\__ \ / ___ \| | | (__| | | | |\ V / __/\__ \ | __/| | | (_) | | __/ |_
|
||||
// \_/ |_|\___| \_/\_/ |___/ /_/ \_\_| \___|_| |_|_| \_/ \___||___/ |_| |_| \___// |\___|\__|
|
||||
// |__/
|
||||
div.views-archives-projets{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 2em;
|
||||
gap: $colsgap;
|
||||
div.views-row{
|
||||
flex: 1 0 calc(25% - $colsgap);
|
||||
width: calc(25% - $colsgap);
|
||||
article.node-type-projet.view-mode-tableau_liste{
|
||||
|
||||
@include projetListe();
|
||||
>header{
|
||||
>h2{
|
||||
font-size: 3em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -84,13 +84,13 @@ function leshed_preprocess_node(&$variables) {
|
||||
|
||||
$variables["attributes"]['class'][] = "view-mode-{$variables['view_mode']}";
|
||||
|
||||
if ($variables['view_mode'] === "teaser") {
|
||||
// if ($variables['view_mode'] === "teaser") {
|
||||
/** @var \Drupal\file\Plugin\\Field\FieldType\FileFieldItemList $field_images */
|
||||
$field_images = $node->get('field_images');
|
||||
if (!$field_images->isEmpty()) {
|
||||
$variables["attributes"]['class'][] = "has-image";
|
||||
}
|
||||
}
|
||||
// }
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -70,6 +70,7 @@
|
||||
{{ label }}
|
||||
</h2>
|
||||
{{ content|without('field_images') }}
|
||||
<div class="spacer"></div>
|
||||
</div>
|
||||
<div class="col right">
|
||||
{{ content.field_images }}
|
||||
|
||||
@@ -0,0 +1,89 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Default theme implementation to display a node.
|
||||
*
|
||||
* Available variables:
|
||||
* - node: The node entity with limited access to object properties and methods.
|
||||
* Only method names starting with "get", "has", or "is" and a few common
|
||||
* methods such as "id", "label", and "bundle" are available. For example:
|
||||
* - node.getCreatedTime() will return the node creation timestamp.
|
||||
* - node.hasField('field_example') returns TRUE if the node bundle includes
|
||||
* field_example. (This does not indicate the presence of a value in this
|
||||
* field.)
|
||||
* - node.isPublished() will return whether the node is published or not.
|
||||
* Calling other methods, such as node.delete(), will result in an exception.
|
||||
* See \Drupal\node\Entity\Node for a full list of public properties and
|
||||
* methods for the node object.
|
||||
* - label: (optional) The title of the node.
|
||||
* - content: All node 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.
|
||||
* - author_picture: The node author user entity, rendered using the "compact"
|
||||
* view mode.
|
||||
* - metadata: Metadata for this node.
|
||||
* - date: (optional) Themed creation date field.
|
||||
* - author_name: (optional) Themed author name field.
|
||||
* - url: Direct URL of the current node.
|
||||
* - display_submitted: Whether submission information should be displayed.
|
||||
* - attributes: HTML attributes for the containing element.
|
||||
* The attributes.class element may contain one or more of the following
|
||||
* classes:
|
||||
* - node: The current template type (also known as a "theming hook").
|
||||
* - node--type-[type]: The current node type. For example, if the node is an
|
||||
* "Article" it would result in "node--type-article". Note that the machine
|
||||
* name will often be in a short form of the human readable label.
|
||||
* - node--view-mode-[view_mode]: The View Mode of the node; for example, a
|
||||
* teaser would result in: "node--view-mode-teaser", and
|
||||
* full: "node--view-mode-full".
|
||||
* The following are controlled through the node publishing options.
|
||||
* - node--promoted: Appears on nodes promoted to the front page.
|
||||
* - node--sticky: Appears on nodes ordered above other non-sticky nodes in
|
||||
* teaser listings.
|
||||
* - node--unpublished: Appears on unpublished nodes visible only to site
|
||||
* admins.
|
||||
* - title_attributes: Same as attributes, except applied to the main title
|
||||
* tag that appears in the template.
|
||||
* - content_attributes: Same as attributes, except applied to the main
|
||||
* content tag that appears in the template.
|
||||
* - author_attributes: Same as attributes, except applied to the author of
|
||||
* the node 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.
|
||||
* - view_mode: View mode; for example, "teaser" or "full".
|
||||
* - teaser: Flag for the teaser state. Will be true if view_mode is 'teaser'.
|
||||
* - page: Flag for the full page state. Will be true if view_mode is 'full'.
|
||||
*
|
||||
* @see template_preprocess_node()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
|
||||
{#
|
||||
{% if content.field_images.getvalue|length %}
|
||||
{% set attributes = attributes.addClass('has-image') %}
|
||||
{% endif %} #}
|
||||
|
||||
<article{{ attributes }}>
|
||||
|
||||
{# {{ title_prefix }} #}
|
||||
{# {% if label and not page %} #}
|
||||
<header>
|
||||
<h2{{ title_attributes }}>
|
||||
<a href="{{ url }}" rel="bookmark">{{ label }}</a>
|
||||
</h2>
|
||||
{{ content.field_images }}
|
||||
</header>
|
||||
{# {% endif %} #}
|
||||
{# {{ title_suffix }} #}
|
||||
|
||||
|
||||
<div{{ content_attributes }}>
|
||||
{{ content|without('field_images') }}
|
||||
</div>
|
||||
|
||||
</article>
|
||||
Reference in New Issue
Block a user