bachir/drupal-mathallo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

better home presentation

Browse Source
This commit is contained in:
bachir
2026-09-14 09:41:06 +02:00
parent 3b1013bc8f
commit dd5c330e98
4 changed files with 107 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web_main/themes/custom/mathallo/assets/dist/main.css
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
web_main/themes/custom/mathallo/assets/scss/main.scss
+102 -53
View File
@@ -426,6 +426,7 @@ main[role="main"]{
}
}
// Article Static Home page teaser
&[role="home-presentation"]{
max-width: 65vw;
@@ -439,65 +440,110 @@ main[role="main"]{
p{
font-size: 1.134em;
vertical-align: top;
display: inline-block;
max-width: 29%;
margin-top: 2em;
box-sizing: border-box;
position: relative;
box-sizing: border-box;
// z-index: 10;
margin-bottom: 6em;
@media (min-width: 1080px){
display: inline-block;
max-width: 28%;
// min-width: 15em;
margin-top: 2em;
margin-bottom: 7em;
&:not(:first-of-type){
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;
&:not(:first-of-type){
margin-left: 6%;
}
transform-origin: top left;
&, &:before{
transition: all 0.6s ease-in-out;
}
&:hover{
// color: $bleu_site;
transform: scale(1.1) translateY(-5px);
&:before{
transform: scale(0.8) translateY(-20px) rotate(-15deg);
}
}
&:before{
content: "";
display: block;
position: absolute;
$form_wh:8em;
width:$form_wh; height:$form_wh;
bottom:-$form_wh * 1.1; right:$form_wh / 4;
z-index: -1;
transform-origin: center left;
background-size: contain;
// background-color: $bleu_site;
// border: 1px solid red ;
// mask-size: contain;
// mask-mode: luminance;
}
&.forme-pyramide:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/pyramide.svg');
// content: url('/themes/custom/mathallo/assets/img/formes/pyramide.svg');
// mask-image: url('/themes/custom/mathallo/assets/img/formes/pyramide.svg');
}
&.forme-prct:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/prct.svg');
// content: url('/themes/custom/mathallo/assets/img/formes/prct.svg');
// mask-image: url('/themes/custom/mathallo/assets/img/formes/prct.svg');
}
&.forme-pi:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/pi.svg');
// content: url('/themes/custom/mathallo/assets/img/formes/pi.svg');
// mask-image: url('/themes/custom/mathallo/assets/img/formes/pi.svg');
}
&.forme-infinite:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/infinite.svg');
// content: url('/themes/custom/mathallo/assets/img/formes/infinite.svg');
// mask-image: url('/themes/custom/mathallo/assets/img/formes/infinite.svg');
}
&.forme-supeg:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/supeg.svg');
// content: url('/themes/custom/mathallo/assets/img/formes/supeg.svg');
// mask-image: url('/themes/custom/mathallo/assets/img/formes/supeg.svg');
}
&.forme-cone:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/cone.svg');
// content: url('/themes/custom/mathallo/assets/img/formes/cone.svg');
// mask-image: url('/themes/custom/mathallo/assets/img/formes/cone.svg');
}
&.forme-croissant:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/croissant.svg');
// content: url('/themes/custom/mathallo/assets/img/formes/croissant.svg');
// mask-image: url('/themes/custom/mathallo/assets/img/formes/croissant.svg');
}
&.forme-cube:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/cube.svg');
// content: url('/themes/custom/mathallo/assets/img/formes/cube.svg');
// mask-image: url('/themes/custom/mathallo/assets/img/formes/cube.svg');
}
&.forme-diamant:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/diamant.svg');
// content: url('/themes/custom/mathallo/assets/img/formes/diamant.svg');
// mask-image: url('/themes/custom/mathallo/assets/img/formes/diamant.svg');
}
&.forme-cylindre:before{
background-image: url('/themes/custom/mathallo/assets/img/formes/cylindre.svg');
// content: url('/themes/custom/mathallo/assets/img/formes/cylindre.svg');
// mask-image: url('/themes/custom/mathallo/assets/img/formes/cylindre.svg');
}
}
&.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');
}
}
h4 a:hover{
color: $rose;
}
}
}
article.node-type-chapitre{
@@ -678,9 +724,12 @@ main[role="main"]{
// |_| |_|\___/|_| |_|_____|
article.node-type-static[role="home-presentation"]{
// article.node-type-static[role="home-presentation"]{
// div.body{
}
// }
// }
div.views-home-chapitres{
// display: flex;
web_main/themes/custom/mathallo/vite.config.js
+1
View File
@@ -6,6 +6,7 @@ import { fileURLToPath, URL } from 'node:url'
export default defineConfig({
plugins: [vue()],
server: {
hmr: {
host: 'localhost',
},