Template:Insert quote panel/styles.css: Difference between revisions

Content deleted Content added
No edit summary
No edit summary
Line 30:
flex: 1;
min-width: 0;
width: 100%; /* Ensures the box takes full available width */
}
 
/* --- 4. SCENARIO: NO IMAGE (Original Gray Box) --- */
.insert-quote-panel.no-image .insert-quote-content {
background: #F8F9FA;
Line 41:
}
 
/* --- 5. SCENARIO: WITH IMAGE (CleanTransparent, TransparentClean) --- */
.insert-quote-panel.has-image {
gap: 15px;
}
 
/* Reset the wrapper */
.insert-quote-panel.has-image .insert-quote-content {
background: transparent !important; /* No gray box */
border: none !important; /* No border */
padding: 0 !important; /* No extra padding around the wrapper */
margin: 0 !important;
color: #202122;
}
 
/* =================================================================
/* -----------------------------------------------------------
THE RESET: HIDE BORDERS BUT KEEP STRUCTURE (INDENTATION)
DEEP RESET FOR {{Quote}} TEMPLATE
================================================================= */
----------------------------------------------------------- */
 
/* 1. ResetForce the inner {{Quote}} Boxto be Full Width */
.insert-quote-content .quotebox,
.insert-quote-content blockquote {
width: 100% !important;
max-width: 100% !important;
float: none !important;
box-sizing: border-box;
 
/* 2. When an image is present:
- Hide the inner gray background/borders of the {{Quote}}
- BUT DO NOT remove padding/margins. This preserves the indent. */
.insert-quote-panel.has-image .insert-quote-content .quotebox,
.insert-quote-panel.has-image .insert-quote-content blockquote {
background: transparent !important;
border: none !important;
paddingbox-shadow: 0none !important;
/* We REMOVED 'padding: 0' here so the default indentation works */
margin: 0 !important;
width: 100% !important;
max-width: 100% !important;
float: none !important;
}
 
/* 23. ResetALIGNMENT TextFIX: AlignmentEnsure &the Marginstext forstarts at the Quotetop (aligned with Bodyphoto) */
.insert-quote-panel.has-image .insert-quote-content p,
.insert-quote-panel.has-image .insert-quote-content div {
text-align: left !important;
margin-left: 0 !important;
padding-left: 0 !important;
 
/* 3. Remove top space from the first line (so it aligns with photo) */
.insert-quote-panel.has-image .insert-quote-content > .quotebox > *:first-child,
.insert-quote-panel.has-image .insert-quote-content > *:first-child {
Line 86 ⟶ 85:
}
 
/* (Deleted the aggressive "Author Fix" block completely.
/* -----------------------------------------------------------
This allows MediaWiki's default .templatequote-cite padding to take over.) */
THE FIX: AUTHOR / CITATION STYLING
----------------------------------------------------------- */
 
/* Target every possible container for the author */
.insert-quote-panel.has-image .insert-quote-content small,
.insert-quote-panel.has-image .insert-quote-content cite,
.insert-quote-panel.has-image .insert-quote-content .cite,
.insert-quote-panel.has-image .insert-quote-content .source {
/* Force it to be a block on its own line */
display: block !important;
/* Remove any "hanging" indentation or left margins */
margin-left: 0 !important;
padding-left: 0 !important;
text-indent: 0 !important;
/* Force Left Align */
text-align: left !important;
/* Add the space ABOVE the author */
margin-top: 1.5em !important;
padding-top: 0.5em !important; /* Extra breathing room */
/* Optional: Ensure font is normal, not tiny */
font-style: normal;
line-height: 1.4;
width: 100%;
}
 
/* HACK: Sometimes {{Quote}} adds an em-dash (—) before the author using CSS.
This hides it if it's causing the hanging indent issue. */
.insert-quote-panel.has-image .insert-quote-content small::before,
.insert-quote-panel.has-image .insert-quote-content cite::before {
content: "" !important;
display: none !important;
}