This commit is contained in:
2023-11-13 14:14:58 +01:00
parent 5e7eee9100
commit 454f18c2c2
21 changed files with 759 additions and 2230 deletions
@@ -0,0 +1,28 @@
/*rorschach*/
/*print*/
.field__label {
display: none; }
table {
border-collapse: collapse; }
table thead th {
border: 1px solid #333;
text-align: center;
font-weight: bold;
padding: 1rem;
background-color: grey; }
table tbody td {
border: 1px solid #333;
text-align: center;
padding: 1rem;
background-color: white; }
table .field__label {
display: none; }
body {
margin: 3rem; }
@media print {
@page {
margin: 5mm !important;
size: landscape !important; } }
@@ -1,4 +1,4 @@
/*eql*/
/*rorschach*/
/*components*/
.quote {
font-weight: 700;
@@ -17,7 +17,11 @@ table {
table tbody td {
border: 1px solid #333;
text-align: center;
padding: 1rem; }
padding: 1rem;
background-color: white; }
.display-none {
display: none; }
#paragraph-id--226 tbody td {
text-align: start;
@@ -835,6 +839,9 @@ a {
.field--name-field-subheading {
font-size: 1rem; }
.display-none {
display: none; }
.node-book-edit-form {
width: 80%;
border-top-style: solid;
File diff suppressed because it is too large Load Diff
+1 -1
View File
@@ -17,7 +17,7 @@
"node-sass": "^9.0.0",
"sass": "^1.63.4"
},
"browserslist": "last 4 versions",
"browerslist": "last 4 versions",
"dependencies": {
"nodejs": "^0.0.0"
},
@@ -2,6 +2,7 @@ global-css:
css:
theme:
css-compiled/styles.css: {}
css-compiled/print.css: {}
# css-prefixed/styles.css: {}
global-js:
js:
+1 -2
View File
@@ -39,8 +39,7 @@ function rorschach_preprocess_field(&$variables) {
// }
if ($field_name == 'block-pagetitle-2') {
$depth_title = $node->get('block-pagetitle-2')->getString();
$variables['classes_array'][] = "menu-depth-" . $depth_title;
$variables['classes_array'][] = 'menu-depth-' . $depth_title;
}
}
+36 -18
View File
@@ -5,36 +5,54 @@ console.log('salut');
///
// doit chercher un p dans td dans tbody dans table dans .paragraph--type--text qui a la class .rowspan et setAttribut a son parent td
// var cellRowspan = document.querySelector('p.rowspan').parentElement;
// cellRowspan.setAttribute('rowspan', '4');
var cellRowspan = document.querySelector('p.rowspan').parentElement;
cellRowspan.setAttribute('rowspan', '4');
// // ok va chercher tous les éléments p.cell-display-none (child)
// const pDisplayNone = document.querySelectorAll('p.cell-display-none');
// console.log(pDisplayNone);
const pDisplayNone = document.querySelectorAll('p.cell-display-none');
console.log(pDisplayNone);
// // ok va chercher un element td (parent)
// var tdDisplayNone = document.querySelector('p.cell-display-none').parentElement;
// console.log(tdDisplayNone);
var tdDisplayNone = document.querySelector('p.cell-display-none').parentElement;
console.log(tdDisplayNone);
// /// et lui appliquer une class.
// tdDisplayNone.classList.add('display-none');
tdDisplayNone.classList.add('display-none');
///// comment aller chercher TOUS les éléments td ? //////
let p = document.querySelectorAll('p.cell-display-none');
//// en repassant par element parent ? puis
// let tbody = document.querySelectorAll('tbody');
// console.log(tbody);
// let pDisplayNone = document.getElementsByClassNameAll('.cell-display-none');
// console.log(pDisplayNone);
// let td = pDisplayNone.parentElement;
// console.log(td);
// td.classList.add('display-none');
// tbody.forEach(pDisplayNone => {
// let td = pDisplayNone.childNodes;
// console.log(td);
// td.classList.add('display-none');
// });
let pDisplayNone = document.querySelector('p.cell-display-none');
console.log(pDisplayNone);
let tdparent = [];
while(pDisplayNone.parentNode.closest('td')){
tdparent.push(pDisplayNone.parentNode.closest('td'));
pDisplayNone = pDisplayNone.parentNode.closest('td');
}
console.log(tdparent);
// // let tdparent = [pDisplayNone.parentNode.closest()];
// // while(pDisplayNone.parentNode){
// // tdparent.push(td);
// // pDisplayNone = pDisplayNone.parentNode;
// // }
/// pour chaque élément de array pDisplayNone ( NodeList ),
@@ -0,0 +1,23 @@
console.log('salut');
// fusion cellules dans tableau
///
// doit chercher un p dans td dans tbody dans table dans .paragraph--type--text qui a la class .rowspan et setAttribut a son parent td
var cellRowspan = document.querySelector('p.rowspan').parentElement;
cellRowspan.setAttribute('rowspan', '4');
// // ok va chercher tous les éléments p.cell-display-none (child)
const pDisplayNone = document.querySelectorAll('p.cell-display-none');
console.log(pDisplayNone);
// // ok va chercher un element td (parent)
var tdDisplayNone = document.querySelector('p.cell-display-none').parentElement;
console.log(tdDisplayNone);
// /// et lui appliquer une class.
tdDisplayNone.classList.add('display-none');
+172
View File
@@ -0,0 +1,172 @@
console.log('salut');
// fusion cellules dans tableau
///
// doit chercher un p dans td dans tbody dans table dans .paragraph--type--text qui a la class .rowspan et setAttribut a son parent td
var cellRowspan = document.querySelector('p.rowspan').parentElement;
console.log(cellRowspan);
cellRowspan.setAttribute('rowspan', '4');
// // ok va chercher tous les éléments p.cell-display-none (child)
// const pDisplayNone = document.querySelectorAll('p.cell-display-none');
// console.log(pDisplayNone);
// // ok va chercher un element td (parent)
// var tdDisplayNone = document.querySelector('p.cell-display-none').parentElement;
// console.log(tdDisplayNone);
// /// et lui appliquer une class.
// tdDisplayNone.classList.add('display-none');
///// comment aller chercher TOUS les éléments td ? //////
// const pDisplayNone = document.querySelector('p.cell-display-none');
// console.log(pDisplayNone.closest('.field__item'));
// let td = pDisplayNone.parentNode;
// const tdparent = pDisplayNone.closest('td');
// // while(pDisplayNone.parentNode){
// // tdparent.push(td);
// // pDisplayNone = pDisplayNone.parentNode;
// // }
// console.log(tdparent);
/// pour chaque élément de array pDisplayNone ( NodeList ),
// pDisplayNone.forEach((element) =>document.querySelectorAll('td'));
/// aller chercher le parent td
/// et lui appliquer une class.
// faut faire un array de td avant de faire un for each
// let td = new Array(pDisplayNone);
// console.log(td);
// const child = document.getElementById('child');
// const parentWithClass = child.closest('.parent');
// console.log(parentWithClass); // 👉️ div.parent
// const parent = document.getElementById("parent");
// let childNodes = parent.childNodes;
// console.log(childNodes.length); // let's assume "2"
// parent.appendChild(document.createElement("div"));
// console.log(childNodes.length); // outputs "3"
// function displayNone(){
// for (let i = 0; i < cellsDisplayNone.lenght; i++ ){
// const cellDisplayNone = cellsDisplayNone.parentElement[i]
// // let cellDisplayNone = this.parentElement.getElementsByClassName("cell-display-none");
// // console.log(cellDisplayNone);
// }
// };
// cellDisplayNone.classList.add('display-none');
// cellDisplayNone.style.display ="none";
// for (let i = 0; i < cellDisplayNone.lenght; i++ ){
// cellDisplayNone.style.display ="none";
// }
//////////////
// var cellsRowspan = document.getElementsByClassName("rowspan");
// var cellsDisplayNone = document.getElementsByClassName("cell-display-none");
// function rowspan(){
// // for (let i = 0; i < cellsRowspan.length; i++){
// // cellsRowspan[i].
// // }
// let cellRowspan = this.parentNode.querySelector(".rowspan");
// cellRowspan.setAttribute('rowspan', '4');
// }
// function tableOne(){
// var table1cell1 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
// var table1cell2 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
// var table1cell3 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
// var table1cell4 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
// table1cell1.setAttribute('rowspan', '4');
// table1cell2.style.display ="none";
// table1cell3.style.display ="none";
// table1cell4.style.display ="none";
// }
// // function tableTwo(){
// // var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
// // var table2cell2 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
// // var table2cell3 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
// // var table2cell4 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
// // table2cell1.setAttribute('rowspan', '4');
// // table2cell2.style.display ="none";
// // table2cell3.style.display ="none";
// // table2cell4.style.display ="none";
// // }
// tableOne();
// tableTwo();
// var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
// var table2cell2 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
// var table2cell3 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
// var table2cell4 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
// table2cell1.setAttribute('rowspan', '4');
// table2cell2.style.display ="none";
// table2cell3.style.display ="none";
// table2cell4.style.display ="none";
// const table = document.getElementByClass("paragraph--type--text");
// console.log(hello);
// for (const child of table.children) {
// console.log(child.tagName);
// }
// const paragraph = document.getElementsByClassName("paragraph--type--text");
// for (const table of paragraph.children){
// table.addClass("rowspan");
// }
@@ -20,12 +20,19 @@ table{
border: 1px solid #333;
text-align: center;
padding: 1rem;
background-color: red;
background-color: white;
}
}
.display-none{
display: none;
}
// :host(p.cell-display-none){
// display: none;
// }
#paragraph-id--226{
tbody {
td{
@@ -0,0 +1,8 @@
/*rorschach*/
/*print*/
@import "print/_print_global";
@import "print/_tables";
@import "print/_layout";
@@ -0,0 +1,13 @@
body{
margin: 3rem;
}
@media print {
@page {
margin: 5mm !important;
size: landscape !important;
}
}
@@ -0,0 +1,6 @@
.field__label{
display: none;
}
@@ -0,0 +1,22 @@
table{
border-collapse: collapse;
thead th{
border: 1px solid #333;
text-align: center;
font-weight: bold;
padding: 1rem;
background-color: grey;
}
tbody td {
border: 1px solid #333;
text-align: center;
padding: 1rem;
background-color: white;
}
.field__label{
display:none;
}
}
+4 -1
View File
@@ -1,4 +1,4 @@
/*eql*/
/*rorschach*/
/*components*/
@import "components/_quotes";
@@ -38,3 +38,6 @@
@@ -30,6 +30,8 @@
'block',
'block-' ~ configuration.provider|clean_class,
'block-' ~ plugin_id|clean_class,
]
%}
<div{{ attributes.addClass(classes) }}>
@@ -0,0 +1,48 @@
{#
/**
* @file
* Default theme implementation for printed version of book outline.
*
* Available variables:
* - title: Top level node title.
* - head: Header tags.
* - language: Language object.
* - language_rtl: A flag indicating whether the current display language is a
* right to left language.
* - base_url: URL to the home page.
* - contents: Nodes within the current outline rendered through
* book-node-export-html.html.twig.
*
* @see template_preprocess_book_export_html()
*
* @ingroup themeable
*/
#}
<!DOCTYPE html>
<html{{ html_attributes }}>
<head>
<title>{{ title }}</title>
{{ page.head }}
<base href="{{ base_url }}" />
<link type="text/css" rel="stylesheet" href="/themes/custom/rorschach/css-compiled/print.css" />
</head>
<body>
{#
The given node is embedded to its absolute depth in a top level section.
For example, a child node with depth 2 in the hierarchy is contained in
(otherwise empty) div elements corresponding to depth 0 and depth 1. This
is intended to support WYSIWYG output - e.g., level 3 sections always look
like level 3 sections, no matter their depth relative to the node selected
to be exported as printer-friendly HTML.
#}
{% if depth > 1 %}{% for i in 1..depth-1 %}
<div>
{% endfor %}{% endif %}
{{ contents }}
{% if depth > 1 %}{% for i in 1..depth-1 %}
</div>
{% endfor %}{% endif %}
</body>
</html>
@@ -17,7 +17,7 @@
#}
<article>
<h1>{{ title }}</h1>
{{ depth }}
{# {{ depth }} #}
{{ content }}
{{ children }}
</article>
@@ -54,13 +54,6 @@
]
%}
{%
set ouid_classes = [
'first_part_home',
]
%}
{% if label_hidden %}
@@ -0,0 +1,52 @@
{#
/**
* @file
* Theme override to display a block.
*
* 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) }}>
{{ title_prefix }}
{% if label %}
{# <video autoplay muted loop id="myVideo">
<source src="rain.mp4" type="video/mp4">
</video> #}
<span><h2{{ title_attributes }}>{{ label }}</h2></span>
{% endif %}
{{ title_suffix }}
{% block content %}
{{ content }}
{% endblock %}
</div>
@@ -0,0 +1,21 @@
{#
/**
* @file
* Default theme implementation for page titles.
*
* Available variables:
* - title_attributes: HTML attributes for the page title element.
* - title_prefix: Additional output populated by modules, intended to be
* displayed in front of the main title tag that appears in the template.
* - title: The page title, for use in the actual content.
* - title_suffix: Additional output populated by modules, intended to be
* displayed after the main title tag that appears in the template.
*
* @ingroup themeable
*/
#}
{{ title_prefix }}
{% if title %}
<h1{{ title_attributes }}>{{ title }}</h1>
{% endif %}
{{ title_suffix }}