Phase 2 coffre: correctif modale (max-height viewport + scroll interne)
This commit is contained in:
+16
-2
@@ -7700,6 +7700,8 @@ body.popup-mode .content-area {
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
padding: 16px;
|
||||||
|
box-sizing: border-box;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
transition: opacity 200ms ease;
|
transition: opacity 200ms ease;
|
||||||
@@ -7715,8 +7717,16 @@ body.popup-mode .content-area {
|
|||||||
border: 1px solid var(--border);
|
border: 1px solid var(--border);
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
|
box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
|
||||||
min-width: 400px;
|
/* Correctif Phase 2 (modale de création de secret coupée en haut) :
|
||||||
max-width: 600px;
|
sans max-height ni scroll interne, un formulaire long dépassait le
|
||||||
|
viewport. La modale est désormais bornée au viewport, en colonne
|
||||||
|
flex, avec seul le corps qui défile ; l'en-tête et le pied restent
|
||||||
|
toujours visibles. Sur petit écran, la largeur est bornée aussi. */
|
||||||
|
min-width: min(400px, calc(100vw - 32px));
|
||||||
|
max-width: min(600px, calc(100vw - 32px));
|
||||||
|
max-height: calc(100dvh - 32px);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
transform: scale(0.9);
|
transform: scale(0.9);
|
||||||
transition: transform 200ms ease;
|
transition: transform 200ms ease;
|
||||||
}
|
}
|
||||||
@@ -7731,6 +7741,7 @@ body.popup-mode .content-area {
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.obsigate-modal-title {
|
.obsigate-modal-title {
|
||||||
@@ -7742,6 +7753,8 @@ body.popup-mode .content-area {
|
|||||||
|
|
||||||
.obsigate-modal-body {
|
.obsigate-modal-body {
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
|
overflow-y: auto;
|
||||||
|
min-height: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.obsigate-modal-footer {
|
.obsigate-modal-footer {
|
||||||
@@ -7750,6 +7763,7 @@ body.popup-mode .content-area {
|
|||||||
display: flex;
|
display: flex;
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.modal-input {
|
.modal-input {
|
||||||
|
|||||||
Reference in New Issue
Block a user