MediaWiki:Common.css: Difference between revisions

Content deleted Content added
No edit summary
No edit summary
 
(60 intermediate revisions by the same user not shown)
Line 730:
.mw-body-content a.external:visited,
.mw-collapsible-toggle-default .mw-collapsible-text {
color: #1d70b8000099 !important;
}
 
Line 837:
 
/* =================================================================
8. AI ASSISTANT (AXA BRAIN)PANEL
================================================================= */
 
/* --- Layer orderZ-index: sits behind floating buttons (z-index 1002) --- */
.ext-aiassistant,
.ext-aiassistant-panel {
Line 846:
}
 
/* --- Panel: dark border, no shadowshell --- */
.ext-aiassistant-panel {
border: 1px solid #202122 !important;
Line 852:
}
 
/* --- Header & footer borders --- */
.ext-aiassistant-header { border-bottom: 1px solid #202122 !important; }
border-bottom: 1px solid #202122 !important;
.ext-aiassistant-footer {
bordermargin-topleft: 1px solid #2021220 !important;
alignmargin-itemsright: center0 !important;
padding-left: 12px !important;
padding-right: 12px !important;
}
 
/* --- SendMessage button (circle)area --- */
.ext-aiassistant-send,body {
padding-left: 20px !important;
.ext-aiassistant-prompt-composer__send {
borderpadding-radiusright: 50%20px !important;
widthbox-sizing: 36pxborder-box !important;
height: 36px !important;
min-width: 0 !important;
padding: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin-left: 4px !important;
}
 
.ext-aiassistant-send:not(:disabled)message {
backgroundmargin-colorleft: #2021220 !important;
bordermargin-colorright: #2021220 !important;
color: #ffffff !important;
}
 
.ext-aiassistant-send:disabledmessage + .ext-aiassistant-message {
backgroundmargin-colortop: #CCCCCC0 !important;
border-color: #CCCCCC !important;
}
 
/* --- User message bubble --- */
.ext-aiassistant-message-user {
margin-left: 100px !important;
margin-top: 1.6em0 !important;
margin-bottom: 1.6em0 !important;
}
 
.ext-aiassistant-message-user .ext-aiassistant-message__content {
background-color: #202122 !important;
color: white !important;
border-radius: 24px18px !important;
paddingborder: 12pxnone !important;
padding: 6px 12px !important;
}
 
.ext-aiassistant-message-user .ext-aiassistant-message__content p {
color: white !important;
margin: 0 !important;
}
 
/* Uniform gap between consecutive messages */
.ext-aiassistant-message + .ext-aiassistant-message {
margin-top: 2.5em !important;
}
 
/* --- Assistant message typography (matches article style) --- */
.ext-aiassistant-message-assistant {
font-family: sans-serif !important;
font-size: 1em !important;
color: #202122 !important;
word-wrap: break-word !important;
overflow-wrap: break-word !important;
white-space: normal !important;
max-width: 100% !important;
}
 
.ext-aiassistant-message-assistant p {
margin: 0 0 0.6em !important;
}
 
Line 926 ⟶ 918:
}
 
.ext-aiassistant-message-assistant p {
margin: 0 0 0.6em !important;
}
 
/* --- Assistant lists (clean editorial style) --- */
.ext-aiassistant-message-assistant ul,
.ext-aiassistant-message-assistant ol {
Line 936 ⟶ 923:
margin-left: 0 !important;
padding-top: 0 !important;
word-wrap: break-word !important;
}
 
Line 952 ⟶ 938:
margin-bottom: 0.2em !important;
white-space: normal !important;
word-wrap: break-word !important;
}
 
/* --- Assistant code blocks (force wrapping) --- */
.ext-aiassistant-message-assistant pre,
.ext-aiassistant-message-assistant code {
Line 965 ⟶ 949:
padding: 0 !important;
margin: 0 !important;
}
 
/* --- Action buttons (copy, source) --- */
.ext-aiassistant-message-assistant .ext-aiassistant-actions {
display: flex !important;
flex-direction: row-reverse !important;
}
 
.ext-aiassistant-message-user .ext-aiassistant-actions {
display: flex !important;
justify-content: flex-end !important;
}
 
Line 974 ⟶ 969:
}
 
/* --- "New Chat" button renameSources --- */
.ext-aiassistant-sources {
background: transparent !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
margin-bottom: 12px !important;
}
 
/* --- "New Chat" label --- */
.ext-aiassistant-panel .cdx-button--weight-quiet:not(.cdx-button--icon-only) {
font-size: 0 !important;
Line 986 ⟶ 990:
}
 
/* --- AlignmentFooter fixes:+ gutters, centering, button orderComposer --- */
 
/* 1. Shared horizontal padding — aligns header button edges,
message edges, and composer edges on the same vertical rails.
Tune this value in DevTools until the leftmost header button
and the composer left edge sit on the same line. */
.ext-aiassistant-header,
.ext-aiassistant-body,
.ext-aiassistant-footer {
paddingborder-lefttop: 12px1px solid #202122 !important;
padding-rightdisplay: 12pxflex !important;
align-items: center !important;
}
justify-content: center !important;
 
/* 2. Strip any extra inset from header button groups so the
outermost buttons sit flush against the section padding */
.ext-aiassistant-header-actions {
margin: 0 !important;
padding: 0 !important;
box-sizing: border-box !important;
background-color: #f8f9fa !important;
}
 
/* 3. Messages flush to body padding */
.ext-aiassistant-message {
margin-left: 0 !important;
margin-right: 0 !important;
}
 
/* 4. Composer fills full footer width */
.ext-aiassistant-prompt-composer {
margin: 0 !important;
width: 100% !important;
boxbackground-sizingcolor: border-box#fff !important;
padding: 10px 20px !important;
border: none !important;
border-radius: 0 !important;
}
 
.ext-aiassistant-prompt-composer__toolbar {
/* 5. Vertically center composer inside footer —
equal top and bottom padding does the job */
.ext-aiassistant-footer {
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding-top: 10px !important;
padding-bottom: 10px !important;
}
 
/* --- Composer focus --- */
/* 6. Vertically center title + icon row in header */
.ext-aiassistant-headerprompt-composer:focus-within {.ext-aiassistant-prompt-composer__input,
.ext-aiassistant-prompt-composer__input:focus {
border-color: #202122 !important;
outline: none !important;
box-shadow: none !important;
}
 
/* --- Send button --- */
.ext-aiassistant-prompt-composer__send {
border-radius: 50% !important;
width: 32px !important;
height: 32px !important;
min-width: 0 !important;
padding: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin-left: 4px !important;
}
 
.ext-aiassistant-headerprompt-iconcomposer__send:not(:disabled) {
verticalbackground-aligncolor: middle#202122 !important;
border-color: #202122 !important;
color: #ffffff !important;
}
 
.ext-aiassistant-prompt-composer__send:disabled {
/* 7. Swap assistant action buttons: copy moves to the right,
background-color: #EAECF0 !important;
source moves to the left — aligns copy with user's copy btn */
border-color: #EAECF0 !important;
.ext-aiassistant-message-assistant .ext-aiassistant-actions {
display: flex !important;
flex-direction: row-reverse !important;
}
 
.ext-aiassistant-prompt-composer__send:disabled .cdx-icon svg {
/* 8. Keep user action buttons right-aligned as they are */
fill: #72777d !important;
.ext-aiassistant-message-user .ext-aiassistant-actions {
display: flex !important;
justify-content: flex-end !important;
}
 
/* 9. Toolbar items vertically aligned */
.ext-aiassistant-prompt-composer__toolbar {
display: flex !important;
align-items: center !important;
}
 
/* =================================================================
Line 1,096 ⟶ 1,090:
/* Push input above sticky buttons */
.ext-aiassistant-footer {
padding-bottom: calc(75px70px + env(safe-area-inset-bottom)) !important;
}
 
/* Add a line to separate with the sticky buttons */
.ext-aiassistant-prompt-composer {
border-bottom: 1px solid #202122 !important;
border-radius: 0 !important;
padding-bottom: 10px !important;
}
 
Line 1,164 ⟶ 1,165:
 
@media print {
 
/* Hide floating buttons */
/* --- Hide floating buttons, overlays, and AI assistant --- */
#searchIcon,
.branding-box,
#cps-open-toc,
#custom-email-btn { display: none !important; },
 
/* Hide ToC overlay */
#cps-toc-panel,
#cps-toc-overlay { display: none !important; },
.minerva-header .search-box,
 
/* Hide search bar */
.minerva-header .search-box { display: none !important; }
 
/* Hide AI assistant */
.ext-aiassistant,
.ext-aiassistant-panel,
.ext-aiassistant-trigger { display: none !important; }
display: none !important;
}
 
/* --- Hide standard MediaWiki UI elements to free up space --- */
#mw-navigation,
#footer,
.printfooter,
.mw-editsection {
display: none !important;
}
 
/* --- Font consistency for lists --- */
.mw-parser-output ul,
.mw-parser-output ol,
.mw-parser-output li { font-family: inherit !important; }
font-family: inherit !important;
}
 
/* --- Remove underlines specifically from internal links in print --- */
.mw-parser-output a:not(.external),
.mw-parser-output a:not(.external):visited {
text-decoration: none !important;
}
}
 
/* =================================================================
11. WIKITABLE FIXES (Mobile, Alignment, & Print)
================================================================= */
 
/* --- Mobile / General Display Fixes --- */
table.wikitable td p {
font-size: inherit !important; /* Forces Minerva to respect table font size */
}
 
table.wikitable td ul {
list-style-position: outside !important; /* Fixes Minerva bullet positioning */
margin-left: 1.5em !important; /* Pushes bullets away from the border */
padding-left: 0 !important; /* Resets conflicting padding */
}
 
/* --- Vertical Alignment Fix --- */
table.wikitable td > p:first-child,
table.wikitable td > ul:first-child,
table.wikitable td > ol:first-child {
margin-top: 0 !important; /* Aligns bullet points and paragraphs with inline text */
}
 
/* --- Print Fixes --- */
@media print {
table.wikitable p {
font-size: inherit !important;
text-align: inherit !important; /* Prevents text justification on print */
margin-top: 0.25em !important;
margin-bottom: 0.25em !important;
}
table.wikitable a.external.text::after {
content: none !important; /* Hides expanded URLs to keep columns tidy */
}
}