insertion picto, burger, reglage section...

This commit is contained in:
Chloe Listrat 2020-06-24 18:23:54 +02:00
parent 577c83b157
commit 5c09b19274
6 changed files with 300 additions and 20 deletions

View File

@ -42,15 +42,21 @@ a, a:hover{
} }
.section_accueil { .section_accueil {
position: relative; position: relative;
background-color: pink;
} }
/* START KEVIN */ /* START KEVIN */
.burger{ .burger{
position: fixed; position: fixed;
top: 0; top: 20px;
right: 0; right: 0;
} }
.fond_burger{
background-image: url('../images/form_burger.svg');
background-position: center; /* Center the image */
background-repeat: no-repeat; /* Do not repeat the image */
background-size: contain;
}
.nav-main{ .nav-main{
display: none; display: none;
position: fixed; position: fixed;
@ -71,8 +77,8 @@ a, a:hover{
} }
.rs { .rs {
position: fixed; position: fixed;
top: 0; top: 20px;
right: 0; right: 20px;
margin-right: 80px; margin-right: 80px;
} }
.rs img { .rs img {
@ -82,7 +88,7 @@ a, a:hover{
opacity: 1; opacity: 1;
} }
.facebook { .facebook {
margin-right: 30px; margin-right: 40px;
} }
.rs img:hover { .rs img:hover {
opacity: 0.6; opacity: 0.6;
@ -166,26 +172,55 @@ a, a:hover{
.thumbnails .icone_cat{ .thumbnails .icone_cat{
width: 50px; width: 50px;
height: 50px; height: 50px;
content: "Picto"; border-radius: 50px;
position: absolute; position: absolute;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
background: black; background-position: center; /* Center the image */
border-radius: 50px; background-repeat: no-repeat; /* Do not repeat the image */
background-size: cover; /* Resize the background image to cover the entire container */
background-color: black;
} }
.icone_cat .atelier_bois{ .atelier_bois{
background-image: url('/asset/'); background-image: url("../images/atelier_couture.png");
} }
.icone_cat .atelier_couture{ .atelier_couture{
background-image: url('/asset/images/atelier_couture.png'); background-image: url("../images/atelier_couture.png");
} }
.icone_cat .atelier_tricot_solidaire{ .atelier_tricot_solidaire{
background-image: url('/asset/'); background-image: url("../images/atelier_tricot.png");
} }
.icone_cat .danse_orientale{ .bal_rock{
background-image: url('/asset/images/bal_rock.png'); background-image: url("../images/bal_rock.png");
} }
.icone_cat .hatha_yoga{ .chiner_concert{
background-image: url('/asset/'); background-image: url("../images/chiner_concert.png");
}
.fab_lab{
background-image: url("../images/fab_lab.png");
}
.festival_lamine_numerique{
background-image: url("../images/fab_lab.png");
}
.gouter_melanie{
background-image: url("../images/gouter.png");
}
.danse_orientale{
background-image: url('../images/bal_rock.png');
}
.hatha_yoga{
background-image: url("../images/hatha_yoga.png");
}
.mineside_jazz{
background-image: url("../images/mineside_jazz.png");
}
.non_programmation{
background-image: url("../images/non_prog.png");
}
.soiree_mine{
background-image: url("../images/soiree_mine.png");
}
.zero_dechet{
background-image: url("../images/zero_dechet.png");
} }
/* SECTION ASSO */ /* SECTION ASSO */
@ -209,7 +244,11 @@ a, a:hover{
background-color: white; background-color: white;
border: 8px solid yellow; border: 8px solid yellow;
} }
/* START SECTION PROJETS*/
#section_projets{
margin-top: 300px;
}
/*END SECTION PROJETS*/
/* responsive iframe */ /* responsive iframe */
#section_MineVideo .wrapper__content { #section_MineVideo .wrapper__content {
position: relative; position: relative;
@ -315,6 +354,16 @@ a, a:hover{
/*fin collecte et form*/ /*fin collecte et form*/
/*page event*/ /*page event*/
.fleche {
position: relative;
left:-50px;
top:-10px;
background-image: url('../images/fleche.svg');
width: 50px;
height: 50px;
background-size: contain;
}
.titre_event { .titre_event {
position: absolute; position: absolute;
top: -100px; top: -100px;

View File

@ -0,0 +1,149 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="60mm"
height="60mm"
viewBox="0 0 60 60"
version="1.1"
id="svg7298"
inkscape:version="0.92.4 5da689c313, 2019-01-14"
sodipodi:docname="fleche.svg">
<defs
id="defs7292">
<clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath5286-7-3">
<path
d="M 0,0 H 44 V -40.7468 H 0 Z"
id="path5284-2-6"
inkscape:connector-curvature="0"
style="clip-rule:evenodd" />
</clipPath>
<clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath5296-3-7">
<path
d="M 0,-40.74679 H 1190.5512 V 40.74679 H 0 Z"
id="path5294-51-5"
inkscape:connector-curvature="0" />
</clipPath>
</defs>
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1.979899"
inkscape:cx="43.734411"
inkscape:cy="110.37637"
inkscape:document-units="mm"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="1920"
inkscape:window-height="1015"
inkscape:window-x="2135"
inkscape:window-y="0"
inkscape:window-maximized="1" />
<metadata
id="metadata7295">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Calque 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-237)">
<g
transform="matrix(-1.2287073,0.83312772,0.83312772,1.2287073,1102.5983,-610.7762)"
id="g5276-7-3"
style="stroke:#000000;stroke-opacity:1;enable-background:new">
<g
transform="matrix(-0.79914,0.60115,-0.60115,-0.79914,934.33159,56.01182)"
id="g5278-8-5"
style="stroke:#000000;stroke-opacity:1">
<g
id="g5280-94-6"
style="stroke:#000000;stroke-opacity:1">
<g
clip-path="url(#clipPath5286-7-3)"
id="g5282-1-2"
style="stroke:#000000;stroke-opacity:1">
<g
transform="translate(0,-40.74679)"
id="g5288-64-9"
style="stroke:#000000;stroke-opacity:1">
<g
id="g5290-3-1"
style="stroke:#000000;stroke-opacity:1">
<g
id="g5292-5-2"
style="stroke:#000000;stroke-opacity:1" />
<g
id="g5316-4-7"
style="stroke:#000000;stroke-opacity:1">
<g
id="g5314-87-0"
clip-path="url(#clipPath5296-3-7)"
style="stroke:#000000;stroke-opacity:1">
<g
id="g5304-3-9"
transform="translate(5.93849,35.13024)"
style="stroke:#000000;stroke-opacity:1">
<g
id="g5302-3-3"
style="stroke:#000000;stroke-opacity:1">
<g
id="g5298-5-6"
style="stroke:#000000;stroke-opacity:1" />
<path
inkscape:connector-curvature="0"
id="path5300-0-0"
style="fill:none;stroke:#000000;stroke-width:2.83465004;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
d="m 31.3859,-31.3468 c 0,0 2.93,31.34679 -31.3859,28.27149" />
</g>
</g>
<g
id="g5312-1-6"
transform="translate(2.34613,38.37694)"
style="stroke:#000000;stroke-opacity:1">
<g
id="g5310-45-2"
style="stroke:#000000;stroke-opacity:1">
<g
id="g5306-70-6"
style="stroke:#000000;stroke-opacity:1" />
<path
inkscape:connector-curvature="0"
id="path5308-7-1"
style="fill:none;stroke:#000000;stroke-width:2.83465004;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
d="M 10.7771,-12.7959 0,-6.32203 10.7771,4e-5" />
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 5.2 KiB

View File

@ -0,0 +1,78 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="60mm"
height="60mm"
viewBox="0 0 60 60"
version="1.1"
id="svg6684"
inkscape:version="0.92.4 5da689c313, 2019-01-14"
sodipodi:docname="form_burger.svg">
<defs
id="defs6678" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1.4"
inkscape:cx="292.89198"
inkscape:cy="125.33552"
inkscape:document-units="mm"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="1161"
inkscape:window-height="591"
inkscape:window-x="496"
inkscape:window-y="202"
inkscape:window-maximized="0" />
<metadata
id="metadata6681">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Calque 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-237)">
<path
sodipodi:type="star"
style="opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#060500;stroke-width:8.29967308;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:6.25;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal;enable-background:new"
id="path12159-1-9-6-0-6"
sodipodi:sides="13"
sodipodi:cx="2533.7827"
sodipodi:cy="-225.02252"
sodipodi:r1="64.344269"
sodipodi:r2="54.049187"
sodipodi:arg1="0.70098386"
sodipodi:arg2="0.94264483"
inkscape:flatsided="false"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 2582.9551,-183.52241 -17.4104,2.2319 -7.508,15.86607 -16.4534,-6.11476 -14.0214,10.55953 -11.7271,-13.06061 -17.3225,2.83393 -4.3143,-17.01443 -16.6553,-5.54089 4.0869,-17.07044 -12.1726,-12.64636 11.5518,-13.21583 -4.9013,-16.85469 16.3704,-6.33363 3.4929,-17.20183 17.4386,1.99954 11.0869,-13.60823 14.5119,9.87462 16.141,-6.89714 8.2607,15.48756 17.4974,1.39398 0.1171,17.55248 14.8453,9.36577 -8.0534,15.59634 8.7925,15.19198 -14.3789,10.06726 z"
inkscape:transform-center-x="-0.00016769621"
inkscape:transform-center-y="-0.00020358361"
transform="matrix(0.27412452,0.32710811,-0.32710811,0.27412452,-738.117,-500.3721)"
inkscape:export-filename="/home/figureslibres/Documents/chloe/LaMine-ressourcerie/SITE LaMine/ENVOI_3/forme_burger.png"
inkscape:export-xdpi="72"
inkscape:export-ydpi="72" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 10 KiB

View File

@ -9,7 +9,7 @@
<header class="header d-flex justify-content-between"> <header class="header d-flex justify-content-between">
{% block header %} {% block header %}
<div class="logoLamine"> <div class="logoLamine">
<a class="hdr-logo-link" href="{{site.url}}"><img src="app/themes/la_mine/asset/images/logo_lamine_vect.svg"/></a> <a class="hdr-logo-link" href="{{site.url}}"><img src="../images/logo_lamine_vect.svg"/></a>
</div> </div>
<div class="rs row align-items"> <div class="rs row align-items">
<div class="facebook"> <div class="facebook">
@ -25,12 +25,14 @@
</div> </div>
<div class="burger"> <div class="burger">
<div class="fond_burger">
<button class="hamburger hamburger--slider" type="button"> <button class="hamburger hamburger--slider" type="button">
<span class="hamburger-box"> <span class="hamburger-box">
<span class="hamburger-inner"></span> <span class="hamburger-inner"></span>
</span> </span>
</button> </button>
</div> </div>
</div>
<nav id="nav-main" class="nav-main" role="navigation"> <nav id="nav-main" class="nav-main" role="navigation">
{% include "menu.twig" with {'items': menu.get_items} %} {% include "menu.twig" with {'items': menu.get_items} %}

View File

@ -1,9 +1,11 @@
{% extends "base.twig" %} {% extends "base.twig" %}
{% block content %} {% block content %}
<div class="content-wrapper"> <div class="content-wrapper">
<div class="Btn retour"> <div class="Btn retour">
<a href="/agenda">Retour</a> <a href="/agenda">Retour</a>
</div> </div>
<div class="fleche"></div>
<article class="post-type row"> <article class="post-type row">
<div class="__img_event col-md"> <div class="__img_event col-md">
<img src="{{ Image(post.image_event).src }}" /> <img src="{{ Image(post.image_event).src }}" />