prettified dialog a bit :):

This commit is contained in:
hyperbel 2023-10-24 15:28:47 +00:00
parent 81404c155c
commit 2257f5061c
2 changed files with 30 additions and 19 deletions

View File

@ -265,15 +265,15 @@ font-weight: bold; /* Button hervorheben */
}
/* Neuer Stil für die versteckten Div-Elemente */
/* Neuer Stil für die versteckten Div-Elemente
.hidden-div {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 80%; /* Hier die gewünschte Breite eintragen */
max-height: 80%; /* Hier die gewünschte Höhe eintragen */
width: 80%; /* Hier die gewünschte Breite eintragen
max-height: 80%; /* Hier die gewünschte Höhe eintragen
height: 80%;
padding: 20px;
background-color: #333;
@ -281,6 +281,7 @@ font-weight: bold; /* Button hervorheben */
border-radius: 10px;
text-align: center;
}
*/
/* Stil für den aktiven Button */
.active-button {
@ -302,8 +303,12 @@ td {
border: 1px solid #555;
}
#event_form {
border: 2px solid #555;
/* Planer */
#planer dialog {
background-color: black;
border-radius: 5px;
border: 1px solid white;
}
#event_input{
@ -324,20 +329,21 @@ td {
color: rgb(220, 220, 210);
border: 2px solid #555;
outline: none;
margin-top: 5px;
}
#submit_button{
.dialog_control {
background-color: #454443;
border-radius: 10px;
cursor: pointer;
background-position: center;
background-repeat: no-repeat;
background-size: 60%;
border: none;
padding: 10px;
color: white;
font-size: 16px;
margin-top: 5px;
}
.dialog_control:hover {
background-color: #333;
}
@ -446,7 +452,7 @@ cursor: pointer;
}
/* CSS für die Bearbeitungsbuttons beim planer */
/* Planer */
.button-wrapper {
background: none;
border: none;

View File

@ -91,14 +91,19 @@
</tbody>
</table>
<form id="event_form" action="/api/event/new" target='hiddenIFrame' method='post'>
<input id="event_input" type="text" name="Event" placeholder="Event Name" maxlength="20" minlength="1" required><br/>
<input id="event_time" type="datetime-local" id="meeting-time"
name="meeting-time" value="2023-12-31T12:00"
min="2023-12-31T00:00"
max="2024-01-01T18:00" required><br/>
<button id="submit_button" type="submit">Hinzufügen</button>
</form>
<button id="add_event_button" onclick="document.getElementById('new_event_form_dialog').open = true;">+</button>
<dialog id="new_event_form_dialog">
<form id="event_form" action="/api/event/new" target='hiddenIFrame' method='post'>
<input id="event_input" type="text" name="Event" placeholder="Event Name" maxlength="20" minlength="1" required><br/>
<input id="event_time" type="datetime-local" id="meeting-time"
name="meeting-time" value="2023-12-31T12:00"
min="2023-12-31T00:00"
max="2024-01-01T18:00" required><br/>
<button class="dialog_control" onclick="document.getElementById('new_event_form_dialog').open = false" type="submit">Hinzufügen</button>
<button class="dialog_control" onclick="document.getElementById('new_event_form_dialog').open = false">Abbrechen</button>
</form>
</dialog>
<iframe name='hiddenIFrame' id='hiddenIFrame' hidden></iframe>
</section>