reorganized code

2019-03-18 13:34:52 +01:00
parent 6b34509d9a
commit b2e0d78a2c
120 changed files with 1034 additions and 1067 deletions
--- a/_website/project-files/css/slider.css
+++ b/_website/project-files/css/slider.css
@@ -0,0 +1,100 @@
+/*--------------------------------------------------------------
+# Slider
+--------------------------------------------------------------*/
+.slider {height:auto; position:relative;}
+.slider .slide {
+	height:auto;
+}
+.slick-slider .slick-track, .slick-slider .slick-list, .slider .slide {height:100%;}
+.slider .slide img {width:100%; height:100%; object-fit:cover;}
+
+/* Arrows */
+.slider .slick-prev, .slider .slick-next {
+	position:absolute;
+	top:50%;
+	height:50px;
+	width:50px;
+	margin-top:-25px;
+	z-index:1000;
+    cursor: pointer;
+    color: transparent;
+	border: none;
+    outline: none;
+    background: #b1b1b1;
+    opacity:0;
+    -webkit-opacity:0;
+    -moz-opacity:0;
+    visibility:hidden;
+    transition:all 0.3s;
+    display:flex;
+    display:-webkit-flex;
+    align-items:center;
+    justify-content: center;
+    text-align:center;
+}
+.slider:hover .slick-prev, .slider:hover .slick-next {
+	opacity:1;
+    -webkit-opacity:1;
+    -moz-opacity:1;
+    visibility:visible;
+}
+.slider .slick-prev {left:20px;}
+.slider .slick-next {right:20px;}
+
+.slider .slick-prev:before, .slider .slick-next:before {
+	font-family: 'FontAwesome';
+	color:#000;
+	font-size:40px;
+	position:absolute;
+	display:block;
+	width:100%;
+}
+.slider .slick-prev:before {
+	content:"\f104";
+	padding-right:3px;
+}
+.slider .slick-next:before {
+	content:"\f105";
+	padding-left:1px;
+}
+
+.white_arrows .slick-prev:before, .white_arrows .slick-next:before {color:#FFF;}
+
+/* Dots */
+.slider .slick-dots {
+	width:100%;
+	position:absolute;
+	bottom:10px;
+	display:flex;
+	display:-webkit-flex;
+	align-items:center;
+	justify-content:center;
+	list-style-type:none;
+	margin:0;
+	padding:0;
+}
+.slider .slick-dots li {
+	width:15px;
+	height:15px;
+	margin:0 10px;
+	background:#b1b1b1;
+	cursor:pointer;
+}
+.slider .slick-dots li button {
+	color: transparent;
+	border: none;
+    outline: none;
+    background: transparent;
+    width:100%;
+    height:100%;
+    cursor:pointer;
+}
+.slider .slick-dots li.slick-active {background:#464645;}
+
+
+@media(min-width:768px) {
+	.slider .slick-dots {
+		bottom:70px;
+	}
+	.slider {height:340px;}
+}