valentin_le_moign/lamine_wp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

anime logo

Browse Source
This commit is contained in:
Kevin Tessier 2020-09-08 17:20:47 +02:00
parent e0fc506ae1
commit 52cc7bdf74
13 changed files with 272 additions and 93 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
web/app/themes/la_mine/dist/assets/css/index.css vendored
View File

File diff suppressed because one or more lines are too long

4
web/app/themes/la_mine/dist/assets/css/index.min.css vendored
View File

File diff suppressed because one or more lines are too long

BIN
web/app/themes/la_mine/src/assets/images/logo-lamine.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

50
web/app/themes/la_mine/src/assets/scss/components/_header.scss
View File

@ -0,0 +1,50 @@
header{
section{
position: relative;
figure{
a{
position: relative;
display: block;
width: max-content;
height: calc( #{$heightLogo} / 2 ) ;
transition: 0.5s all ease;
@media screen and (min-width: 576px) {
height: $heightLogo;
}
img{
z-index: 3;
position: relative;
}
span{
display: block;
}
#lumiR_logo{
@include logoLamine(1, calc(#{$heightLogo} / 5 ), calc(#{$heightLogo} / 5), $colorYellow, 25px, 35px);
@media screen and (min-width: 576px) {
@include logoLamine(1, calc(#{$heightLogo} / 3), calc(#{$heightLogo} / 3), $colorYellow, 50px, 70px);
}
}
#fond_logo{
@include logoLamine(0, calc(#{$heightLogo}), calc(#{$heightLogo}), $colorWhite, -70%, 30%);
@media screen and (min-width: 576px) {
@include logoLamine(0, calc(#{$heightLogo} * 2 ), calc(#{$heightLogo} * 2 ), $colorWhite, -70%, 30%);
}
}
&:hover{
height: $heightLogoHover;
transition: 0.5s all ease;
#lumiR_logo{
@include logoLamineHover(calc(#{$heightLogoHover} - 75px), calc(#{$heightLogoHover} - 75px), 45px, 60px);
}
#fond_logo{
@include logoLamineHover(calc(#{$heightLogoHover} + 75px), calc(#{$heightLogoHover} + 75px), -50%, 50%);
}
}
}
}
}
}

67
web/app/themes/la_mine/src/assets/scss/configs/_mixins.scss
View File

@ -7,3 +7,70 @@ body{
justify-items: center;
background: $color;
}
// GLOBAL
@mixin vertical-align{
display: flex;
align-items: center;
}
@mixin reset-list{
margin: 0;
padding: 0;
list-style: none;
}
@mixin horizontal-list {
& > li {
display: inline-block;
margin: {
left: -2px;
right: 2rem;
}
}
}
@mixin position_fixed{
position: fixed;
top: 0;
left: 0;
}
@mixin hidden_border{
padding: 0;
border: none!important;
background: none!important;
outline: none!important;
&:focus {
outline: none!important;
}
}
@mixin wysiwyg{
h1{}
h2{}
h3{}
h4{}
h5{}
h6{}
strong{}
b{}
em{}
i{}
a{}
u{}
sup{}
p{
margin-bottom: 1rem;
font-size: 1rem;
line-height: 1.5rem;
strong{}
sup{}
u{}
a{}
b{}
i{}
em{}
}
}

20
web/app/themes/la_mine/src/assets/scss/configs/_mixinsLamine.scss Normal file
View File

@ -0,0 +1,20 @@
@mixin logoLamine($Z, $width, $height, $color, $top, $left) {
z-index: $Z;
background-color: $color;
width: $width;
height: $height;
position: absolute;
top: $top;
left: $left;
transform: translateX(-50%);
border-radius: 50%;
transition: 0.5s all ease;
}
@mixin logoLamineHover($width, $height, $top, $left) {
width: $width;
height: $height;
top: $top;
left: $left;
transition: 0.5s all ease;
}

7
web/app/themes/la_mine/src/assets/scss/configs/_variables.scss
View File

@ -0,0 +1,7 @@
// color
$colorWhite: white;
$colorYellow:#ffcc00;
$heightLogo: 115px;
$heightLogoHover: 100px;

13
web/app/themes/la_mine/src/assets/scss/index.scss
View File

@ -1,3 +1,8 @@
// config
@import "configs/variables.scss";
@import "configs/mixinsLamine.scss";
@import "configs/mixins.scss";
// bootstrap
@import "bootstraps/bootstrap.scss";
@import "bootstraps/bootstrap-reboot.scss";
@ -19,6 +24,14 @@ figure{
}
body{
@import "pages/index.scss";
}
li,ul,ol{
@include reset-list;
}
// @import "bootstrap/scss/bootstrap-grid.scss";
// @import "normalize.css/normalize.css";

3
web/app/themes/la_mine/src/assets/scss/pages/_home.scss Normal file
View File

@ -0,0 +1,3 @@
&.accueil{
}

1
web/app/themes/la_mine/src/assets/scss/pages/_index.scss Normal file
View File

@ -0,0 +1 @@
@import "home.scss";

39
web/app/themes/la_mine/templates/base.twig
View File

@ -7,42 +7,7 @@
<body class="container-fluid {{post.slug}} {{post.post_type}}">
<header class="fixed-top d-flex">
{% block header %}
<section class="logo col">
<figure>
<a href="{{site.url}}" rel="noreferrer">
<img src="{{theme.link}}/dist//assets/images/logo_lamine_vect.svg" alt="logo_Lamine" title="Le logo de La mine"/>
<span id="lumiR_logo"></span>
<span id="fond_logo"></span>
</a>
</figure>
</section>
<section class="nav-main col row">
<div class="rs col">
<figure id="facebook">
<a rel="noreferrer" target="_blank" href="{{options.facebook.lien_facebook}}">
<img src="{{theme.link}}/dist//assets/images/fb.svg" alt="logo_facebook" title="Le logo de facebook"/>
</a>
</figure>
<figure id="insta">
<a rel="noreferrer" target="_blank" href="{{options.instagram.lien_instagram}}">
<img src="{{theme.link}}/dist//assets/images/inst.svg" alt="logo_instagram" title="Le logo d'instagram"/>
</a>
</figure>
</div>
<div class="burger col">
<div class="fond_burger">
<button class="hamburger hamburger--slider" type="button">
<span class="hamburger-box">
<span class="hamburger-inner"></span>
</span>
</button>
</div>
</div>
<nav class="col" role="navigation">
{% include "components/menu.twig" with {'items': menu.get_items} %}
</nav>
</section>
{% include "components/header.twig" %}
{% endblock %}
</header>
@ -71,7 +36,7 @@
</main>
{% block footer %}
<footer>
<footer class="row">
{% include 'components/footer.twig' %}
</footer>
{{ function('wp_footer') }}

91
web/app/themes/la_mine/templates/components/footer.twig
View File

@ -1,34 +1,34 @@
<section class="information col-12 col-xl-7 col-lg-12 p-0">
<div class="d-flex justify-content-around flex-wrap">
<div class="logo_lamine col-lg-3 col-sm-6">
<a href="{{site.url}}"><img src="{{ Image(options.lamine_footer.image_logo).src }}" /></a>
</div>
<section class="col">
<div class="row">
<figure class="col">
<a rel="noreferrer" href="{{site.url}}"><img src="{{theme.link}}/src/assets/images/logo-lamine.png" /></a>
</figure>
<div class="horaires col-lg-3 col-sm-6">
<div class="col">
{{options.texte_horaire }}
</div>
<div class="adresse col-lg-3 col-sm-6">
<div class="col">
{{options.texte_adresse }}
</div>
<div class="col-lg-3 col-sm-6">
<div class="collecte">
<div class="col">
<div class="">
{{options.texte_collecte }}
</div>
<div class="reseaux_sociaux align-items">
<div class="facebook">
<a class="d-flex" target="_blank" href="{{options.facebook.lien_facebook}}">
<div class="">
<figure class="">
<a rel="noreferrer" target="_blank" href="{{options.facebook.lien_facebook}}">
<img src="{{ Image(options.facebook.logo_facebook).src }}" />
<span>{{options.facebook.texte_facebook}}</span>
<figcaption>{{options.facebook.texte_facebook}}</figcaption>
</a>
</div>
</figure>
<div class="insta">
<a class="d-flex" target="_blank" href="{{options.instagram.lien_instagram}}">
<figure rel="noreferrer" class="d-flex" target="_blank" href="{{options.instagram.lien_instagram}}">
<img src="{{ Image(options.instagram.logo_instagram).src }}" />
<span>{{options.instagram.texte_instagram}}</span>
</a>
<figcaption>{{options.instagram.texte_instagram}}</figcaption>
</figure>
</div>
</div>
@ -36,45 +36,34 @@
</div>
</section>
<section class="join-us col-12 col-xl-5 col-lg-12 p-0">
<div>
<div class="send_actu">
<!-- Begin Mailchimp Signup Form -->
<div id="mc_embed_signup">
<form action="https://kevintessier.us19.list-manage.com/subscribe/post?u=a98b763288f940083bf28857c&amp;id=364a0fe850" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div class="d-flex" id="mc_embed_signup_scroll">
<div><p>Recevoir l'actualité de La Mine</p></div>
<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="E-mail" required>
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_a98b763288f940083bf28857c_364a0fe850" tabindex="-1" value=""></div>
<div class="clear"><input type="submit" value="Ok" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</div>
</form>
</div>
<!--End mc_embed_signup-->
</div>
<div class="add_asso">
<div id="Btn_asso">
<a target="_blank" href="{{post.meta('bouton_asso').lien_hello_asso}}">adhérer à l'association</a>
<section class="col">
<div id="mc_embed_signup" class="row">
<form action="https://kevintessier.us19.list-manage.com/subscribe/post?u=a98b763288f940083bf28857c&amp;id=364a0fe850" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div class="d-flex" id="mc_embed_signup_scroll">
<div><p>Recevoir l'actualité de La Mine</p></div>
<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="E-mail" required>
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_a98b763288f940083bf28857c_364a0fe850" tabindex="-1" value=""></div>
<div class="clear"><input type="submit" value="Ok" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</div>
</form>
</div>
<div class="row">
<a class="btn" target="_blank" href="{{post.meta('bouton_asso').lien_hello_asso}}">adhérer à l'association</a>
</div>
<div class="partenaires d-block d-sm-flex align-items-center col-lg-12">
<div class="_titre text-center mb-3">{{options.titre}}</div>
<div class="logo_partenaires w-100">
<div class="container_slide">
<ul>
{% for partner in options.partenaire %}
<li>
<a target="_blank" href="{{partner.lien_site_partenaire}}">
<img src="{{ Image(partner.logo).src }}" />
</a>
</li>
{% endfor %}
</ul>
<div class="row">
<h3>{{options.titre}}</h3>
<figure class="col px-0">
<div class="main-carousel">
{% for partner in options.partenaire %}
<a rel="noreferrer" target="_blank" href="{{partner.lien_site_partenaire}}">
<img src="{{ Image(partner.logo).src }}" />
</a>
{% endfor %}
</div>
</div>
</figure>
</div>
</div>
</section>

36
web/app/themes/la_mine/templates/components/header.twig Normal file
View File

@ -0,0 +1,36 @@
<section class="logo col-6">
<figure>
<a href="{{site.url}}" rel="noreferrer">
<img src="{{theme.link}}/dist//assets/images/logo_lamine_vect.svg" alt="logo_Lamine" title="Le logo de La mine"/>
<span id="lumiR_logo"></span>
<span id="fond_logo"></span>
</a>
</figure>
</section>
<section class="nav-main row">
<div class="rs col">
<figure id="facebook">
<a rel="noreferrer" target="_blank" href="{{options.facebook.lien_facebook}}">
<img src="{{theme.link}}/dist//assets/images/fb.svg" alt="logo_facebook" title="Le logo de facebook"/>
</a>
</figure>
<figure id="insta">
<a rel="noreferrer" target="_blank" href="{{options.instagram.lien_instagram}}">
<img src="{{theme.link}}/dist//assets/images/inst.svg" alt="logo_instagram" title="Le logo d'instagram"/>
</a>
</figure>
</div>
<div class="burger col">
<div class="fond_burger">
<button class="hamburger hamburger--slider" type="button">
<span class="hamburger-box">
<span class="hamburger-inner"></span>
</span>
</button>
</div>
</div>
<nav class="col" role="navigation">
{% include "components/menu.twig" with {'items': menu.get_items} %}
</nav>
</section>