bachir/d9-eql
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

border color id protagoniste

Browse Source
This commit is contained in:
ouidade
2022-01-20 15:25:09 +01:00
parent e2bf468ed9
commit c565e1a188
6 changed files with 190 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/eql/css-compiled/styles.css
+20 -7
View File
@@ -1909,7 +1909,6 @@ a {
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 .view-content .views-row {
width: 50%; }
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 .view-content .views-row .node-type-offre_de_service {
border: 2px solid #009ee3;
padding: 1rem;
height: fit-content;
margin-bottom: 1rem;
@@ -1978,11 +1977,21 @@ a {
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 .view-content .views-row .node-type-offre_de_service div:first-of-type .field--name-field-date-de-proposition::after {
content: url("../images/pictos/noun_Arrow_3771902.svg");
align-self: flex-end; }
@media (max-width: 810px) {
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 .view-content {
flex-direction: column; }
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 .view-content .views-row .type-de-protagoniste-5 {
border: 2px solid #ff000f; }
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 .view-content .views-row .type-de-protagoniste-6 {
border: 2px solid #a01a27; }
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 .view-content .views-row .type-de-protagoniste-7 {
border: 2px solid #c7d74a; }
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 .view-content .views-row .type-de-protagoniste-8 {
border: 2px solid #ff6453; }
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 .view-content .views-row .type-de-protagoniste-8 .type-de-protagoniste-9 {
border: 2px solid #6f6d7d; }
@media (max-width: 810px) {
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 .view-content .views-row {
width: 100%; } }
flex-direction: column; }
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 .view-content .views-row .views-row {
width: 100%; } }
.page-node-type-offre-de-service {
background: url("../images/pictos/carre-contour-bleu-offre.svg");
@@ -2844,16 +2853,20 @@ a {
display: flex;
flex-direction: column;
display: none;
min-width: 100px;
justify-content: space-between;
background: white; }
#header-top .region-header-top-left ul ul .is-active {
color: #009ee3; }
#header-top .region-header-top-left ul li {
display: flex;
flex-direction: column;
justify-content: space-between;
background-color: white;
padding-bottom: 0.8rem;
min-width: 30%;
align-items: center; }
max-width: inherit;
align-items: center;
padding-left: 0; }
#header-top .region-header-top-left ul li .menuOpen {
display: flex; }
#header-top .region-header-top-left ul li a {
web/themes/custom/eql/eql.theme
+12
View File
@@ -15,8 +15,10 @@ function eql_preprocess_html(&$variables) {
$variables['attributes']['class'][] = 'node-type-' . $node->bundle();
$variables['attributes']['class'][] = 'node-id-' . $node->id();
}
}
function eql_preprocess_node(&$variables){
$node = &$variables['node'];
$variables['attributes']['class'][] = 'node-type-' . $node->gettype();
@@ -24,11 +26,21 @@ function eql_preprocess_node(&$variables){
$actu_type = $node->get('field_actu_type')->getString();
$variables['attributes']['class'][] = 'actu-type-' . $actu_type;
}
if($node->gettype() == "offre_de_service") {
$type_protagoniste = $node->get('field_type_de_protagoniste')->getString();
$variables['attributes']['class'][] = 'type-de-protagoniste-' . $type_protagoniste;
}
}
///////////////////////////////////////////////////
///////////////////////////////////////////////////
// counter pour id
// function eql_preprocess_field(&$variables) {
web/themes/custom/eql/scripts/main.js
+34
View File
@@ -129,7 +129,41 @@ jQuery(function($) {
});
///////////////////////////////////////////
// border box change color when protagoniste change
// var protagoniste = document.getElementsByClassName("type-de-protagoniste-7");
// console.log(protagoniste);
// ressource.classList.add('opened');
/**
* Return the term id for a given term name.
*/
// function _get_tid_from_term_name($term_name) {
// $vocabulary = 'Type de protagoniste';
// $arr_terms = taxonomy_get_term_by_name($term_name, $vocabulary);
// if (!empty($arr_terms)) {
// $arr_terms = array_values($arr_terms);
// $tid = $arr_terms[0]->tid;
// }
// else {
// $vobj = taxonomy_vocabulary_machine_name_load($vocabulary);
// $term = new stdClass();
// $term->name = $term_name;
// $term->vid = $vobj->vid;
// taxonomy_term_save($term);
// $tid = $term->tid;
// }
// return $tid;
// }
// function getVal() {
// const val = document. querySelector('input').value;
// log(val);
// }
// /////////////////
//// ancre dans texte
// document.querySelector('.paragraph--view-mode--textes-toc').click( function() {
web/themes/custom/eql/scss/pages/_offresdeservices.scss
+21 -11
View File
@@ -107,16 +107,18 @@
.views-row{
width: 50%;
.node-type-offre_de_service{
// display: flex;
// display: flex;
// flex-direction: column;
border: 2px solid $blue-light;
// border: 2px solid rgb(199, 215, 74);
// border: 2px solid $blue-light;
padding: 1rem;
height: fit-content;
margin-bottom: 1rem;
background-color: $white;
margin-right: 1rem;
// height: 200px;
div:first-of-type{
display: grid;
grid-template-columns: 1fr 1fr 1fr;
@@ -202,8 +204,21 @@
}
}
}
.type-de-protagoniste-5{
border: 2px solid rgb(255, 0, 15);
}
.type-de-protagoniste-6{
border: 2px solid rgb(160, 26, 39);
}
.type-de-protagoniste-7{
border: 2px solid rgb(199, 215, 74);
}
.type-de-protagoniste-8{
border: 2px solid rgb(255, 100, 83);
.type-de-protagoniste-9{
border: 2px solid rgb(111, 109, 125);
}
}
@media (max-width: 810px){
@@ -214,15 +229,10 @@
}
}
}
}
}
}
}
}
}
}
web/themes/custom/eql/scss/partials/_header.scss
+8 -4
View File
@@ -75,19 +75,21 @@
display: flex;
flex-direction: row;
justify-content: space-between;
// margin-right: 20px;
width: 100%;
padding: 1rem;
.is-active{
color:$blue-light;
}
ul{
display: flex;
flex-direction: column;
display: none;
min-width: 100px;
justify-content: space-between;
background:$white;
// padding-inline-start: 0;
.is-active{
color:$blue-light;
}
@@ -95,10 +97,12 @@
li{
display: flex;
flex-direction: column;
justify-content: space-between;
background-color: $white;
padding-bottom: 0.8rem;
min-width: 30%;
max-width: inherit;
align-items: center;
padding-left: 0;
.menuOpen{
display: flex;
}
web/themes/custom/eql/templates/field--field-type-de-protagoniste.html.twig
+95
View File
@@ -0,0 +1,95 @@
{#
/**
* @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()
*/
#}
{%
set classes = [
'field',
'field--name-' ~ field_name|clean_class,
'field--type-' ~ field_type|clean_class,
'field--label-' ~ label_display,
label_display == 'inline' ? 'clearfix',
'entity--type-' ~ entity_type|clean_class,
]
%}
{%
set title_classes = [
'field__label',
label_display == 'visually_hidden' ? 'visually-hidden',
]
%}
{%
set protagoniste = 'protagoniste-id--' ~ taxonomy_term.id()
%}
{% if label_hidden %}
{% if multiple %}
<div{{ attributes.addClass(classes, 'field__items')}}>
{% for item in items %}
<div{{ item.attributes.addClass('field__item', protagoniste) }}>{{ item.content }}</div>
{% endfor %}
</div>
{% else %}
{% for item in items %}
<div {{ attributes.addClass(classes, 'field__item', protagoniste) }}>{{ item.content }}</div>
{% endfor %}
{% endif %}
{% else %}
<div{{ attributes.addClass(classes) }}>
<div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
{% if multiple %}
<div class="field__items">
{% endif %}
{% for item in items %}
<div{{ item.attributes.addClass('field__item') }}>{{ item.content }}</div>
{% endfor %}
{% if multiple %}
</div>
{% endif %}
</div>
{% endif %}