Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 339b267

Browse files
nipunbatranipunbatra
committed
adde
1 parent 2d2ab6b commit 339b267

File tree

1 file changed

+1
-166
lines changed

1 file changed

+1
-166
lines changed

‎group.qmd

Lines changed: 1 addition & 166 deletions
Original file line numberDiff line numberDiff line change
@@ -7,174 +7,9 @@ output:
77
### Some group photos and memories (to come soon..)
88

99
```{=html}
10-
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
11-
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
12-
<style>
13-
/* Custom style to prevent carousel from being distorted
14-
if for some reason image doesn't load */
15-
.carousel-item{
16-
min-height: 280px;
17-
}
18-
.carousel-caption {
19-
background-color: rgba(0, 0, 0, 0.6); /* Transparent black background */
20-
padding: 10px; /* Add padding for better visibility */
21-
color: white; /* Text color */
22-
}
23-
24-
.carousel-caption h5 {
25-
margin-bottom: 5px; /* Adjust spacing between heading and paragraph */
26-
}
27-
</style>
28-
</head>
29-
<body>
30-
<div class="container-lg my-3">
31-
<div id="myCarousel" class="carousel slide" data-bs-ride="carousel">
32-
<!-- Carousel indicators -->
33-
<ol class="carousel-indicators">
34-
<li data-bs-target="#myCarousel" data-bs-slide-to="0" class="active"></li>
35-
<li data-bs-target="#myCarousel" data-bs-slide-to="1"></li>
36-
<li data-bs-target="#myCarousel" data-bs-slide-to="2"></li>
37-
<li data-bs-target="#myCarousel" data-bs-slide-to="3"></li>
38-
<li data-bs-target="#myCarousel" data-bs-slide-to="4"></li>
39-
<li data-bs-target="#myCarousel" data-bs-slide-to="5"></li>
40-
</ol>
41-
42-
<!-- Wrapper for carousel items -->
43-
<div class="carousel-inner">
44-
<div class="carousel-item active">
45-
<img src="images/group/2023-group.jpg" class="d-block w-100" alt="Slide 1">
46-
<div class="carousel-caption d-none d-md-block">
47-
<h5>2 May 2023</h5>
48-
<p>Batch of 2023 (Saagar, Aadesh, Xhitij, Nipun, Zeel (not batch of 2023), Ankita, Eshan, Hitarth, Gautam</p>
49-
</div>
50-
</div>
51-
<div class="carousel-item">
52-
<img src="images/group/2023-cake.jpg" class="d-block w-100" alt="Slide 2">
53-
<div class="carousel-caption d-none d-md-block">
54-
<h5>2 May 2023</h5>
55-
<p>Cake by batch of 2023</p>
56-
</div>
57-
</div>
58-
59-
<div class="carousel-item">
60-
<img src="images/group/2021-Nov-Apoorv.jpg" class="d-block w-100" alt="Slide 3">
61-
<div class="carousel-caption d-none d-md-block">
62-
<h5>Nov 2021</h5>
63-
<p>Apoorv's "re" visit to the campus (others in frame: Rishiraj and Zeel)</p>
64-
</div>
65-
</div>
66-
67-
<div class="carousel-item">
68-
<img src="images/group/2021-AAAI.jpg" class="d-block w-100" alt="Slide 4">
69-
<div class="carousel-caption d-none d-md-block">
70-
<h5>Dec 2021</h5>
71-
<p>Celebrating AAAI paper acceptance</p>
72-
</div>
73-
</div>
74-
75-
<div class="carousel-item">
76-
<img src="images/group/2022-group-subset.jpg" class="d-block w-100" alt="Slide 5">
77-
<div class="carousel-caption d-none d-md-block">
78-
<h5>July 2022</h5>
79-
<p>With a subset of the batch of 2022 (Harsh, Hetvi, Nipun, Dhruvi, Palak)</p>
80-
</div>
81-
</div>
82-
83-
</div>
84-
85-
<!-- Carousel controls -->
86-
<a class="carousel-control-prev" href="#myCarousel" data-bs-slide="prev">
87-
<span class="carousel-control-prev-icon"></span>
88-
</a>
89-
<a class="carousel-control-next" href="#myCarousel" data-bs-slide="next">
90-
<span class="carousel-control-next-icon"></span>
91-
</a>
92-
</div>
93-
```
94-
95-
```{=html}
96-
<!-- Image Carousel with CSS in Quarto
97-
<div class="carousel">
98-
<input type="radio" id="slide-1" name="carousel-radio" checked>
99-
<input type="radio" id="slide-2" name="carousel-radio">
100-
<input type="radio" id="slide-3" name="carousel-radio">
101-
<div class="slides">
102-
<div class="slide">
103-
<img src="images/nipun.jpg">
104-
</div>
105-
<div class="slide">
106-
<img src="image2.jpg">
107-
</div>
108-
<div class="slide">
109-
<img src="image3.jpg">
110-
</div>
111-
</div>
112-
<div class="indicators">
113-
<label for="slide-1"></label>
114-
<label for="slide-2"></label>
115-
<label for="slide-3"></label>
116-
</div>
117-
</div>
118-
119-
<style>
120-
.carousel {
121-
position: relative;
122-
}
123-
124-
.slides {
125-
display: flex;
126-
overflow-x: scroll;
127-
scroll-snap-type: x mandatory;
128-
scroll-behavior: smooth;
129-
}
130-
131-
.slide {
132-
flex: 0 0 100%;
133-
scroll-snap-align: start;
134-
}
135-
136-
img {
137-
width: 100%;
138-
height: auto;
139-
}
140-
141-
.indicators {
142-
display: flex;
143-
justify-content: center;
144-
margin-top: 10px;
145-
}
146-
147-
.indicators label {
148-
width: 12px;
149-
height: 12px;
150-
border-radius: 50%;
151-
border: 1px solid #000;
152-
margin: 0 5px;
153-
cursor: pointer;
154-
}
155-
156-
.indicators label:hover {
157-
background-color: #000;
158-
}
159-
160-
input[type="radio"] {
161-
display: none;
162-
}
163-
164-
input[type="radio"]:checked ~ .slides {
165-
scroll-snap-type: none;
166-
scroll-behavior: auto;
167-
overflow-x: visible;
168-
}
169-
170-
input[type="radio"]:checked ~ .slides .slide {
171-
scroll-snap-align: none;
172-
}
173-
</style>
174-
-->
10+
<iframe src="./group_pics.html" title="Quarto revealjs Documentation"></iframe>
17511
```
17612

177-
17813
### Current
17914

18015
#### PhD

0 commit comments

Comments
 (0)