taille fleches diap et taille fixe vignette

This commit is contained in:
2025-09-11 10:46:12 +02:00
parent 0ddea87d28
commit 6de187261b
7 changed files with 125 additions and 10 deletions
+17 -5
View File
@@ -1150,10 +1150,10 @@ aside.layout-sidebar-second footer.view-footer :hover {
right: 200px;
}
.slick-prev:before {
content: url("../../dist/images/grandes_fleches_prev.svg");
content: url("../../dist/images/moyennes_fleches_prev.svg");
}
[dir=rtl] .slick-prev:before {
content: url("../../dist/images/grandes_fleches_prev.svg");
content: url("../../dist/images/moyennes_fleches_prev.svg");
}
.slick-next {
@@ -1164,10 +1164,10 @@ aside.layout-sidebar-second footer.view-footer :hover {
right: auto;
}
.slick-next:before {
content: url("../../dist/images/grandes_fleches_next.svg");
content: url("../../dist/images/moyennes_fleches_next.svg");
}
[dir=rtl] .slick-next:before {
content: url("../../dist/images/grandes_fleches_next.svg");
content: url("../../dist/images/moyennes_fleches_next.svg");
}
/* Dots */
@@ -1332,6 +1332,8 @@ aside.layout-sidebar-second footer.view-footer :hover {
background-image: radial-gradient(white, transparent);
border-radius: 50%;
padding: 0.8rem;
padding-bottom: 1.8rem;
padding-top: 1.8rem;
width: 120px;
height: auto;
top: 50%;
@@ -2172,6 +2174,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
align-items: baseline;
justify-content: space-between;
}
@media (max-width: 1200px) {
.page-sitespilotes .view-display-id-page_1 {
justify-content: flex-start;
}
}
.page-sitespilotes .view-display-id-page_1 article {
padding-bottom: 0.7rem;
}
@@ -2179,6 +2186,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
width: 28%;
padding: 1rem;
}
@media (max-width: 1200px) {
.page-sitespilotes .view-display-id-page_1 .views-row {
width: 40%;
}
}
.page-sitespilotes .view-display-id-page_1 .views-row:hover {
transform: scale(1.05);
transition: 0.3s transform ease, 0.3s box-shadow ease;
@@ -2199,7 +2211,7 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
.page-sitespilotes .view-display-id-page_1 .views-row .node-type-site .entete_site .image-site .field--name-field-image img {
width: 100%;
object-fit: cover;
height: fit-content;
max-height: 200px;
}
.page-sitespilotes .view-display-id-page_1 .views-row .node-type-site .entete_site .infos-content-site {
background-color: rgb(255, 255, 255);
@@ -0,0 +1,47 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="8.4272375mm"
height="17.259748mm"
viewBox="0 0 8.427237 17.259749"
version="1.1"
id="svg1"
sodipodi:docname="grandes_fleches_prev.svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm">
<inkscape:page
x="2.5850003e-15"
y="0"
width="8.4272366"
height="17.259748"
id="page2"
margin="0"
bleed="0" />
</sodipodi:namedview>
<defs
id="defs1" />
<g
id="layer1"
transform="matrix(0.49488659,0,0,0.49488659,-67.815583,-66.980702)"
inkscape:export-filename="moyennes_fleches_prev.svg"
inkscape:export-xdpi="300"
inkscape:export-ydpi="300">
<path
style="color:#000000;fill:#000000;stroke-width:0.488961;stroke-linecap:round;stroke-linejoin:round;-inkscape-stroke:none"
d="m 137.65113,135.34577 a 0.48896116,0.48896116 0 0 0 -0.34953,0.13274 0.48896116,0.48896116 0 0 0 -0.02,0.69142 l 15.61906,16.54541 -15.73557,16.68294 a 0.48896116,0.48896116 0 0 0 0.021,0.69046 0.48896116,0.48896116 0 0 0 0.69046,-0.02 l 16.05168,-17.01814 a 0.48901006,0.48901006 0 0 0 0,-0.67042 l -15.93517,-16.88156 a 0.48896116,0.48896116 0 0 0 -0.34189,-0.15281 z"
id="path1" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

@@ -0,0 +1,44 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="8.4272375mm"
height="17.259748mm"
viewBox="0 0 8.427237 17.259749"
version="1.1"
id="svg1"
sodipodi:docname="grandes_fleches_prev.svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm">
<inkscape:page
x="2.5850003e-15"
y="0"
width="8.4272366"
height="17.259748"
id="page2"
margin="0"
bleed="0" />
</sodipodi:namedview>
<defs
id="defs1" />
<g
id="layer1"
transform="matrix(-0.49488659,0,0,0.49488659,76.242822,-66.980702)">
<path
style="color:#000000;fill:#000000;stroke-width:0.488961;stroke-linecap:round;stroke-linejoin:round;-inkscape-stroke:none"
d="m 137.65113,135.34577 a 0.48896116,0.48896116 0 0 0 -0.34953,0.13274 0.48896116,0.48896116 0 0 0 -0.02,0.69142 l 15.61906,16.54541 -15.73557,16.68294 a 0.48896116,0.48896116 0 0 0 0.021,0.69046 0.48896116,0.48896116 0 0 0 0.69046,-0.02 l 16.05168,-17.01814 a 0.48901006,0.48901006 0 0 0 0,-0.67042 l -15.93517,-16.88156 a 0.48896116,0.48896116 0 0 0 -0.34189,-0.15281 z"
id="path1" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

@@ -17,12 +17,18 @@
flex-wrap: wrap;
align-items: baseline;
justify-content: space-between;
@media (max-width:1200px){
justify-content: flex-start;
}
article{
padding-bottom: 0.7rem;
}
.views-row{
width: 28%;
padding: 1rem;
@media (max-width:1200px){
width: 40%;
}
&:hover{
transform: scale(1.05);
transition: 0.3s transform ease, 0.3s box-shadow ease;
@@ -40,7 +46,8 @@
img{
width: 100%;
object-fit: cover;
height: fit-content;
// height: fit-content;
max-height: 200px;
}
}
}
@@ -111,12 +111,12 @@ $slick-opacity-not-active: 0.25 !default;
right: 200px;
}
&:before {
content: url('../../dist/images/grandes_fleches_prev.svg');
content: url('../../dist/images/moyennes_fleches_prev.svg');
// content: $slick-prev-character;
// font-weight: lighter;
[dir="rtl"] & {
content: url('../../dist/images/grandes_fleches_prev.svg');
content: url('../../dist/images/moyennes_fleches_prev.svg');
// content: $slick-next-character;
// font-weight: lighter;
@@ -131,12 +131,12 @@ $slick-opacity-not-active: 0.25 !default;
right: auto;
}
&:before {
content: url('../../dist/images/grandes_fleches_next.svg');
content: url('../../dist/images/moyennes_fleches_next.svg');
// content: $slick-next-character;
// font-weight: lighter;
[dir="rtl"] & {
content: url('../../dist/images/grandes_fleches_next.svg');
content: url('../../dist/images/moyennes_fleches_next.svg');
// content: $slick-prev-character;
// font-weight: lighter;
@@ -18,6 +18,8 @@ $slick-arrow-color: $yellow-puca !default;
background-image: radial-gradient(white, transparent);
border-radius: 50%;
padding: 0.8rem;
padding-bottom: 1.8rem;
padding-top: 1.8rem;
width: 120px;
height: auto;
top: 50%;
@@ -77,6 +77,9 @@
<aside class="layout-sidebar-second close" role="complementary">
{{ page.sidebar_second }}
</aside>
<h2{{ title_attributes }}>
<a href="{{ url }}" rel="bookmark">{{ label }}</a>
</h2>
{% endif %}
</main>