better home pres paragraph with formes

This commit is contained in:
2026-07-06 16:08:18 +02:00
parent 2bc69be75f
commit db25fcf531
4 changed files with 84 additions and 9 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -66,6 +66,7 @@ gsap.registerPlugin(ScrollTrigger, ScrollSmoother);
console.log('MathalloTheme init()')
initBurgerMenu();
initPartieFrontBackCardSwitch();
initHome();
initBgFormes();
initBgAnime();
initFootnotes();
@@ -109,6 +110,19 @@ gsap.registerPlugin(ScrollTrigger, ScrollSmoother);
})
}
function initHome(){
let ps = document.querySelectorAll('article[role="home-presentation"] p');
let used_n = [];
for (const p of ps) {
let n = Math.round(Math.random() * (_formesclasses.length -1));
while (used_n.includes(n)) {
n = Math.round(Math.random() * (_formesclasses.length -1));
}
used_n.push(n);
p.classList.add(`forme-${_formesclasses[n]}`);
}
}
async function initBgFormes(){
const container = document.querySelector('main[role="main"] > .layout-content > .wrapper');
// console.log('container', container);

View File

@@ -428,6 +428,7 @@ main[role="main"]{
}
// Article Static Home page teaser
&[role="home-presentation"]{
max-width: 65vw;
>h2{
color: $bleu_site;
text-decoration: none;
@@ -436,14 +437,65 @@ main[role="main"]{
font-weight: 500;
}
p{
font-size: 1.134em;
vertical-align: top;
display: inline-block;
max-width: 31%;
max-width: 29%;
margin-top: 2em;
box-sizing: border-box;
position: relative;
// z-index: 10;
margin-bottom: 6em;
&:not(:first-of-type){
margin-left: 2.5%;
margin-left: 6%;
}
&:before{
content: "";
display: block;
position: absolute;
// background-color: red;
// border: 1px solid red ;
background-size: contain;
$form_wh:10em;
width:$form_wh; height:$form_wh;
bottom:-$form_wh * 0.9; right:0;
z-index: -1;
}
&.forme-pyramide:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/pyramide.svg');
}
&.forme-prct:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/prct.svg');
}
&.forme-pi:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/pi.svg');
}
&.forme-infinite:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/infinite.svg');
}
&.forme-supeg:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/supeg.svg');
}
&.forme-cone:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/cone.svg');
}
&.forme-croissant:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/croissant.svg');
}
&.forme-cube:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/cube.svg');
}
&.forme-diamant:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/diamant.svg');
}
&.forme-cylindre:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/cylindre.svg');
}
}
}
@@ -587,8 +639,17 @@ main[role="main"]{
}
} // partie-principes-pratique
// HOME
// _ _ ___ __ __ _____
// | | | |/ _ \| \/ | ____|
// | |_| | | | | |\/| | _|
// | _ | |_| | | | | |___
// |_| |_|\___/|_| |_|_____|
article.node-type-static[role="home-presentation"]{
}
div.views-home-chapitres{
// display: flex;