better home presentation
This commit is contained in:
+1
-1
File diff suppressed because one or more lines are too long
@@ -426,6 +426,7 @@ main[role="main"]{
|
|||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Article Static Home page teaser
|
// Article Static Home page teaser
|
||||||
&[role="home-presentation"]{
|
&[role="home-presentation"]{
|
||||||
max-width: 65vw;
|
max-width: 65vw;
|
||||||
@@ -439,65 +440,110 @@ main[role="main"]{
|
|||||||
p{
|
p{
|
||||||
font-size: 1.134em;
|
font-size: 1.134em;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
display: inline-block;
|
|
||||||
max-width: 29%;
|
|
||||||
margin-top: 2em;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
position: relative;
|
position: relative;
|
||||||
|
box-sizing: border-box;
|
||||||
// z-index: 10;
|
// 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){
|
&:not(:first-of-type){
|
||||||
margin-left: 6%;
|
margin-left: 6%;
|
||||||
}
|
}
|
||||||
&:before{
|
|
||||||
content: "";
|
|
||||||
display: block;
|
transform-origin: top left;
|
||||||
position: absolute;
|
&, &:before{
|
||||||
// background-color: red;
|
transition: all 0.6s ease-in-out;
|
||||||
// border: 1px solid red ;
|
}
|
||||||
background-size: contain;
|
|
||||||
$form_wh:10em;
|
&:hover{
|
||||||
width:$form_wh; height:$form_wh;
|
// color: $bleu_site;
|
||||||
bottom:-$form_wh * 0.9; right:0;
|
transform: scale(1.1) translateY(-5px);
|
||||||
z-index: -1;
|
&: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{
|
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{
|
div.views-home-chapitres{
|
||||||
// display: flex;
|
// display: flex;
|
||||||
|
|||||||
@@ -12,9 +12,9 @@ vitehmr:
|
|||||||
js:
|
js:
|
||||||
http://localhost:5173/@vite/client:
|
http://localhost:5173/@vite/client:
|
||||||
type: external
|
type: external
|
||||||
attributes:
|
attributes:
|
||||||
type: module
|
type: module
|
||||||
http://localhost:5173/assets/js/main.js:
|
http://localhost:5173/assets/js/main.js:
|
||||||
type: external
|
type: external
|
||||||
attributes:
|
attributes:
|
||||||
type: module
|
type: module
|
||||||
|
|||||||
@@ -6,6 +6,7 @@ import { fileURLToPath, URL } from 'node:url'
|
|||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
plugins: [vue()],
|
plugins: [vue()],
|
||||||
server: {
|
server: {
|
||||||
|
|
||||||
hmr: {
|
hmr: {
|
||||||
host: 'localhost',
|
host: 'localhost',
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user