bachir/popsu-d9
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

modification - mail 23/08

Browse Source
This commit is contained in:
armansansd 2021-08-24 16:03:41 +02:00
parent b1f6e1637d
commit e6595d6869
8 changed files with 234 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

122
web/themes/custom/popsu/css/styles.css
View File

@ -1322,8 +1322,8 @@ iframe {
.header_top_left_container > div[id=''] { .header_top_left_container > div[id=''] {
height: 100%; } height: 100%; }
.header_top_left_container a[rel~='home'] { .header_top_left_container a[rel~='home'] {
display: none;
height: 100%; height: 100%;
display: block;
font-size: 0; font-size: 0;
color: transparent; color: transparent;
background: left/contain no-repeat url(../images/POPSU_logo.svg); } background: left/contain no-repeat url(../images/POPSU_logo.svg); }
@ -1590,7 +1590,8 @@ footer {
.last-ressources .views-field-view-node { .last-ressources .views-field-view-node {
grid-row: 4 / span 1; grid-row: 4 / span 1;
grid-column: 2 / span 1; grid-column: 2 / span 1;
margin-bottom: 1rem; } margin-bottom: 1rem;
display: none; }
.last-ressources .views-field-field-programme { .last-ressources .views-field-field-programme {
text-transform: uppercase; text-transform: uppercase;
@ -1654,7 +1655,7 @@ footer {
font-size: 0.8rem; font-size: 0.8rem;
text-align: center; text-align: center;
padding: 18rem 0 3rem 0; padding: 18rem 0 3rem 0;
margin-top: -20rem; } margin-top: -16rem; }
.about .views-row .views-field-title { .about .views-row .views-field-title {
font-family: "duke" !important; font-family: "duke" !important;
font-size: 1.6rem; font-size: 1.6rem;
@ -1762,20 +1763,23 @@ footer {
background-clip: content-box; background-clip: content-box;
min-height: 11rem; min-height: 11rem;
width: 100%; width: 100%;
display: grid; display: flex;
align-items: center; flex-wrap: wrap;
align-items: flex-start;
align-content: center;
padding: 1rem; } padding: 1rem; }
#home_prog_container .views-row .views-field:not(.views-field-field-logo) { #home_prog_container .views-row .views-field:not(.views-field-field-logo) {
font-size: 0.8rem; font-size: 0.8rem;
font-weight: 600; font-weight: 600;
display: none; } display: none; }
#home_prog_container .views-row .views-field-title { #home_prog_container .views-row .views-field-title {
margin-bottom: 1rem; } margin-bottom: .7rem; }
#home_prog_container .views-row:hover .views-field:not(.views-field-field-logo) { #home_prog_container .views-row:hover .views-field:not(.views-field-field-logo) {
font-weight: 600; font-weight: 600;
display: block; display: block;
color: white; color: white;
text-align: center; } text-align: center;
flex-basis: 100%; }
#home_prog_container .views-row:hover .views-field:not(.views-field-field-logo) a { #home_prog_container .views-row:hover .views-field:not(.views-field-field-logo) a {
text-decoration: none; } text-decoration: none; }
#home_prog_container .views-row .views-field-field-logo { #home_prog_container .views-row .views-field-field-logo {
@ -1801,7 +1805,7 @@ footer {
#home_prog_container .programme-3:hover img { #home_prog_container .programme-3:hover img {
display: none; } display: none; }
#home_prog_container .programme-5 img { #home_prog_container .programme-5 img {
width: 45%; } width: 50%; }
#home_prog_container .programme-5:hover { #home_prog_container .programme-5:hover {
background: #ab9569; } background: #ab9569; }
#home_prog_container .programme-5:hover img { #home_prog_container .programme-5:hover img {
@ -2493,6 +2497,9 @@ article p, .paragraph p {
right: 0; right: 0;
top: 0; } top: 0; }
.page-node-type-programme #programme_toc-block_7 {
display: none; }
.page-node-type-programme #programme_toc-block_5 .slick-slide { .page-node-type-programme #programme_toc-block_5 .slick-slide {
margin: 0 1rem; } margin: 0 1rem; }
@ -2659,6 +2666,7 @@ article p, .paragraph p {
.page-node-type-programme .block-region-first .views-element-container header { .page-node-type-programme .block-region-first .views-element-container header {
font-family: "duke"; font-family: "duke";
font-size: 1.6rem; font-size: 1.6rem;
text-transform: uppercase;
cursor: pointer; cursor: pointer;
transition: all 250ms; } transition: all 250ms; }
.page-node-type-programme .block-region-first .views-element-container header:hover { .page-node-type-programme .block-region-first .views-element-container header:hover {
@ -2715,28 +2723,47 @@ article p, .paragraph p {
.page-node-type-programme .block-region-third .views-field a:hover { .page-node-type-programme .block-region-third .views-field a:hover {
text-decoration: underline; } text-decoration: underline; }
.page-node-type-programme article .computed_projets_references { .page-node-type-programme article .computed_projets_references, .page-node-type-programme article .computed_themes_references, .page-node-type-programme article .field_logo {
display: none; } display: none; }
.page-node-type-programme article h2:first-child { .page-node-type-programme article h2:first-child {
display: none; } display: none; }
.page-node-type-programme article .body { .page-node-type-programme article .body {
font-size: 0.8rem; } font-size: 0.8rem;
height: 20rem;
.page-node-type-programme article .field_textes .paragraph .field_titre { overflow: hidden;
font-size: 1rem;
font-weight: 600;
text-transform: initial;
cursor: pointer;
margin-top: 1rem; }
.page-node-type-programme article .field_textes .paragraph .field_texte {
position: relative; position: relative;
transition: all 250ms; } -webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease; }
.page-node-type-programme article .body footer {
position: absolute;
bottom: 0;
left: 0;
z-index: 1;
width: 100%;
text-align: center; }
.page-node-type-programme article .body footer a {
display: inline-block;
margin: 0 auto;
background: black;
color: white;
cursor: pointer;
font-family: "trueno";
font-weight: 500;
padding: .5rem 1rem;
font-size: 0.45rem;
text-decoration: none;
text-transform: uppercase; }
.page-node-type-programme article .body footer a:hover {
color: black;
background: white; }
.page-node-type-programme article .field_textes .paragraph .crop:after { .page-node-type-programme article .body:after {
content: ""; content: "";
opacity: 1;
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0; bottom: 0;
@ -2744,10 +2771,57 @@ article p, .paragraph p {
right: -15px; right: -15px;
box-shadow: inset white 0 -4rem 2rem; } box-shadow: inset white 0 -4rem 2rem; }
.page-node-type-programme article .field_textes .paragraph .crop { .page-node-type-programme article .body_open {
max-height: 7rem; height: auto;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease; }
.page-node-type-programme article .body_open:after {
opacity: 0;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease; }
.page-node-type-programme article .field_textes .paragraph {
border-bottom: 3px dotted gray;
padding: 1rem 0; }
.page-node-type-programme article .field_textes .paragraph .field_titre {
font-size: 1rem;
font-weight: 600;
text-transform: initial;
cursor: pointer; }
.page-node-type-programme article .field_textes .paragraph .field_titre:after {
content: '▼';
float: right;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease; }
.page-node-type-programme article .field_textes .paragraph .rotate:after {
transform: rotate(180deg);
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease; }
.page-node-type-programme article .field_textes .paragraph .field_texte {
height: auto;
position: relative;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease; }
.page-node-type-programme article .field_textes .paragraph .field_texte h2 {
text-transform: inherit; }
.page-node-type-programme article .field_textes .paragraph .crop {
height: 0;
overflow: hidden; overflow: hidden;
transition: all 250ms; } display: none;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease; }
.page-node-type-programme .block-region-bottom { .page-node-type-programme .block-region-bottom {
background: url(../images/motif_croix.svg); } background: url(../images/motif_croix.svg); }

2
web/themes/custom/popsu/css/styles.css.map
View File

File diff suppressed because one or more lines are too long

2
web/themes/custom/popsu/js/main.js
View File

File diff suppressed because one or more lines are too long

15
web/themes/custom/popsu/lib/script.js
View File

@ -14,7 +14,7 @@ $(function(){
slidesToScroll: 1, slidesToScroll: 1,
centerMode: true, centerMode: true,
centerPadding: '60px', centerPadding: '60px',
infinite: false, infinite: true,
}); });
} }
@ -34,6 +34,7 @@ $(function(){
centerPadding: '60px', centerPadding: '60px',
infinite: false, infinite: false,
}); });
if($(".path-actus").length > 0){ if($(".path-actus").length > 0){
let elem = $("#actus_blocks-block_2").find("footer").detach(); let elem = $("#actus_blocks-block_2").find("footer").detach();
$("#actus_blocks-block_2").append(elem); $("#actus_blocks-block_2").append(elem);
@ -176,6 +177,7 @@ $(function(){
//// PAGE POPSU //// //// PAGE POPSU ////
// projets-block_2 // projets-block_2
if($(".page-node-type-programme").length > 0){ if($(".page-node-type-programme").length > 0){
$(".body").append('<footer><a class="more">Lire la suite</a></footer>');
let elem = "<div class='main_logo'></div>" let elem = "<div class='main_logo'></div>"
$('#projets-block_2').prepend(elem); $('#projets-block_2').prepend(elem);
@ -184,6 +186,17 @@ if($(".page-node-type-programme").length > 0){
$(".field_titre").on("click", function(){ $(".field_titre").on("click", function(){
let e = $(this).parent().find(".field_texte"); let e = $(this).parent().find(".field_texte");
$(e).toggleClass("crop"); $(e).toggleClass("crop");
$(this).toggleClass("rotate");
});
$(".more").on("click", function(){
$(".body").toggleClass("body_open");
if($('.body_open').length > 0){
$(this).empty().html("Fermer")
}else{
$(this).empty().html("Lire la suite")
}
}); });

20
web/themes/custom/popsu/popsu.theme
View File

@ -7,16 +7,8 @@
use Drupal\Core\Template\Attribute; use Drupal\Core\Template\Attribute;
// /* implements template_preprocess_html() */ // function popsu_preprocess_views_view_list(&$variables){
// function popsu_preprocess_page(&$variables) { // kint($variables);die();
// //var_dump($variables);
// // $variables['attributes']['class'][] = 'pouette';
// //pour page popsu :
// $nid = $variables['node']->nid->getString();
// //$variables['attributes']['class'][] = 'programme-'.$nid;
// //kint($nid);
// //pour popsu : - fetch nid
// } // }
function popsu_preprocess_html(&$variables) { function popsu_preprocess_html(&$variables) {
@ -35,9 +27,8 @@ function popsu_preprocess_html(&$variables) {
function popsu_preprocess_field(&$variables){ function popsu_preprocess_field(&$variables){
$element = &$variables['element']; $element = &$variables['element'];
// $items = &$variables['items'];
if (isset($element['#field_name'])) { if (isset($element['#field_name'])) {
// kint($element['#field_name']);
$variables['attributes']['class'][] = $element['#field_name']; $variables['attributes']['class'][] = $element['#field_name'];
if ($element['#field_name'] == 'field_texte') { if ($element['#field_name'] == 'field_texte') {
$variables['attributes']['class'][] = 'crop'; $variables['attributes']['class'][] = 'crop';
@ -67,7 +58,6 @@ function popsu_preprocess_views_view_unformatted(&$variables) {
$variables['rows'][$id]['attributes']->addClass("programme-".$c); $variables['rows'][$id]['attributes']->addClass("programme-".$c);
if ($entity->hasField('field_type_de_ressource') && $entity->get('field_type_de_ressource')->getString() == "74" ) { if ($entity->hasField('field_type_de_ressource') && $entity->get('field_type_de_ressource')->getString() == "74" ) {
$type = $entity->get('field_type_de_ressource')->getString(); $type = $entity->get('field_type_de_ressource')->getString();
// $variables['rows'][$id]['attributes'] = new Attribute();
$variables['rows'][$id]['attributes']['class'][] = "type-".$type; $variables['rows'][$id]['attributes']['class'][] = "type-".$type;
} }
} }
@ -77,7 +67,7 @@ function popsu_preprocess_views_view_unformatted(&$variables) {
$c = $r->get('field_programme')->getString(); $c = $r->get('field_programme')->getString();
$variables['rows'][$id]['attributes'] = new Attribute(); $variables['rows'][$id]['attributes'] = new Attribute();
$variables['rows'][$id]['attributes']->addClass("programme-".$c); $variables['rows'][$id]['attributes']->addClass("programme-".$c);
// kint($c);die();
} }
} }
@ -214,6 +204,4 @@ function popsu_preprocess_block__entity_field(&$variables){
} }
// if($items->isEmpty()){
// }
} }

14
web/themes/custom/popsu/sass/pages/_home.scss
View File

@ -175,6 +175,7 @@
grid-row: 4 / span 1; grid-row: 4 / span 1;
grid-column: 2 / span 1; grid-column: 2 / span 1;
margin-bottom: 1rem; margin-bottom: 1rem;
display: none;
} }
.views-field-field-programme{ .views-field-field-programme{
text-transform: uppercase; text-transform: uppercase;
@ -279,7 +280,7 @@
font-size: $font-medium; font-size: $font-medium;
text-align: center; text-align: center;
padding: 18rem 0 3rem 0; padding: 18rem 0 3rem 0;
margin-top: -20rem; margin-top: -16rem;
.views-row{ .views-row{
.views-field-title{ .views-field-title{
font-family: "duke" !important; font-family: "duke" !important;
@ -422,8 +423,10 @@
background-clip: content-box; background-clip: content-box;
min-height: 11rem; min-height: 11rem;
width: 100%; width: 100%;
display: grid; display: flex;
align-items: center; flex-wrap: wrap;
align-items: flex-start;
align-content: center;
padding: 1rem; padding: 1rem;
.views-field:not(.views-field-field-logo){ .views-field:not(.views-field-field-logo){
font-size: $font-medium; font-size: $font-medium;
@ -432,7 +435,7 @@
} }
.views-field-title{ .views-field-title{
margin-bottom: 1rem; margin-bottom: .7rem;
} }
&:hover{ &:hover{
.views-field:not(.views-field-field-logo){ .views-field:not(.views-field-field-logo){
@ -440,6 +443,7 @@
display: block; display: block;
color: white; color: white;
text-align: center; text-align: center;
flex-basis: 100%;
a{ a{
text-decoration: none; text-decoration: none;
@ -501,7 +505,7 @@
.programme-5{ .programme-5{
// background: center / 45% no-repeat url(../images/POPSU_monde.svg) white; // background: center / 45% no-repeat url(../images/POPSU_monde.svg) white;
img{ img{
width: 45%; width: 50%;
} }
&:hover{ &:hover{
background: $col-mond; background: $col-mond;

119
web/themes/custom/popsu/sass/pages/_programme.scss
View File

@ -1,5 +1,8 @@
.page-node-type-programme{ .page-node-type-programme{
//hide logo in header
#programme_toc-block_7{
display: none;
}
//galerie de la page popsu - top (copy de home) //galerie de la page popsu - top (copy de home)
#programme_toc-block_5{ #programme_toc-block_5{
.slick-slide{ .slick-slide{
@ -253,6 +256,7 @@
header{ header{
font-family: "duke"; font-family: "duke";
font-size: $font-large; font-size: $font-large;
text-transform: uppercase;
cursor: pointer; cursor: pointer;
transition: all 250ms; transition: all 250ms;
&:hover{ &:hover{
@ -353,42 +357,125 @@
article{ article{
// font-size: $font-small; // font-size: $font-small;
//temp hidden //temp hidden
.computed_projets_references{ .computed_projets_references, .computed_themes_references, .field_logo{
display: none; display: none;
} }
// // temp ??
h2:first-child{ h2:first-child{
display: none; display: none;
} }
.body{ .body{
font-size: $font-medium; font-size: $font-medium;
height: 20rem;
overflow: hidden;
position: relative;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
footer{
position:absolute;
bottom:0;
left:0;
z-index: 1;
width: 100%;
text-align: center;
a{
display: inline-block;
margin: 0 auto;
background: black;
color: white;
cursor:pointer;
font-family: "trueno";
font-weight: 500;
padding: .5rem 1rem;
font-size: $font-small;
text-decoration: none;
text-transform: uppercase;
&:hover{
color:black;
background: white;
}
}
}
}
.body:after{
content: "";
opacity: 1;
position: absolute;
top: 0; bottom: 0; left: -15px; right: -15px;
box-shadow: inset white 0 -4rem 2rem;
}
.body_open{
height: auto;
&:after{
opacity: 0;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
} }
.field_textes{ .field_textes{
.paragraph{ .paragraph{
// border-top: 1px solid black;
border-bottom: 3px dotted gray;
padding: 1rem 0;
.field_titre{ .field_titre{
font-size: $font-big; font-size: $font-big;
font-weight: 600; font-weight: 600;
text-transform: initial; text-transform: initial;
cursor:pointer; cursor: pointer;
margin-top: 1rem; // margin-top: 1rem;
}
.field_titre:after{
content: '▼';
float: right;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}
.rotate:after{
transform: rotate(180deg);
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
} }
.field_texte{ .field_texte{
height: auto;
position: relative; position: relative;
// box-shadow: inset 0 -5rem 8rem $bck-col; h2{
transition: all 250ms; text-transform: inherit;
}
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
} }
.crop:after{
content: "";
position: absolute;
top: 0; bottom: 0; left: -15px; right: -15px;
box-shadow: inset white 0 -4rem 2rem;
}
.crop{ .crop{
max-height: 7rem; height: 0;
overflow: hidden; overflow: hidden;
transition: all 250ms; display: none;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
} }
} }
} }

3
web/themes/custom/popsu/sass/pages/partials/_header_footer.scss
View File

@ -147,8 +147,9 @@
height: 100%; height: 100%;
} }
a[rel~='home']{ a[rel~='home']{
display: none;
height: 100%; height: 100%;
display: block; // display: block;
font-size: 0; font-size: 0;
color: transparent; color: transparent;
background: left / contain no-repeat url(../images/POPSU_logo.svg); background: left / contain no-repeat url(../images/POPSU_logo.svg);