diff --git a/Javascript/app.js b/Javascript/app.js index e69de29..7405e18 100644 --- a/Javascript/app.js +++ b/Javascript/app.js @@ -0,0 +1,8 @@ +const swiper = new Swiper('.swiper', { + direction: 'vertical', + loop: true, + + pagination: { + el: '.swiper-pagination', + }, +}); diff --git a/Src/elefant.jpg b/Src/elefant.jpg new file mode 100644 index 0000000..90062f5 Binary files /dev/null and b/Src/elefant.jpg differ diff --git a/Src/giraffe.jpg b/Src/giraffe.jpg new file mode 100644 index 0000000..ff9059f Binary files /dev/null and b/Src/giraffe.jpg differ diff --git a/Src/gorilla.jpg b/Src/gorilla.jpg new file mode 100644 index 0000000..03bd75c Binary files /dev/null and b/Src/gorilla.jpg differ diff --git a/Src/loewe.jpg b/Src/loewe.jpg new file mode 100644 index 0000000..e77c65d Binary files /dev/null and b/Src/loewe.jpg differ diff --git a/Src/zebra.jpg b/Src/zebra.jpg new file mode 100644 index 0000000..44a7ae3 Binary files /dev/null and b/Src/zebra.jpg differ diff --git a/Src/zoowebseite-high-resolution-logo-transparent.png b/Src/zoowebseite-high-resolution-logo-transparent.png index bb26bde..f577f3b 100644 Binary files a/Src/zoowebseite-high-resolution-logo-transparent.png and b/Src/zoowebseite-high-resolution-logo-transparent.png differ diff --git a/Src/zoowebseite-high-resolution-logo.png b/Src/zoowebseite-high-resolution-logo.png index 2f84bfc..305e750 100644 Binary files a/Src/zoowebseite-high-resolution-logo.png and b/Src/zoowebseite-high-resolution-logo.png differ diff --git a/Styles/style.css b/Styles/style.css index 0965a65..a5a2b40 100644 --- a/Styles/style.css +++ b/Styles/style.css @@ -1,4 +1,13 @@ section { width: 100%; height: 100vh; -} \ No newline at end of file +} + +.swiper { + width: 600px; + height: 300px; +} + +.swiper-pagination .swiper-pagination-bullet { + background-color: rgba(0, 0, 0, 1); +} diff --git a/index.html b/index.html index 4a9d82e..b7cca6a 100644 --- a/index.html +++ b/index.html @@ -1,54 +1,77 @@ - - - - - - ZooWebsite - - - - + +
+
+
+ +
+
+ +
Loewe
+
Gorilla
+
Zebra
+
Elefant
+
Giraffe
+
+
+
+
+ +
+

Text on the Right

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed gravida, justo eget sagittis malesuada, leo velit lobortis orci, ac sodales lectus ipsum in libero. Phasellus hendrerit justo et risus blandit, nec ultricies ligula facilisis. Pellentesque luctus, justo id vehicula consectetur, metus tortor auctor felis, eget eleifend lorem neque eget lectus. Cras semper, velit non gravida pellentesque, elit lectus rhoncus eros, nec malesuada est nulla eu metus.

+
+
+
- -
-

Über Uns

-

Über Uns

-
+ +
+

Öffnungszeiten

+

Öffnungszeiten

+
- -
-

Öffnungszeiten

-

Öffnungszeiten

-
+ +
+

Patenshop

+

Patenshop

+
- -
-

Patenshop

-

Patenshop

-
- - - - - - - - - \ No newline at end of file + + + + + +