slick-carrousel
This commit is contained in:
@@ -37,6 +37,7 @@
|
||||
"drupal/panels": "^4.6",
|
||||
"drupal/paragraphs": "1.x-dev@dev",
|
||||
"drupal/role_delegation": "^1.1",
|
||||
"drupal/slick": "^2.9",
|
||||
"drupal/structure_sync": "^2.0",
|
||||
"drupal/views_conditional": "^1.5",
|
||||
"drupal/webform": "^6.1",
|
||||
|
||||
Generated
+128
-1
@@ -4,7 +4,7 @@
|
||||
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
||||
"This file is @generated automatically"
|
||||
],
|
||||
"content-hash": "2d02333ad4ccdbef0bb58f0885e81016",
|
||||
"content-hash": "1a878f74aaba185433cefea4134018db",
|
||||
"packages": [
|
||||
{
|
||||
"name": "alchemy/zippy",
|
||||
@@ -2869,6 +2869,73 @@
|
||||
"source": "https://git.drupalcode.org/project/betterlogin"
|
||||
}
|
||||
},
|
||||
{
|
||||
"name": "drupal/blazy",
|
||||
"version": "2.16.0",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://git.drupalcode.org/project/blazy.git",
|
||||
"reference": "8.x-2.16"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://ftp.drupal.org/files/projects/blazy-8.x-2.16.zip",
|
||||
"reference": "8.x-2.16",
|
||||
"shasum": "ae84ac6083f734968eb9c7cc008b32aaa04c5b9c"
|
||||
},
|
||||
"require": {
|
||||
"drupal/core": "^8.8 || ^9 || ^10"
|
||||
},
|
||||
"conflict": {
|
||||
"drupal/csp": "<1.12"
|
||||
},
|
||||
"type": "drupal-module",
|
||||
"extra": {
|
||||
"drupal": {
|
||||
"version": "8.x-2.16",
|
||||
"datestamp": "1685788557",
|
||||
"security-coverage": {
|
||||
"status": "covered",
|
||||
"message": "Covered by Drupal's security advisory policy"
|
||||
}
|
||||
}
|
||||
},
|
||||
"notification-url": "https://packages.drupal.org/8/downloads",
|
||||
"license": [
|
||||
"GPL-2.0-or-later"
|
||||
],
|
||||
"authors": [
|
||||
{
|
||||
"name": "Gaus Surahman",
|
||||
"homepage": "https://www.drupal.org/u/gausarts",
|
||||
"role": "Maintainer"
|
||||
},
|
||||
{
|
||||
"name": "Contributors",
|
||||
"homepage": "https://www.drupal.org/node/2663268/committers",
|
||||
"role": "Contributor"
|
||||
},
|
||||
{
|
||||
"name": "geek-merlin",
|
||||
"homepage": "https://www.drupal.org/user/229048"
|
||||
},
|
||||
{
|
||||
"name": "sun",
|
||||
"homepage": "https://www.drupal.org/user/54136"
|
||||
}
|
||||
],
|
||||
"description": "Provides basic bLazy integration for lazy loading and multi-serving images.",
|
||||
"homepage": "https://drupal.org/project/blazy",
|
||||
"keywords": [
|
||||
"Drupal",
|
||||
"bLazy",
|
||||
"lazyload"
|
||||
],
|
||||
"support": {
|
||||
"source": "https://git.drupalcode.org/project/blazy",
|
||||
"issues": "https://drupal.org/project/issues/blazy"
|
||||
}
|
||||
},
|
||||
{
|
||||
"name": "drupal/block_class",
|
||||
"version": "1.3.0",
|
||||
@@ -8344,6 +8411,66 @@
|
||||
"source": "https://git.drupalcode.org/project/search_api"
|
||||
}
|
||||
},
|
||||
{
|
||||
"name": "drupal/slick",
|
||||
"version": "2.9.0",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://git.drupalcode.org/project/slick.git",
|
||||
"reference": "8.x-2.9"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://ftp.drupal.org/files/projects/slick-8.x-2.9.zip",
|
||||
"reference": "8.x-2.9",
|
||||
"shasum": "1c2cec19148a096f875390e2fd6a9e56caf5bacd"
|
||||
},
|
||||
"require": {
|
||||
"drupal/blazy": ">=2.14",
|
||||
"drupal/core": "^8.8 || ^9 || ^10"
|
||||
},
|
||||
"type": "drupal-module",
|
||||
"extra": {
|
||||
"drupal": {
|
||||
"version": "8.x-2.9",
|
||||
"datestamp": "1685789618",
|
||||
"security-coverage": {
|
||||
"status": "covered",
|
||||
"message": "Covered by Drupal's security advisory policy"
|
||||
}
|
||||
}
|
||||
},
|
||||
"notification-url": "https://packages.drupal.org/8/downloads",
|
||||
"license": [
|
||||
"GPL-2.0-or-later"
|
||||
],
|
||||
"authors": [
|
||||
{
|
||||
"name": "Contributors",
|
||||
"homepage": "https://www.drupal.org/node/2232779/committers",
|
||||
"role": "Contributors"
|
||||
},
|
||||
{
|
||||
"name": "shadcn",
|
||||
"homepage": "https://www.drupal.org/user/571032"
|
||||
},
|
||||
{
|
||||
"name": "thalles",
|
||||
"homepage": "https://www.drupal.org/user/3589086"
|
||||
}
|
||||
],
|
||||
"description": "Slick carousel, the last carousel you'll ever need.",
|
||||
"homepage": "https://drupal.org/project/slick",
|
||||
"keywords": [
|
||||
"Drupal",
|
||||
"carousel",
|
||||
"slideshow"
|
||||
],
|
||||
"support": {
|
||||
"source": "https://git.drupalcode.org/project/slick",
|
||||
"issues": "https://drupal.org/project/issues/slick"
|
||||
}
|
||||
},
|
||||
{
|
||||
"name": "drupal/smart_trim",
|
||||
"version": "1.3.0",
|
||||
|
||||
@@ -1,5 +1,211 @@
|
||||
@charset "UTF-8";
|
||||
/*eql*/
|
||||
/*setup*/
|
||||
/* Slider */
|
||||
.slick-slider {
|
||||
position: relative;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
-ms-touch-action: pan-y;
|
||||
touch-action: pan-y;
|
||||
-webkit-tap-highlight-color: transparent; }
|
||||
|
||||
.slick-list {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 0; }
|
||||
.slick-list:focus {
|
||||
outline: none; }
|
||||
.slick-list.dragging {
|
||||
cursor: pointer;
|
||||
cursor: hand; }
|
||||
|
||||
.slick-slider .slick-track,
|
||||
.slick-slider .slick-list {
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
-moz-transform: translate3d(0, 0, 0);
|
||||
-ms-transform: translate3d(0, 0, 0);
|
||||
-o-transform: translate3d(0, 0, 0);
|
||||
transform: translate3d(0, 0, 0); }
|
||||
|
||||
.slick-track {
|
||||
position: relative;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto; }
|
||||
.slick-track:before, .slick-track:after {
|
||||
content: "";
|
||||
display: table; }
|
||||
.slick-track:after {
|
||||
clear: both; }
|
||||
.slick-loading .slick-track {
|
||||
visibility: hidden; }
|
||||
|
||||
.slick-slide {
|
||||
float: left;
|
||||
height: 100%;
|
||||
min-height: 1px;
|
||||
display: none; }
|
||||
[dir="rtl"] .slick-slide {
|
||||
float: right; }
|
||||
.slick-slide img {
|
||||
display: block; }
|
||||
.slick-slide.slick-loading img {
|
||||
display: none; }
|
||||
.slick-slide.dragging img {
|
||||
pointer-events: none; }
|
||||
.slick-initialized .slick-slide {
|
||||
display: block; }
|
||||
.slick-loading .slick-slide {
|
||||
visibility: hidden; }
|
||||
.slick-vertical .slick-slide {
|
||||
display: block;
|
||||
height: auto;
|
||||
border: 1px solid transparent; }
|
||||
|
||||
.slick-arrow.slick-hidden {
|
||||
display: none; }
|
||||
|
||||
/* Slider */
|
||||
.slick-loading .slick-list {
|
||||
background: #fff url("./ajax-loader.gif") center center no-repeat; }
|
||||
|
||||
/* Icons */
|
||||
@font-face {
|
||||
font-family: "slick";
|
||||
src: url("./fonts/slick.eot");
|
||||
src: url("./fonts/slick.eot?#iefix") format("embedded-opentype"), url("./fonts/slick.woff") format("woff"), url("./fonts/slick.ttf") format("truetype"), url("./fonts/slick.svg#slick") format("svg");
|
||||
font-weight: normal;
|
||||
font-style: normal; }
|
||||
|
||||
/* Arrows */
|
||||
.slick-prev,
|
||||
.slick-next {
|
||||
position: absolute;
|
||||
display: block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
line-height: 0px;
|
||||
font-size: 0px;
|
||||
cursor: pointer;
|
||||
background: transparent;
|
||||
color: transparent;
|
||||
top: 50%;
|
||||
-webkit-transform: translate(0, -50%);
|
||||
-ms-transform: translate(0, -50%);
|
||||
transform: translate(0, -50%);
|
||||
padding: 0;
|
||||
border: none;
|
||||
outline: none; }
|
||||
.slick-prev:hover, .slick-prev:focus,
|
||||
.slick-next:hover,
|
||||
.slick-next:focus {
|
||||
outline: none;
|
||||
background: transparent;
|
||||
color: transparent; }
|
||||
.slick-prev:hover:before, .slick-prev:focus:before,
|
||||
.slick-next:hover:before,
|
||||
.slick-next:focus:before {
|
||||
opacity: 1; }
|
||||
.slick-prev.slick-disabled:before,
|
||||
.slick-next.slick-disabled:before {
|
||||
opacity: 0.25; }
|
||||
.slick-prev:before,
|
||||
.slick-next:before {
|
||||
font-family: "slick";
|
||||
font-size: 20px;
|
||||
line-height: 1;
|
||||
color: white;
|
||||
opacity: 0.75;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale; }
|
||||
|
||||
.slick-prev {
|
||||
left: -25px; }
|
||||
[dir="rtl"] .slick-prev {
|
||||
left: auto;
|
||||
right: -25px; }
|
||||
.slick-prev:before {
|
||||
content: "←"; }
|
||||
[dir="rtl"] .slick-prev:before {
|
||||
content: "→"; }
|
||||
|
||||
.slick-next {
|
||||
right: -25px; }
|
||||
[dir="rtl"] .slick-next {
|
||||
left: -25px;
|
||||
right: auto; }
|
||||
.slick-next:before {
|
||||
content: "→"; }
|
||||
[dir="rtl"] .slick-next:before {
|
||||
content: "←"; }
|
||||
|
||||
/* Dots */
|
||||
.slick-dotted.slick-slider {
|
||||
margin-bottom: 30px; }
|
||||
|
||||
.slick-dots {
|
||||
position: absolute;
|
||||
bottom: -25px;
|
||||
list-style: none;
|
||||
display: block;
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%; }
|
||||
.slick-dots li {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
margin: 0 5px;
|
||||
padding: 0;
|
||||
cursor: pointer; }
|
||||
.slick-dots li button {
|
||||
border: 0;
|
||||
background: transparent;
|
||||
display: block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
outline: none;
|
||||
line-height: 0px;
|
||||
font-size: 0px;
|
||||
color: transparent;
|
||||
padding: 5px;
|
||||
cursor: pointer; }
|
||||
.slick-dots li button:hover, .slick-dots li button:focus {
|
||||
outline: none; }
|
||||
.slick-dots li button:hover:before, .slick-dots li button:focus:before {
|
||||
opacity: 1; }
|
||||
.slick-dots li button:before {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
content: "•";
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
font-family: "slick";
|
||||
font-size: 6px;
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
color: black;
|
||||
opacity: 0.25;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale; }
|
||||
.slick-dots li.slick-active button:before {
|
||||
color: black;
|
||||
opacity: 0.75; }
|
||||
|
||||
/*global*/
|
||||
@font-face {
|
||||
font-family: 'Font Awesome';
|
||||
|
||||
@@ -6,6 +6,8 @@ global-css:
|
||||
global-js:
|
||||
js:
|
||||
scripts/main.js: {}
|
||||
scripts/slick.js: {}
|
||||
|
||||
dependencies:
|
||||
- core/jquery
|
||||
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
|
||||
console.log('salut');
|
||||
// menu burger open
|
||||
|
||||
@@ -159,22 +160,71 @@ jQuery(function($) {
|
||||
|
||||
|
||||
// slideshow home // work but does the same for all node-type-actualite, faut limiter à ceux dans la path-frontpage
|
||||
var slideIndex = 1;
|
||||
showDivs(slideIndex);
|
||||
// var slideIndex = 1;
|
||||
// showDivs(slideIndex);
|
||||
|
||||
function plusDivs(n) {
|
||||
showDivs(slideIndex += n);
|
||||
}
|
||||
// function plusDivs(n) {
|
||||
// showDivs(slideIndex += n);
|
||||
// }
|
||||
|
||||
function showDivs(n) {
|
||||
var i;
|
||||
var x = document.getElementsByPath("node-type-actualite");
|
||||
if (n > x.length) {slideIndex = 1}
|
||||
if (n < 1) {slideIndex = x.length} ;
|
||||
for (i = 0; i < x.length; i++) {
|
||||
x[i].style.display = "none";
|
||||
}
|
||||
x[slideIndex-1].style.display = "block";
|
||||
}
|
||||
// function showDivs(n) {
|
||||
// var i;
|
||||
// var x = document.getElementsByPath("node-type-actualite");
|
||||
// if (n > x.length) {slideIndex = 1}
|
||||
// if (n < 1) {slideIndex = x.length} ;
|
||||
// for (i = 0; i < x.length; i++) {
|
||||
// x[i].style.display = "none";
|
||||
// }
|
||||
// x[slideIndex-1].style.display = "block";
|
||||
// }
|
||||
|
||||
/////////////////////////////////////////////////
|
||||
|
||||
////////////////////////////////////////////////
|
||||
|
||||
|
||||
(function($, window) {
|
||||
|
||||
// 'slick-carousel';
|
||||
var mobile = false;
|
||||
|
||||
$(function(){
|
||||
console.log("$ ready !!");
|
||||
|
||||
|
||||
// if( navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPod/i) || navigator.userAgent.match(/BlackBerry/i)){
|
||||
// mobile = true;
|
||||
// }
|
||||
|
||||
if($(".path-frontpage").length > 0){
|
||||
console.log(".path-frontpage");
|
||||
// $("#"+).fadeIn();
|
||||
|
||||
$(".node-type-actualite").slick({
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 4,
|
||||
centerMode: true,
|
||||
centerPadding: '300px',
|
||||
// appendDots: $(element),
|
||||
dots: true,
|
||||
// appendArrows: $(element),
|
||||
arrows: true,
|
||||
// prevArrow: '<button type="button" data-role="none" class="slick-prev">Previous</button>',
|
||||
// nextArrow: '<button type="button" data-role="none" class="slick-next">Next</button>',
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 800,
|
||||
settings: {
|
||||
centerPadding: '0',
|
||||
}
|
||||
}]
|
||||
|
||||
});
|
||||
console.log(".node-type-actualite");
|
||||
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
})(jQuery, window);
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,101 @@
|
||||
/* Slider */
|
||||
|
||||
.slick-slider {
|
||||
background-color: blue;
|
||||
position: relative;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
-ms-touch-action: pan-y;
|
||||
touch-action: pan-y;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
.slick-list {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
&.dragging {
|
||||
cursor: pointer;
|
||||
cursor: hand;
|
||||
}
|
||||
}
|
||||
.slick-slider .slick-track,
|
||||
.slick-slider .slick-list {
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
-moz-transform: translate3d(0, 0, 0);
|
||||
-ms-transform: translate3d(0, 0, 0);
|
||||
-o-transform: translate3d(0, 0, 0);
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
.slick-track {
|
||||
position: relative;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
content: "";
|
||||
display: table;
|
||||
}
|
||||
|
||||
&:after {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.slick-loading & {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
.slick-slide {
|
||||
float: left;
|
||||
height: 100%;
|
||||
min-height: 1px;
|
||||
[dir="rtl"] & {
|
||||
float: right;
|
||||
}
|
||||
img {
|
||||
display: block;
|
||||
}
|
||||
&.slick-loading img {
|
||||
display: none;
|
||||
}
|
||||
|
||||
display: none;
|
||||
|
||||
&.dragging img {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.slick-initialized & {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.slick-loading & {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.slick-vertical & {
|
||||
display: block;
|
||||
height: auto;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
}
|
||||
.slick-arrow.slick-hidden {
|
||||
display: none;
|
||||
}
|
||||
@@ -1,5 +1,9 @@
|
||||
/*eql*/
|
||||
|
||||
/*setup*/
|
||||
@import "../node_modules/slick-carousel/slick/slick.scss";
|
||||
@import "../node_modules/slick-carousel/slick/slick-theme.scss";
|
||||
|
||||
|
||||
/*global*/
|
||||
|
||||
@@ -10,6 +14,8 @@
|
||||
// @import "global/_reset";
|
||||
@import "global/_typography";
|
||||
@import "global/_mediaqueries";
|
||||
// @import "global/_slick-slider";
|
||||
|
||||
|
||||
|
||||
/*pages*/
|
||||
@@ -17,6 +23,7 @@
|
||||
@import "pages/partials/header_footer";
|
||||
@import "pages/home";*/
|
||||
|
||||
|
||||
// @import "pages/off_canvas_page_wrapper";
|
||||
@import "pages/_static";
|
||||
@import "pages/_home";
|
||||
|
||||
@@ -78,12 +78,10 @@
|
||||
'mySlides',
|
||||
]
|
||||
%}
|
||||
{# <button class="w3-button w3-display-left" onclick="plusDivs(-1)">❮</button> #}
|
||||
|
||||
<article{{ attributes.addClass(classes, 'field__items') }}>
|
||||
|
||||
{{ title_prefix }}
|
||||
<button class="w3-button w3-display-left" onclick="plusDivs(-1)">❮</button>
|
||||
{% if label and not page %}
|
||||
<h2{{ title_attributes }}>
|
||||
<a href="{{ url }}" rel="bookmark">{{ label }}</a>
|
||||
@@ -106,4 +104,3 @@
|
||||
</div>
|
||||
|
||||
</article>
|
||||
{# <button class="w3-button w3-display-right" onclick="plusDivs(+1)">❯</button> #}
|
||||
|
||||
@@ -62,15 +62,9 @@
|
||||
{% endif %}
|
||||
|
||||
{% if rows %}
|
||||
|
||||
<div class="view-content">
|
||||
{# {% if class="path-frontpage"%} #}
|
||||
{# <button class="w3-button w3-display-left" onclick="plusDivs(-1)">❮</button> #}
|
||||
{{ rows }}
|
||||
{# <button class="w3-button w3-display-right" onclick="plusDivs(+1)">❯</button> #}
|
||||
|
||||
{# {% else %} #}
|
||||
{# {{ rows }} #}
|
||||
{# {% endif %} #}
|
||||
|
||||
</div>
|
||||
{% elseif empty %}
|
||||
|
||||
Reference in New Issue
Block a user