FIX_Modal Someone fixed
This commit is contained in:
parent
dcf6612ab4
commit
9399f4d8c2
@ -1,54 +1,3 @@
|
|||||||
<style>
|
|
||||||
/* ----- Modal Size: 25% width + 25% height ----- */
|
|
||||||
#New_Ticket_modal .modal-dialog {
|
|
||||||
width: 15%;
|
|
||||||
max-width: 15%;
|
|
||||||
height: 25%;
|
|
||||||
max-height: 25%;
|
|
||||||
margin: auto !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* Make modal-content fill the dialog & allow flex layout */
|
|
||||||
#New_Ticket_modal .modal-content {
|
|
||||||
height: 50%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Scroll only inside body */
|
|
||||||
#New_Ticket_modal .modal-body {
|
|
||||||
flex: 1;
|
|
||||||
overflow-y: auto;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Footer visible always */
|
|
||||||
#New_Ticket_modal .modal-footer {
|
|
||||||
position: sticky;
|
|
||||||
bottom: 0;
|
|
||||||
background: #fff;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ----- Small Height Screens Fix ----- */
|
|
||||||
@media (max-height: 300px) {
|
|
||||||
|
|
||||||
/* Make modal usable but still centered */
|
|
||||||
#New_Ticket_modal .modal-dialog {
|
|
||||||
width: 50%;
|
|
||||||
max-width: 50%;
|
|
||||||
height: 70%;
|
|
||||||
max-height: 70%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Adjust body scroll area */
|
|
||||||
#New_Ticket_modal .modal-body {
|
|
||||||
max-height: calc(80vh - 120px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<div class="modal fade" id="New_Ticket_modal" tabindex="-1" role="dialog" aria-hidden="true">
|
<div class="modal fade" id="New_Ticket_modal" tabindex="-1" role="dialog" aria-hidden="true">
|
||||||
<div class="modal-dialog modal-dialog-centered">
|
<div class="modal-dialog modal-dialog-centered">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user