commit ba544370036e430a693658dbb7f5a04cadabe3d3
author Lokesh Yadav <54428357+Lokesh3152@users.noreply.github.com> Tue Dec 07 15:09:27 2021 +0530
committer Jackeagle <jackeagle102@gmail.com> Tue Dec 07 15:16:25 2021 +0530
tree 5667693c27d1d9317ca4c7b11bab1b6489ed3a83
parent 5f643c686874bc2f56dfa68a53930649460a0d67

Complete Revamp and Redesigned BlissRoms Website

Co-authored-by: Ayan Mukherjee <mukherjeeayan725@gmail.com>
Signed-off-by: Ayan Mukherjee <mukherjeeayan725@gmail.com>
Signed-off-by: Jackeagle <jackeagle102@gmail.com>

components/carrousel.html

diff --git a/components/carrousel.html b/components/carrousel.html
new file mode 100644
index 0000000..9a39d9e
--- /dev/null
+++ b/components/carrousel.html
@@ -0,0 +1,51 @@
+<div>
+  <link href="./carrousel.css" rel="stylesheet" />
+  <div class="carrousel-carrousel">
+    <span class="carrousel-title h3-36"><span>Screenshots</span></span>
+    <div class="carrousel-images">
+      <div data-action="goLeft" class="carrousel-go-left">
+        <svg viewBox="0 0 1024 1024" class="carrousel-icon">
+          <path d="M658 708l-60 60-256-256 256-256 60 60-196 196z"></path>
+        </svg>
+      </div>
+      <div class="carrousel-slider">
+        <div class="carrousel-slides-container">
+          <img
+            src="https://images.unsplash.com/photo-1638292597251-6fe6b2ba50f9?ixid=Mnw5MTMyMXwwfDF8YWxsfDN8fHx8fHwyfHwxNjM4MzQwMjk2&ixlib=rb-1.2.1&h=300"
+            class="
+              carrousel-left
+              hidden-element
+              left-element left-element-initial
+            "
+          />
+          <img
+            src="https://images.unsplash.com/photo-1638190654307-66662e77fed9?ixid=Mnw5MTMyMXwwfDF8YWxsfDN8fHx8fHwyfHwxNjM4MjkzODc1&ixlib=rb-1.2.1&h=300"
+            class="carrousel-left1 left-element left-element-initial"
+          />
+          <img
+            src="https://images.unsplash.com/photo-1638204956063-5e65c3288d3c?ixid=Mnw5MTMyMXwwfDF8YWxsfDE3fHx8fHx8Mnx8MTYzODI5Mzg3NQ&ixlib=rb-1.2.1&h=300"
+            loading="lazy"
+            class="carrousel-mid mid-element mid-element-initial"
+          />
+          <img
+            src="https://images.unsplash.com/photo-1638210574680-b30164f073f3?ixid=Mnw5MTMyMXwwfDF8YWxsfDE5fHx8fHx8Mnx8MTYzODI5NzAzOQ&ixlib=rb-1.2.1&h=300"
+            class="carrousel-right right-element-initial right-element"
+          />
+          <img
+            src="https://images.unsplash.com/photo-1638043883400-33d4ab1017a1?ixid=Mnw5MTMyMXwwfDF8YWxsfDV8fHx8fHwyfHwxNjM4MzQwMjk2&ixlib=rb-1.2.1&h=300"
+            class="
+              carrousel-right1
+              hidden-element
+              right-element-initial right-element
+            "
+          />
+        </div>
+      </div>
+      <div data-action="goRight" class="carrousel-go-right">
+        <svg viewBox="0 0 1024 1024" class="carrousel-icon2">
+          <path d="M426 256l256 256-256 256-60-60 196-196-196-196z"></path>
+        </svg>
+      </div>
+    </div>
+  </div>
+</div>