First prototype of new mockup

This commit is contained in:
Verena Schulz
2025-11-25 16:31:26 +01:00
parent 0bbbb2f9b7
commit ef379a5b7b
3 changed files with 92 additions and 9 deletions
+19 -4
View File
@@ -7,11 +7,21 @@
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="step-nav">
<div class="step-item active" data-step="1">1. Step</div>
<div class="step-item" data-step="2">2. Step</div>
<div class="step-item" data-step="3">3. Step</div>
<div class="step-item" data-step="4">4. Step</div>
</div>
<div class="mitte" id="mitte">
<div class="mitte" id="mitte">
<h1 id="h1">Video to document</h1>
<div class="step" id="step1">
<div class="labelDiv" id="labelDiv">
<label id="labelKI">Select ki:</label>
<label id="labelTranscription">Select transcription:</label>
<label id="labelType">Select type:</label>
<label id="labelLanguage">Select language:</label>
<img id="labelLanguageFlag" src="flags/united-kingdom-flag-png-large.jpg" width="20" height="10" >
</div>
@@ -26,9 +36,9 @@
<select name="language_option" id="language_option">
</select>
</div>
</div>
<h1 id="h1">Video to document</h1>
<div class="step" id="step3" style="display:none;">
<div class="upload-container" id="uploadContainer">
<p id="p1">Drag and drop video file</p>
<video id="previewThumbnail" autoplay="false">
@@ -40,7 +50,9 @@
<button class="custom-btn" id="manualUploadBtn">Search video</button>
<input type="file" id="videoUpload" accept="video/*">
</div>
</div>
<div class="step" id="step2" style="display:none;">
<div class="checkbox-group">
<label id="checkbox_group" for="checkbox-group">Choose prefered document style:</label>
<div class="checkbox-container">
@@ -53,7 +65,9 @@
<label id="label_summary" for="docFormatSummary">Summary with timestamps</label>
</div>
</div>
</div>
<div class="step" id="step4" style="display:none;">
<button class="submit-btn" id="submitButton" onclick="checkBoxes()" disabled>Submit</button>
<div class="progressbar" id="progressbar">
@@ -61,7 +75,8 @@
<span class="progress_text">0%</span>
</div>
</div>
</div>
<script src="languages.js"></script>
<script src="script.js"></script>
<script src="./renderer.js"></script>