1
2 // Carousel
3 <div
4 id="carouselExampleAutoplaying"
5 class="carousel slide carousel-fade"
6 data-bs-ride="carousel"
7 data-bs-touch="true"
8 >
9 <div class="carousel-inner">
10 <div
11 class="carousel-item active"
12 data-bs-interval="10000"
13 data-bs-pause="true"
14 >
15 <img
16 src="https://webteam.pages.fhnw.ch/fhnw-styleguide-v4/assets/img/campus-muttenz-hoersaal-2.jpg"
17 class="d-block w-100"
18 alt="..."
19 />
20 <div class="carousel-caption">
21 <a href="#">
22 <small>Second slide label</small>
23 <h5>
24 Some representative placeholder content for the second slide.
25 </h5>
26 </a>
27 </div>
28 </div>
29 <div class="carousel-item" data-bs-interval="10000">
30 <img
31 src="https://webteam.pages.fhnw.ch/fhnw-styleguide-v4/assets/img/campus-muttenz-atrium.jpg"
32 class="d-block w-100"
33 alt="https://dummyimage.com/600x400/000/fff"
34 />
35 <div class="carousel-caption">
36 <a href="#">
37 <small>Second slide label</small>
38 <h5>Lorem ipsum dolor sit amet...</h5>
39 </a>
40 </div>
41 </div>
42 <div class="carousel-item" data-bs-interval="10000">
43 <img
44 src="https://webteam.pages.fhnw.ch/fhnw-styleguide-v4/assets/img/campus-muttenz-aula.jpg"
45 class="d-block w-100"
46 alt="..."
47 />
48 <div class="carousel-caption">
49 <a href="#">
50 <small>Second slide label</small>
51 <h5>
52 Some representative placeholder content for the second slide.
53 </h5>
54 </a>
55 </div>
56 </div>
57 </div>
58 </div>
59 <div class="d-flex flex-row align-items-center w-100 justify-content-end">
60 <button
61 class="carousel-control-prev"
62 type="button"
63 data-bs-target="#carouselExampleAutoplaying"
64 data-bs-slide="prev"
65 >
66 <span
67 class="carousel-control-prev-icon"
68 aria-hidden="true"
69 ></span>
70 <span class="visually-hidden">Previous</span>
71 </button>
72 <button
73 class="carousel-control-next"
74 type="button"
75 data-bs-target="#carouselExampleAutoplaying"
76 data-bs-slide="next"
77 >
78 <span
79 class="carousel-control-next-icon"
80 aria-hidden="true"
81 ></span>
82 <span class="visually-hidden">Next</span>
83 </button>
84 </div>
85