emily/video2document
1
0
Fork 0
mirror of https://gitlab.rlp.net/proj-wise2526-video2document/video2document.git synced 2026-06-15 18:01:52 +02:00
Code Issues Packages Projects Releases Wiki Activity

Added hover effects for other document types

Browse Source
This commit is contained in:
Verena Schulz
2026-01-16 23:54:31 +01:00
parent b5d374498f
commit 826381d858
2 changed files with 79 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
electron/main/index.html
+9
View File
@@ -141,17 +141,26 @@
<div class="checkbox-container"> <div class="checkbox-container">
<input type="checkbox" name="docFormat" id="docFormatSummary1" value="agenda"> <input type="checkbox" name="docFormat" id="docFormatSummary1" value="agenda">
<label id="label_summary" for="docFormatSummary">Agenda</label> <label id="label_summary" for="docFormatSummary">Agenda</label>
<div class="figure2">
<img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png"> <img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png">
<img class="img-hover2" src="flags/india-flag-png-large.png">
</div>
</div> </div>
<div class="checkbox-container"> <div class="checkbox-container">
<input type="checkbox" name="docFormat" id="docFormatSummary2" value="result-protocol"> <input type="checkbox" name="docFormat" id="docFormatSummary2" value="result-protocol">
<label id="label_summary" for="docFormatSummary">Resultprotocol</label> <label id="label_summary" for="docFormatSummary">Resultprotocol</label>
<div class="figure3">
<img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png"> <img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png">
<img class="img-hover3" src="flags/united-kingdom-flag-png-large.jpg">
</div>
</div> </div>
<div class="checkbox-container"> <div class="checkbox-container">
<input type="checkbox" name="docFormat" id="docFormatSummary3" value="sprint-planning"> <input type="checkbox" name="docFormat" id="docFormatSummary3" value="sprint-planning">
<label id="label_summary" for="docFormatSummary">Sprint Planning Note</label> <label id="label_summary" for="docFormatSummary">Sprint Planning Note</label>
<div class="figure4">
<img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png"> <img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png">
<img class="img-hover4" src="flags/germany-flag-png-large.jpg">
</div>
</div> </div>
<div class="checkbox-container"> <div class="checkbox-container">
<input type="checkbox" name="docFormat" id="docFormatCustom" value="custom"> <input type="checkbox" name="docFormat" id="docFormatCustom" value="custom">
electron/main/style.css
+69
View File
@@ -186,6 +186,8 @@ input[type="file"] {
gap: 5px; gap: 5px;
} }
/* Hover effects for all different document options (with placeholders)*/
.figure1 { .figure1 {
position: relative; position: relative;
} }
@@ -201,12 +203,79 @@ input[type="file"] {
object-fit: contain; object-fit: contain;
display: none; display: none;
transition: opacity .2s; transition: opacity .2s;
z-index: 999;
} }
.figure1:hover .img-hover1 { .figure1:hover .img-hover1 {
display: flex; display: flex;
} }
.figure2 {
position: relative;
}
.img-hover2 {
position: absolute;
width: 200px;
height: 200px;
top: 0;
right: 40%;
left: 0;
bottom: 0;
object-fit: contain;
display: none;
transition: opacity .2s;
z-index: 999;
}
.figure2:hover .img-hover2 {
display: flex;
}
.figure3 {
position: relative;
}
.img-hover3 {
position: absolute;
width: 200px;
height: 200px;
top: 0;
right: 40%;
left: 0;
bottom: 0;
object-fit: contain;
display: none;
transition: opacity .2s;
z-index: 999;
}
.figure3:hover .img-hover3 {
display: flex;
}
.figure4 {
position: relative;
}
.img-hover4 {
position: absolute;
width: 200px;
height: 200px;
top: 0;
right: 40%;
left: 0;
bottom: 0;
object-fit: contain;
display: none;
transition: opacity .2s;
z-index: 999;
}
.figure4:hover .img-hover4 {
display: flex;
}
.img-icon { .img-icon {
width: 15px; width: 15px;
height: 15px; height: 15px;