déploiement resources

This commit is contained in:
2021-04-14 14:22:24 +02:00
parent 0ae1e837e7
commit c8f6de919f
24 changed files with 837 additions and 379 deletions
@@ -30,10 +30,8 @@ rapports:
texte_de_presentation: "Courte explicationVita estillis semper in fuga uxoresque mercenariae\r\n infugauxoresque mercenariae conductae ad tempus expacto atque, ut conductae ad tempus ex pacto atque, ut sit species matrimonii, dotis nomine futura coniunx hastam.\r\n"
couverture: rapport_activite_V1.png
pdf: rapport_activite_V1.pdf
template: modular/ressources
process:
markdown: true
twig: false
---
Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 97 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 51 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

+3 -4
View File
@@ -1,9 +1,8 @@
---
title: Contact
body_classes: modular
media_order: 'puca.png,logo cité archi.jpg,logo_gouvernment.png,logo MCTRCT.png,logo ministère culture.png,logo min logement.png,europan_france.jpg'
published: true
---
CONTACT :
Fabienne.Dran@developpement-durable.gouv.fr
+ 33 (0)1 40 81 9327
+33 (0)7 86 5033 31
![logo%20cit%C3%A9%20archi](logo%20cit%C3%A9%20archi.jpg "logo%20cit%C3%A9%20archi") ![logo_gouvernment](logo_gouvernment.png "logo_gouvernment") ![logo%20MCTRCT](logo%20MCTRCT.png "logo%20MCTRCT") ![logo%20minist%C3%A8re%20culture](logo%20minist%C3%A8re%20culture.png "logo%20minist%C3%A8re%20culture") ![logo%20min%20logement](logo%20min%20logement.png "logo%20min%20logement") ![europan_france](europan_france.jpg "europan_france") ![puca](puca.png "puca")
-50
View File
@@ -1,56 +1,6 @@
# Epau Antimatter
# modif par Ouidade
##le 10/03/21
ai créer un module "personnes.html.twig" mais ce module n'est pas visible.
ai donc rajouté ligne 51 à 55 dans modular.html.twig >>> marche pas
ai rajouté lignes 11 à 16 dans personnes.html.twig >>> marche pas
ai essayé de remonter les champs du module Gouvernance et template personnes mais n'ai pas réussi. dans fichier features.html.twig qui est mon modèle je n'arrive pas à comprendre à quoi correspondent tous les "feature" et "features" et ".features" mentionnés (je pense qui se réfèrent à plusieurs choses différentes)
donc je n'arrive pas à faire le lien avec mais nouveaux champs créés dans le template personnes.yaml pour réécrire personnes.html.twig
ai ajouter un champ de type "file" dans template features.yaml mais n'est pas visible.
il faut que je trouve la bonne syntaxe twig a ajouter au fichier features.html.twig
les liens dans les champs text de Features (module programmes) ne fonctionnent pas. Pourtant bien du markdown et écrit comme dans quark.
## le 11/03/21
J'ai ajouter dans features.html.twig les lignes
{% if feature.logo %}
<img src="{{ page.media[page.header.feature.logo] }}" alt=“logo_programme”/>
{% endif %}
maintenant la présence d'une image est vue mais elle ne s'affiche pas. ai seulement le texte alternatif.
autre pb pour le module "programmes"
le markdown du text n'est pas pris en compte.
j'ai essayé:
.text:
type: markdown
label: Texte de présentation du programme
validate:
type: textarea
.text:
type: editor
label: Texte de présentation du programme
markdown: true
.text:
type: editor
label: Texte de présentation du programme
markdown: true
#fin des modifs par Ouidade
![Epau Antimatter](assets/readme_1.png)
Epau Antimatter is the default [Grav](http://getgrav.org) theme. Simple, fast and modern.
@@ -1,3 +1,4 @@
@charset "UTF-8";
@import url(//fonts.googleapis.com/css?family=Montserrat:400|Raleway:300,400,600|Inconsolata);
#header #logo h3, #header #navbar .panel-activation, #footer p {
position: relative;
@@ -798,6 +799,16 @@ ul.pagination {
#body > script:first-child + .grav-lightslider {
margin-top: -3rem; }
#sb-site {
background: none !important; }
#sb-site #body {
background: none !important;
padding-bottom: 2rem !important; }
#header.scrolled {
padding-left: 2rem;
padding-right: 2rem; }
#header #navbar ul.navigation li a {
font-family: "Sarabun", sans-serif;
font-weight: 400;
@@ -828,6 +839,11 @@ ul.pagination {
padding: 0.5rem;
max-height: 3rem;
margin: auto; }
#logo #gouv {
padding-right: 4rem; }
#body p:empty {
display: none; }
.callout {
padding-top: 0.5rem; }
@@ -880,31 +896,8 @@ ul.pagination {
padding-top: 8rem;
padding-bottom: 8rem; }
.paralax {
position: absolute !important;
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between; }
.paralax #photo1 {
position: relative;
top: -60px; }
.paralax #photo2 {
z-index: 0;
width: 700px !important;
position: relative;
top: 260px; }
.paralax #photo3 {
z-index: 0;
width: 700px !important;
position: relative;
top: 500px; }
.paralax #photo4 {
z-index: 0;
width: 700px !important;
position: relative;
top: 300px; }
.parallax-window {
background: transparent; }
.programme {
z-index: 1;
@@ -920,7 +913,8 @@ ul.pagination {
.programme p {
font-family: "Sarabun", sans-serif;
font-weight: 500;
font-style: italic; }
font-style: italic;
padding-bottom: 1.5rem; }
.programme:hover {
background-color: #000;
@@ -930,6 +924,42 @@ ul.pagination {
.programme:hover h4 {
color: #fff; }
/*CSS pour afficher/masquer un texte via un bouton*/
/*Style du module TEXTE*/
.texte-cache {
position: relative;
max-height: 400px;
/*Hauteur du texte visible avant le clic*/
overflow: hidden;
/*On cache tout ce qui dépasse des 500px*/
transition: max-height 1s ease;
/* Transition CSS entre l'ouverture et la fermeture*/ }
/*Style du module TEXTE lorsqu'il est ouvert*/
.texte-cache.ouvert {
max-height: 100vh;
/* On lui définit une hauteur max de tout l'écran si nécessaire pour qu'il affiche tout son contenu*/ }
/*On stylise l'effet de flou lorsque le module TEXTE est fermé, donc il n'a pas la classe "ouvert"*/
.texte-cache:not(.ouvert)::after {
content: '';
position: absolute;
top: 400px;
bottom: 0;
left: 0;
right: 0; }
.bouton-ouverture {
position: relative;
justify-content: center;
cursor: pointer;
border: solid;
background-color: transparent;
text-transform: uppercase;
left: 45%;
margin-top: 3rem;
margin-bottom: 5rem; }
.gouvernance {
background-color: #000;
color: #ffffff;
@@ -938,13 +968,17 @@ ul.pagination {
padding-top: 2rem; }
.mozaique_personnes {
background-color: #d5d2d1; }
background-color: #d5d2d1;
padding-bottom: 4rem; }
.mozaique_personnes .equipe {
display: flex !important;
flex-direction: row;
flex-wrap: wrap;
width: 54%;
margin: auto; }
width: 100%;
padding-left: 22%;
padding-right: 15%;
margin: auto;
justify-items: center; }
.mozaique_personnes .equipe h3 {
padding-top: 3rem;
min-width: 100%;
@@ -1006,7 +1040,7 @@ ul.pagination {
background-color: transparent;
text-transform: uppercase;
align-self: flex-end;
margin-right: 2rem; }
margin: auto; }
.modal {
position: fixed;
@@ -1042,6 +1076,56 @@ ul.pagination {
.modal .container a.close:hover {
color: black; }
#new-footer {
display: flex;
flex-direction: column; }
#new-footer .tothetop {
position: absolute;
height: 1rem;
bottom: 16rem;
text-align: center;
left: 0;
right: 0; }
#new-footer .tothetop span {
font-size: 1.7rem;
line-height: 2,5rem;
background: #fff;
width: 4rem;
height: 5rem;
border-radius: 3px;
display: inline-block;
text-align: top; }
#new-footer .footer {
display: flex;
flex-direction: row; }
#new-footer .footer .footer-logos {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
width: 70%;
align-items: center;
margin-left: 3rem; }
#new-footer .footer .footer-logos img {
min-height: 4rem;
max-height: 4rem;
padding-right: 1rem; }
#new-footer .footer .contact {
display: flex;
flex-direction: column;
width: 30%;
margin-top: 1.5rem;
align-items: flex-start; }
#new-footer .footer .contact img {
margin-bottom: 1rem;
max-height: 2rem; }
#new-footer .footer .contact svg {
margin-bottom: 1rem; }
#new-footer .footer .contact h6 {
margin: 0 !important;
font-weight: 600; }
#new-footer .footer .contact p {
margin: 0; }
.modular.header-image #header {
background-color: rgba(255, 255, 255, 0);
box-shadow: none; }
+13 -2
View File
@@ -27,6 +27,19 @@ function scrollHeader() {
jQuery(document).ready(function($){
//bouton "voir plus de ressources"
// $("a.bouton-ouverture").removeAttr("href"); // On supprime le lien de notre bouton
$('.bouton-ouverture').on('click', function(){ // lorsqu'on clique sur le bouton
$('.texte-cache').toggleClass('ouvert'); // On ajoute ou retire la classe CSS "ouvert"
if ($('.texte-cache').hasClass('ouvert')) { // Si le module texte a la classe "ouvert"
$('.bouton-ouverture').html('Voir MOINS'); // On affiche LIRE MOINS sur le bouton
} else {
$('.bouton-ouverture').html('Voir PLUS'); // Sinon on affiche LIRE PLUS
}
});
// jQuery('.your-class-here').one('inview', function (event, visible) {
// if (visible == true) {
@@ -116,6 +129,4 @@ jQuery(document).ready(function($){
});
});
+412
View File
@@ -0,0 +1,412 @@
/*!
* parallax.js v1.5.0 (http://pixelcog.github.io/parallax.js/)
* @copyright 2016 PixelCog, Inc.
* @license MIT (https://github.com/pixelcog/parallax.js/blob/master/LICENSE)
*/
;(function ( $, window, document, undefined ) {
// Polyfill for requestAnimationFrame
// via: https://gist.github.com/paulirish/1579671
(function() {
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelRequestAnimationFrame'];
}
if (!window.requestAnimationFrame)
window.requestAnimationFrame = function(callback) {
var currTime = new Date().getTime();
var timeToCall = Math.max(0, 16 - (currTime - lastTime));
var id = window.setTimeout(function() { callback(currTime + timeToCall); },
timeToCall);
lastTime = currTime + timeToCall;
return id;
};
if (!window.cancelAnimationFrame)
window.cancelAnimationFrame = function(id) {
clearTimeout(id);
};
}());
// Parallax Constructor
function Parallax(element, options) {
var self = this;
if (typeof options == 'object') {
delete options.refresh;
delete options.render;
$.extend(this, options);
}
this.$element = $(element);
if (!this.imageSrc && this.$element.is('img')) {
this.imageSrc = this.$element.attr('src');
}
var positions = (this.position + '').toLowerCase().match(/\S+/g) || [];
if (positions.length < 1) {
positions.push('center');
}
if (positions.length == 1) {
positions.push(positions[0]);
}
if (positions[0] == 'top' || positions[0] == 'bottom' || positions[1] == 'left' || positions[1] == 'right') {
positions = [positions[1], positions[0]];
}
if (this.positionX !== undefined) positions[0] = this.positionX.toLowerCase();
if (this.positionY !== undefined) positions[1] = this.positionY.toLowerCase();
self.positionX = positions[0];
self.positionY = positions[1];
if (this.positionX != 'left' && this.positionX != 'right') {
if (isNaN(parseInt(this.positionX))) {
this.positionX = 'center';
} else {
this.positionX = parseInt(this.positionX);
}
}
if (this.positionY != 'top' && this.positionY != 'bottom') {
if (isNaN(parseInt(this.positionY))) {
this.positionY = 'center';
} else {
this.positionY = parseInt(this.positionY);
}
}
this.position =
this.positionX + (isNaN(this.positionX)? '' : 'px') + ' ' +
this.positionY + (isNaN(this.positionY)? '' : 'px');
if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
if (this.imageSrc && this.iosFix && !this.$element.is('img')) {
this.$element.css({
backgroundImage: 'url(' + this.imageSrc + ')',
backgroundSize: 'cover',
backgroundPosition: this.position
});
}
return this;
}
if (navigator.userAgent.match(/(Android)/)) {
if (this.imageSrc && this.androidFix && !this.$element.is('img')) {
this.$element.css({
backgroundImage: 'url(' + this.imageSrc + ')',
backgroundSize: 'cover',
backgroundPosition: this.position
});
}
return this;
}
this.$mirror = $('<div />').prependTo(this.mirrorContainer);
var slider = this.$element.find('>.parallax-slider');
var sliderExisted = false;
if (slider.length == 0)
this.$slider = $('<img />').prependTo(this.$mirror);
else {
this.$slider = slider.prependTo(this.$mirror)
sliderExisted = true;
}
this.$mirror.addClass('parallax-mirror').css({
visibility: 'hidden',
zIndex: this.zIndex,
position: 'fixed',
top: 0,
left: 0,
overflow: 'hidden'
});
this.$slider.addClass('parallax-slider').one('load', function() {
if (!self.naturalHeight || !self.naturalWidth) {
self.naturalHeight = this.naturalHeight || this.height || 1;
self.naturalWidth = this.naturalWidth || this.width || 1;
}
self.aspectRatio = self.naturalWidth / self.naturalHeight;
Parallax.isSetup || Parallax.setup();
Parallax.sliders.push(self);
Parallax.isFresh = false;
Parallax.requestRender();
});
if (!sliderExisted)
this.$slider[0].src = this.imageSrc;
if (this.naturalHeight && this.naturalWidth || this.$slider[0].complete || slider.length > 0) {
this.$slider.trigger('load');
}
}
// Parallax Instance Methods
$.extend(Parallax.prototype, {
speed: 0.2,
bleed: 0,
zIndex: -100,
iosFix: true,
androidFix: true,
position: 'center',
overScrollFix: false,
mirrorContainer: 'body',
refresh: function() {
this.boxWidth = this.$element.outerWidth();
this.boxHeight = this.$element.outerHeight() + this.bleed * 2;
this.boxOffsetTop = this.$element.offset().top - this.bleed;
this.boxOffsetLeft = this.$element.offset().left;
this.boxOffsetBottom = this.boxOffsetTop + this.boxHeight;
var winHeight = Parallax.winHeight;
var docHeight = Parallax.docHeight;
var maxOffset = Math.min(this.boxOffsetTop, docHeight - winHeight);
var minOffset = Math.max(this.boxOffsetTop + this.boxHeight - winHeight, 0);
var imageHeightMin = this.boxHeight + (maxOffset - minOffset) * (1 - this.speed) | 0;
var imageOffsetMin = (this.boxOffsetTop - maxOffset) * (1 - this.speed) | 0;
var margin;
if (imageHeightMin * this.aspectRatio >= this.boxWidth) {
this.imageWidth = imageHeightMin * this.aspectRatio | 0;
this.imageHeight = imageHeightMin;
this.offsetBaseTop = imageOffsetMin;
margin = this.imageWidth - this.boxWidth;
if (this.positionX == 'left') {
this.offsetLeft = 0;
} else if (this.positionX == 'right') {
this.offsetLeft = - margin;
} else if (!isNaN(this.positionX)) {
this.offsetLeft = Math.max(this.positionX, - margin);
} else {
this.offsetLeft = - margin / 2 | 0;
}
} else {
this.imageWidth = this.boxWidth;
this.imageHeight = this.boxWidth / this.aspectRatio | 0;
this.offsetLeft = 0;
margin = this.imageHeight - imageHeightMin;
if (this.positionY == 'top') {
this.offsetBaseTop = imageOffsetMin;
} else if (this.positionY == 'bottom') {
this.offsetBaseTop = imageOffsetMin - margin;
} else if (!isNaN(this.positionY)) {
this.offsetBaseTop = imageOffsetMin + Math.max(this.positionY, - margin);
} else {
this.offsetBaseTop = imageOffsetMin - margin / 2 | 0;
}
}
},
render: function() {
var scrollTop = Parallax.scrollTop;
var scrollLeft = Parallax.scrollLeft;
var overScroll = this.overScrollFix ? Parallax.overScroll : 0;
var scrollBottom = scrollTop + Parallax.winHeight;
if (this.boxOffsetBottom > scrollTop && this.boxOffsetTop <= scrollBottom) {
this.visibility = 'visible';
this.mirrorTop = this.boxOffsetTop - scrollTop;
this.mirrorLeft = this.boxOffsetLeft - scrollLeft;
this.offsetTop = this.offsetBaseTop - this.mirrorTop * (1 - this.speed);
} else {
this.visibility = 'hidden';
}
this.$mirror.css({
transform: 'translate3d('+this.mirrorLeft+'px, '+(this.mirrorTop - overScroll)+'px, 0px)',
visibility: this.visibility,
height: this.boxHeight,
width: this.boxWidth
});
this.$slider.css({
transform: 'translate3d('+this.offsetLeft+'px, '+this.offsetTop+'px, 0px)',
position: 'absolute',
height: this.imageHeight,
width: this.imageWidth,
maxWidth: 'none'
});
}
});
// Parallax Static Methods
$.extend(Parallax, {
scrollTop: 0,
scrollLeft: 0,
winHeight: 0,
winWidth: 0,
docHeight: 1 << 30,
docWidth: 1 << 30,
sliders: [],
isReady: false,
isFresh: false,
isBusy: false,
setup: function() {
if (this.isReady) return;
var self = this;
var $doc = $(document), $win = $(window);
var loadDimensions = function() {
Parallax.winHeight = $win.height();
Parallax.winWidth = $win.width();
Parallax.docHeight = $doc.height();
Parallax.docWidth = $doc.width();
};
var loadScrollPosition = function() {
var winScrollTop = $win.scrollTop();
var scrollTopMax = Parallax.docHeight - Parallax.winHeight;
var scrollLeftMax = Parallax.docWidth - Parallax.winWidth;
Parallax.scrollTop = Math.max(0, Math.min(scrollTopMax, winScrollTop));
Parallax.scrollLeft = Math.max(0, Math.min(scrollLeftMax, $win.scrollLeft()));
Parallax.overScroll = Math.max(winScrollTop - scrollTopMax, Math.min(winScrollTop, 0));
};
$win.on('resize.px.parallax load.px.parallax', function() {
loadDimensions();
self.refresh();
Parallax.isFresh = false;
Parallax.requestRender();
})
.on('scroll.px.parallax load.px.parallax', function() {
loadScrollPosition();
Parallax.requestRender();
});
loadDimensions();
loadScrollPosition();
this.isReady = true;
var lastPosition = -1;
function frameLoop() {
if (lastPosition == window.pageYOffset) { // Avoid overcalculations
window.requestAnimationFrame(frameLoop);
return false;
} else lastPosition = window.pageYOffset;
self.render();
window.requestAnimationFrame(frameLoop);
}
frameLoop();
},
configure: function(options) {
if (typeof options == 'object') {
delete options.refresh;
delete options.render;
$.extend(this.prototype, options);
}
},
refresh: function() {
$.each(this.sliders, function(){ this.refresh(); });
this.isFresh = true;
},
render: function() {
this.isFresh || this.refresh();
$.each(this.sliders, function(){ this.render(); });
},
requestRender: function() {
var self = this;
self.render();
self.isBusy = false;
},
destroy: function(el){
var i,
parallaxElement = $(el).data('px.parallax');
parallaxElement.$mirror.remove();
for(i=0; i < this.sliders.length; i+=1){
if(this.sliders[i] == parallaxElement){
this.sliders.splice(i, 1);
}
}
$(el).data('px.parallax', false);
if(this.sliders.length === 0){
$(window).off('scroll.px.parallax resize.px.parallax load.px.parallax');
this.isReady = false;
Parallax.isSetup = false;
}
}
});
// Parallax Plugin Definition
function Plugin(option) {
return this.each(function () {
var $this = $(this);
var options = typeof option == 'object' && option;
if (this == window || this == document || $this.is('body')) {
Parallax.configure(options);
}
else if (!$this.data('px.parallax')) {
options = $.extend({}, $this.data(), options);
$this.data('px.parallax', new Parallax(this, options));
}
else if (typeof option == 'object')
{
$.extend($this.data('px.parallax'), options);
}
if (typeof option == 'string') {
if(option == 'destroy'){
Parallax.destroy(this);
}else{
Parallax[option]();
}
}
});
}
var old = $.fn.parallax;
$.fn.parallax = Plugin;
$.fn.parallax.Constructor = Parallax;
// Parallax No Conflict
$.fn.parallax.noConflict = function () {
$.fn.parallax = old;
return this;
};
// Parallax Data-API
$( function () {
$('[data-parallax="scroll"]').parallax();
});
}(jQuery, window, document));
File diff suppressed because one or more lines are too long
@@ -16,8 +16,19 @@
margin-top: -3rem;
}
#sb-site{
background: none !important;
#body{
background: none !important;
padding-bottom: 2rem !important;
}
}
#header.scrolled {
padding-left: 2rem;
padding-right: 2rem;
}
#header #navbar ul.navigation li a {
font-family: "Sarabun", sans-serif;
font-weight: 400;
@@ -57,13 +68,17 @@
padding: 0.5rem;
max-height: 3rem;
margin:auto;
}
#gouv {
padding-right: 4rem;
}
}
#body {
p:empty { display:none; }
}
@@ -146,7 +161,7 @@
display: flex;
flex-wrap: wrap;
//
// background-image:
// url("/user/themes/epau-antimatter/images/14360_default_big.jpg") ,
// url("/user/themes/epau-antimatter/images/10361_web_01.jpg") ,
@@ -173,44 +188,49 @@
padding-bottom: 8rem;
}
.paralax {
position: absolute !important;
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
// transform: translate3d(0px, -128px, 0px);
#photo1 {
position: relative;
top: -60px;
}
#photo2 {
z-index: 0;
width:700px !important;
position: relative;
top: 260px;
}
#photo3 {
z-index: 0;
width:700px !important;
position: relative;
top: 500px;
}
#photo4 {
z-index: 0;
width:700px !important;
position: relative;
top: 300px;
}
.parallax-window {
// min-height: 400px;
background: transparent;
// height: 1534px;
// overflow: hidden;
}
// .images-background {
// position: absolute !important;
// width: 100%;
// display: flex;
// flex-direction: row;
// flex-wrap: wrap;
// justify-content: space-between;
//
// #photo1 {
// position: relative;
// top: -60px;
//
// }
//
// #photo2 {
// z-index: 0;
// width:700px !important;
// position: relative;
// top: 260px;
// }
//
// #photo3 {
// z-index: 0;
// width:700px !important;
// position: relative;
// top: 300px;
// }
//
// #photo4 {
// z-index: 0;
// width:700px !important;
// position: relative;
// top: 300px;
// }
// }
.programme {
z-index: 1;
@@ -224,6 +244,7 @@
h4 {
text-transform: uppercase;
line-height: 1.2;
}
img {
@@ -234,6 +255,7 @@
font-family: $font-family-default;
font-weight: 500;
font-style: italic;
padding-bottom: 1.5rem;
}
}
@@ -251,66 +273,49 @@
}
}
// .parallax {
// display: block;
// }
//
// /* .titre_nsb {
// display: block;
// position: absolute;
// margin-right: 39%;
// } */
//
//
// /* .ressources {
// display: flex;
// flex-wrap: wrap;
// justify-content: space-between;
// background-color: #ffffff;
// padding-top: 8rem;
// padding-right: 5rem;
// padding-left: 5rem;
// } */
//
// /* .ressource {
// max-width: 20%;
// margin-block: 5rem;
// flex-wrap: wrap;
// flex: 0 1 15%;
// } */
//
//
// /*
// .ressources h1 {
// text-transform: uppercase;
// background-color: #fff;
// color: #000;
// padding-top: 5rem;
// padding-bottom: 6rem;
// } */
//
// /* .ressources {
// display: grid;
// grid-template-columns: repeat(4, 1fr);
// grid-gap: 3rem;
// grid-auto-rows: auto;
// background-color: #ffffff;
// padding-top: 18rem;
// justify-items: center;
// position: relative;
// margin-right: 10%;
// margin-bottom: 6rem;
// margin-left: 10%;
// } */
//
// /* .ressources img {
// max-width: 50%;
// } */
//
// /* .ressource h1 h2 h3 h4 {
// margin: 0.2rem;
// } */
/*CSS pour afficher/masquer un texte via un bouton*/
/*Style du module TEXTE*/
.texte-cache {
position: relative;
max-height: 400px; /*Hauteur du texte visible avant le clic*/
overflow: hidden; /*On cache tout ce qui dépasse des 500px*/
transition: max-height 1s ease; /* Transition CSS entre l'ouverture et la fermeture*/
}
/*Style du module TEXTE lorsqu'il est ouvert*/
.texte-cache.ouvert {
max-height: 100vh; /* On lui définit une hauteur max de tout l'écran si nécessaire pour qu'il affiche tout son contenu*/
}
/*On stylise l'effet de flou lorsque le module TEXTE est fermé, donc il n'a pas la classe "ouvert"*/
.texte-cache:not(.ouvert)::after {
content: '';
position: absolute;
top: 400px;
bottom: 0;
left: 0;
right: 0;
// background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)); /*Couleur de notre effet*/
}
.bouton-ouverture {
position: relative;
justify-content: center;
cursor: pointer;
border: solid;
background-color: transparent;
text-transform: uppercase;
left: 45%;
margin-top: 3rem;
margin-bottom: 5rem;
// align-self: flex-end;
// margin-right: 2rem;
// margin: auto;
}
.gouvernance {
background-color: #000;
@@ -321,10 +326,9 @@
}
.mozaique_personnes {
background-color: #d5d2d1;
padding-bottom: 4rem;
@@ -334,10 +338,11 @@
flex-wrap: wrap;
// margin-left: 15%;
// padding-right: 15%;
width: 54%;
width: 100%;
padding-left: 22%;
padding-right: 15%;
margin: auto;
// justify-items: center;
justify-items: center;
h3 {
// display: flex;
@@ -432,33 +437,17 @@
}
// .mozaique :hover {
// background-color: #000;
// color: #fff;
// }
// comment faire pour donner une largueur à .info 2 fois plus grande que .portrait? les img de .portrait ne semblent pas vouloir bouger...
.bouton {
border: solid;
background-color: transparent;
text-transform: uppercase;
align-self: flex-end;
margin-right: 2rem;
margin:auto;
}
//
// .bouton :hover {
@@ -539,3 +528,75 @@
// .modal .container a.close:hover{
// color: black;
// }
#new-footer {
// position:absolute;
display: flex;
flex-direction: column;
.tothetop {
position: absolute;
// align-self: center;
height: 1rem;
bottom: $footer-height + 10rem;
text-align: center;
left: 0;
right: 0;
span {
font-size: 1.7rem;
line-height: 2,5rem;
background: #fff;
width: 4rem;
height: 5rem;
border-radius: $border-radius;
display: inline-block;
text-align: top;
}
}
.footer {
display: flex;
flex-direction: row;
.footer-logos {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
width: 70%;
align-items: center;
margin-left: 3rem;
img {
min-height: 4rem;
max-height: 4rem;
padding-right: 1rem;
}
}
.contact {
display: flex;
flex-direction: column;
width: 30%;
margin-top: 1.5rem;
align-items: flex-start;
img {
margin-bottom: 1rem;
max-height: 2rem;
}
svg {
margin-bottom: 1rem;
}
h6 {
margin: 0 !important;
font-weight: 600;
}
p {
margin: 0;
}
}
}
}
@@ -6,6 +6,7 @@
{% block javascripts %}
{% if show_onpage_menu %}
{% do assets.add('theme://js/singlePageNav.min.js') %}
{% endif %}
{{ parent() }}
{% endblock %}
@@ -1,6 +1,6 @@
<div class="equipe"{{ page.header.class}}">
<div class="equipe {{ page.header.class}}">
{{ content|raw }}
@@ -49,21 +49,3 @@
</div>
<!--
<script>
// var .message = {{ personne.biographie }};
$(".bouton").click(function(event){
$("#modal .message").html();
$("#modal").addClass("open");
// $("#body").addClass("grey");
});
$("#modal .mask, #modal a.close").click(function(){
$("#modal").removeClass("open");
return false;
});
</script> -->
@@ -1,13 +1,18 @@
<div class="programmes{{ page.header.class}}">
<div
class="programmes{{ page.header.class}} parallax-window"
data-parallax="scroll"
data-image-src="{{ url('theme://images/jeux-olypiques-paris-2024-village-athle-lot-e2.jpg') }}">
<!-- <div class="parallax-window" data-parallax="scroll" data-image-src="/path/to/image.jpg"></div> -->
<!-- <div class="images-background parallax parallax-window" data-parallax="scroll">
<div class="background paralax">
<img id="photo1" src="/user/themes/epau-antimatter/images/14360_default_big.jpg" alt="photo 1" />
<img id="photo2" src="/user/themes/epau-antimatter/images/10361_web_01.jpg" alt="photo 2" />
<img id="photo3" src="/user/themes/epau-antimatter/images/hyperliens_marseille_.PNG" alt="photo 3" />
<img id="photo4" src="/user/themes/epau-antimatter/images/jeux-olypiques-paris-2024-village-athle-lot-e2.jpg" alt="photo 4" />
</div>
</div> -->
{{ content|raw }}
@@ -22,25 +22,33 @@
<div class="features {{ page.header.class}}">
<div class="feature-items">
{% for rapport in page.header.rapports %}
<div class="texte-cache">
{% for rapport in page.header.rapports %}
<div class="feature">
<div class="feature ">
{% if rapport.couverture and rapport.pdf %}
<a href="{{page.media[rapport.pdf].url|e }}" download >
<img src="{{page.media[rapport.couverture].url|e }}" alt="couverture du {{rapport.titre_du_rapport}}" />
</a>
{% endif %}
{% if rapport.titre_du_rapport %}
<h4>{{ rapport.titre_du_rapport }}</h4>
{% endif %}
{% if rapport.texte_de_presentation %}
<p>{{ rapport.texte_de_presentation|markdown }}</p>
{% endif %}
{% if rapport.couverture and rapport.pdf %}
<a href="{{page.media[rapport.pdf].url|e }}" download >
<img src="{{page.media[rapport.couverture].url|e }}" alt="couverture du {{rapport.titre_du_rapport}}" />
{% endif %}
{% if rapport.titre_du_rapport %}
<h4>{{ rapport.titre_du_rapport }}</h4>
{% endif %}
{% if rapport.texte_de_presentation %}
<p>{{ rapport.texte_de_presentation|markdown }}</p>
{% endif %}
</a>
</div>
{% endfor %}
</div>
</div>
{% endfor %}
</div>
</div>
</div>
<!-- <a href=""> -->
<button class="bouton-ouverture">Voir plus</button>
<!-- </a> -->
@@ -1,9 +1,28 @@
<div class="callout">
{% set image = page.media.images|first %}
{% if image %}
{{ image.cropResize(400,400).html('','','align-'~page.header.image_align)|raw }}
{% endif %}
<div id="new-footer">
{{ content|raw }}
<div class="tothetop">
<span><a href="#" id="toTop"><i class="fa fa-arrow-up"></i></a></span>
</div>
<div class="footer">
<div class="footer-logos">
{{ content|raw }}
</div>
<div class="contact">
<img src="{{ url('theme://images/EPAU_logo_EPAU_vecto-seul.svg')}}" alt="logo EPAU">
<svg width="200" height="5" version="1.1" xmlns="http://www.w3.org/2000/svg">
<line x1="0" x2="30" stroke="black" fill="transparent" stroke-width="5"/>
</svg>
<h6>CONTACT :</h6>
<p>Fabienne.Dran@developpement-durable.gouv.fr</br>
+33 (0)1 40 81 9327</br>
+33 (0)7 86 5033 31.</p>
</div>
</div>
</div>
@@ -32,7 +32,7 @@
{% do assets.addJs('jquery', 101) %}
{% do assets.addJs('theme://js/modernizr.custom.71422.js', 100) %}
{% do assets.addJs('theme://js/antimatter.js') %}
{% do assets.addJs('theme://js/parallax.js') %}
{% do assets.addJs('theme://js/slidebars.min.js') %}
{% endblock %}
@@ -52,8 +52,8 @@
<div id="logo">
<img src="/user/pages/01.home/Republique-francaise-logo-sans-text.svg" alt="logo République Française">
<img src="user/pages/01.home/EPAU_logo_EPAU_vecto-seul.svg" alt="logo EPAU">
<img id="gouv" src="/user/pages/01.home/Republique-francaise-logo-sans-text.svg" alt="logo République Française">
<img id="epau" src="user/pages/01.home/EPAU_logo_EPAU_vecto-seul.svg" alt="logo EPAU">
</div>
@@ -81,14 +81,14 @@
</section>
{% endblock %}
{% block footer %}
<!-- {% block footer %}
<footer id="footer">
<div class="totop">
<span><a href="#" id="toTop"><i class="fa fa-arrow-up"></i></a></span>
</div>
<p><a href="http://getgrav.org">Grav</a> was <i class="fa fa-code"></i> with <i class="fa fa-heart"></i> by <a href="http://www.rockettheme.com">RocketTheme</a>.</p>
</footer>
{% endblock %}
{% endblock %} -->
</div>
{% block sidebar_navigation %}
<div class="sb-slidebar sb-left sb-width-thin">
@@ -22,6 +22,8 @@
{{ p.menu }}
</a>
</li>
{% endif %}
{% endfor %}
{% endmacro %}
@@ -51,5 +53,5 @@
{% if config.plugins.login.enabled and grav.user.username %}
<li><i class="fa fa-lock"></i> {% include 'partials/login-status.html.twig' %}</li>
{% endif %}
</ul>
</ul>