Skip to content

Commit dabf133

Browse files
committed
Modal event
1 parent 09d482e commit dabf133

File tree

2 files changed

+39
-26
lines changed

2 files changed

+39
-26
lines changed

desktop/css/events.css

Lines changed: 17 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -87,18 +87,25 @@
8787

8888
.modal-header {
8989
display: flex;
90-
justify-content: space-between;
91-
align-items: center;
90+
flex-direction: column;
91+
align-items: flex-start;
92+
position: relative;
93+
width: 100%;
9294
margin-bottom: 20px;
9395
}
9496

9597
.modal-header h2 {
9698
flex: 1;
9799
margin: 0;
98-
width: 90%;
100+
width: 100%;
101+
text-align: left;
102+
margin-top: 40px;
99103
}
100104

101105
.button-container {
106+
position: absolute;
107+
top: 10px;
108+
right: 10px;
102109
display: flex;
103110
gap: 10px;
104111
}
@@ -420,6 +427,13 @@
420427
border-bottom-right-radius: 10px;
421428
}
422429

430+
#mediaTitle {
431+
font-size: 24px;
432+
font-weight: bold;
433+
width: 100%;
434+
text-align: left;
435+
}
436+
423437
.limited-text {
424438
display: inline-block;
425439
font-size: 18px;
Lines changed: 22 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,28 @@
11
<!-- event modal template -->
22
<div id="mediaModal" class="modal">
3-
<div class="modal-content">
4-
<span class="close">&times;</span>
5-
6-
<div class="modal-header">
7-
<h2>
8-
<div id="mediaTitle"></div>
9-
<br/>
10-
<div id="mediaDescription" class="limited-text"></div>
11-
</h2>
12-
<div class="button-container">
13-
<button id="showVideo" class="hidden-btn custom-button">Voir la vidéo</button>
14-
<button id="showImage" class="hidden-btn custom-button">Voir la capture</button><br/>
15-
</div>
3+
<div class="modal-content">
4+
<div class="modal-header">
5+
<h2>
6+
<div id="mediaTitle"></div>
7+
<br />
8+
<div id="mediaDescription" class="limited-text"></div>
9+
</h2>
10+
<div class="button-container">
11+
<button id="showVideo" class="hidden-btn custom-button">Voir la vidéo</button>
12+
<button id="showImage" class="hidden-btn custom-button">Voir la capture</button><br />
13+
<span class="close">&times;</span>
1614
</div>
17-
<div class="media-container">
18-
<div class="video-container active">
19-
<video id="videoPlayer" width="100%" controls autoplay>
20-
<source id="videoSource" src="" type="video/mp4">
21-
Votre navigateur ne supporte pas la balise vidéo.
22-
</video>
23-
</div>
24-
<div class="image-container">
25-
<img id="snapshotImage" src="" alt="Snapshot" width="100%">
26-
</div>
15+
</div>
16+
<div class="media-container">
17+
<div class="video-container active">
18+
<video id="videoPlayer" width="100%" controls autoplay>
19+
<source id="videoSource" src="" type="video/mp4">
20+
Votre navigateur ne supporte pas la balise vidéo.
21+
</video>
22+
</div>
23+
<div class="image-container">
24+
<img id="snapshotImage" src="" alt="Snapshot" width="100%">
2725
</div>
2826
</div>
27+
</div>
2928
</div>

0 commit comments

Comments
 (0)