MediaWiki:Common.css: Difference between revisions

Content deleted Content added
No edit summary
No edit summary
Line 1,113:
 
/* ======================================================= */
/* 3. AI ASSISTANT (AXA BRAIN) -CUSTOMIZATION CONSOLIDATED FIX */
/* ======================================================= */
 
/* 1. GLOBAL LAYER (All Devices) */
/* We ONLY force the layer order here, not the position. */
/* EnsureThis ensures it sits on top of everythingyour floating buttons (z-index: 20001002). */
.ext-aiassistant,
.ext-aiassistant-panel {
Line 1,123 ⟶ 1,124:
}
 
/* 2. DESKTOPMOBILE ALIGNMENTONLY: FIXFULL SCREEN MODE */
/* We only force 'fixed' position on mobile to lock it to the screen. */
/* Fixes the "enter button" alignment issue you had earlier */
.ext-aiassistant-footer {
align-items: flex-start !important;
 
/* 3. MOBILE ONLY: FULL SCREEN APP MODE */
@media screen and (max-width: 768px) {
 
/* --- THE MAIN CONTAINER --- */
.ext-aiassistant-panel {
/* Force Fixed Positionso relativeit tocovers the screen regardless of scroll */
position: fixed !important;
/* Override any inline styles to force full width/height */
width: 100% !important;
height: 100dvh100% !important;
max-width: none !important;
max-height: none !important;
 
/* Pin to all 4 corners */
top: 0 !important;
left: 0 !important;
Line 1,141 ⟶ 1,143:
bottom: 0 !important;
 
/* ForceReset Size (Use 100dvhstyles for correct height on mobilea withflat addressapp-like bars)look */
widthborder-radius: 100vw0 !important;
height: 100dvh !important;
/* Override any inline styles */
max-width: none !important;
max-height: none !important;
margin: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
 
/* FLEXBOX LAYOUT (This makes the header sticky) */
display: flex !important;
flex-direction: column !important; /* Stack: Header -> Body -> Footer */
background: #fff !important;
}
}
 
/* ---Ensure A.the HEADERinternal (STICKYchat TOP)body ---expands to fill the space */
.ext-aiassistant-header {
flex: 0 0 auto !important; /* Don't shrink or grow. Stay fixed size. */
width: 100% !important;
z-index: 10 !important;
background: #fff !important; /* Ensure solid background so text doesn't overlap */
border-bottom: 1px solid #eaecf0 !important; /* Visual separator */
}
 
/* --- B. BODY (SCROLLING MIDDLE) --- */
.ext-aiassistant-body {
flexheight: 1 1 auto !important; /* Grow to fill ALL available space */
overflowflex-ygrow: auto1 !important; /* The scrolling happens HERE, not on the page */
height: auto !important; /* Reset fixed height */
min-height: 0 !important; /* Fix for flexbox scrolling bug */
overscroll-behavior: contain; /* Prevents background page from scrolling */
}
 
/* ======================================================= */
/* --- C. FOOTER (STICKY BOTTOM) --- */
/* 4. AI ASSISTANT FOOTER ALIGNMENT */
.ext-aiassistant-footer {
/* ======================================================= */
flex: 0 0 auto !important; /* Don't shrink or grow */
 
width: 100% !important;
.ext-aiassistant-footer {
background: #fff !important;
/* Align items to the top (flex-start) instead of bottom (flex-end) */
padding-bottom: env(safe-area-inset-bottom) !important; /* Respect iPhone Home Bar */
align-items: flex-start !important;
}
}