User:Qono/vector.css

From Wikipedia, the free encyclopedia
Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.
/* Importing Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,400;0,700;1,400;1,700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap');

/* Styles for screens with max-width of 700px */
@media screen and (max-width: 700px) {
   #mw-panel {
      opacity: 0;
      margin-left: -11em;
   }
   #content, #head-base, #footer, #mw-head-base {
      margin-left: -1px;
   }
   #left-navigation {
      margin-left: 1em;
   }
}

/* Adjust infoboxes for screens with min-width of 1280px */
@media screen and (min-width: 1280px) {
   .infobox, .sidebar {
      width: 30em;
   }
}

/* Adjust infoboxes for screens with max-width of 850px */
@media screen and (max-width: 850px) {
   .infobox, .sidebar {
      width: 100%;
   }
   .thumb.tleft {
   	width: 100%;
   }
}

.sidebar-person-title-image {
min-width:3em;
display:flex;
}

/* Optimizing text rendering and setting font variant for html and body */
html, body {
   text-rendering: optimizeLegibility;
   font-variant-numeric: ordinal;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}

/* Set font-size, font-family, line-height, and font variant for body content */
.mw-body-content {
   font-size: 1.15rem; /* Adjust font size for better scaling */
   line-height: 1.5; /* Adjust line height for readability */
   font-family: 'Crimson Pro', serif;
   font-variant-numeric: oldstyle-nums;
   text-align: left;
}

/* Set font variant for tables */
table {
   font-variant-numeric: tabular-nums;
}

/* Set font variant for headings and headlines */
.firstHeading, .mw-headline {
   font-variant-numeric: lining-nums;
}

/* Set font-family for specific elements within body */
.mw-body .firstHeading, .mw-headline, .mw-body-content sub, .mw-body-content sup, .reference {
   font-family: 'Crimson Pro', serif;
}

/* Set max-width for content area */
#content {
   max-width: 1175px;
}

/* Set font-family and font variant for multiple elements */
h3, h4, h5, h6, b, h3 .mw-headline, h4 .mw-headline, h5 .mw-headline, h6 .mw-headline, .mw-editsection, .mw-body-content p b, b a, #mw-head, #mw-panel, #mw-head li, #mw-panel li, #mp-topbanner, .rt-tooltip {
   font-family: 'Open Sans', sans-serif;
   font-variant-numeric: lining-nums;
}

/* Set font weights and sizes for headings */
h1, h2, h3, h4, h5, h6, .vector-body h2 {
   font-family: 'Crimson Pro', serif;
   font-weight: 700;
   margin-top:1em;
   margin-bottom:1em;
}

h1 { font-size: 2.441em; } /* Scale based on a ratio */
h2 { font-size: 1.953em; }
h3 { font-size: 1.563em; }
h4 { font-size: 1.25em; }
h5 { font-size: 1.0em; }
h6 { font-size: 0.8em; }

/* Reduce font size for certain elements for emphasis */
p b, dd b, li b, td b, span b, code, pre {
   font-size: 80%;
}

li, dl dd {
	margin-top:0.5em;
	margin-bottom:0.5em;
}

.thumbcaption, .infobox-caption, .locmap div div, .sidebar-caption {
    font-size: 0.9em;
    font-style: italic;
    text-align: center;
    padding-top: 0.5em;
}

.infobox {
    margin: 2em 0 0.5em 1em;
    padding: 1em;
}

.thumbcaption i, .thumbcaption em, .infobox-caption i, .infobox-caption em {
	font-style: normal; /* override italic style */
}

.hatnote {
    margin-top: 1em;
}

/* Reduce top banner font size */
#mp-topbanner {
   font-size: 85%;
}

/* Set font variant for sup */
sup {
   font-variant-position: super;
   font-variant-numeric: lining-nums;
}

/* Set max-width, margins, padding and font variant for paragraph, dl */
.mw-body-content p, dl {
   margin-top: 1.5em;
   margin-bottom: 1.5em;
   font-variant-numeric: oldstyle-nums;
   hyphens: auto;
   text-align: justify;
}

.mw-body-content li {
   font-variant-numeric: oldstyle-nums;
   hyphens: auto;
   text-align: justify;
   max-width: 48ch;
}

.mw-parser-output .sidebar p {
text-align: center;
}

.mw-parser-output .side-box {
	margin-bottom:2em !important;
}

/* Set font variant for dd within dl */
dl dd {
   font-variant-numeric: oldstyle-nums;
}

/* Hide edit section by default, show on hover */
.mw-content-ltr .mw-editsection {
   opacity: 0;
}

.mw-content-ltr .mw-editsection:hover {
   opacity: 1;
}

/* Set max-width for page history and contribution list items */
#pagehistory li, .ve-ce-branchNode.ve-ce-contentBranchNode.ve-ce-paragraphNode, .mw-contributions-list li {
   max-width: 100%;
}

/* Move left-aligned images to the right */
div.tleft {
   clear: right;
   float: right;
   margin: 0.5em 0 1.3em 1.4em;
}

/* Limit image width and adjust height automatically */
.center *:not(.notpageimage), div.thumbinner, div.tleft, div.tnone, div.tright, html .thumbimage, img:not(.notpageimage) {
   max-width: 100%;
   height: auto;
}

/* Do not shrink images within mbox-image */
.mbox-image img {
   min-width: initial;
}

/* Adjust width and max-width for dl and table within dd */
#mw-content-text dl dd table {
   width: 98%;
   max-width: 98%;
}


/* Apply small-caps and remove underline for abbreviations */
abbr {
   font-variant-caps: all-small-caps;
   text-decoration-line: none;
   font-size: 1.25em;
}

/* Tweak appearance of packed galleries */
.mw-gallery-packed, .mw-gallery-packed-overlay, .mw-gallery-packed-hover {
   text-align: left;
   position: relative;
   width: 100%;
   margin-left: 0;
}

li.gallerybox{
	margin:0.25em;
}

/* Style for anchor links */
a {
   color: #0645ad; 
   text-decoration: none;
}

a:hover {
   text-decoration: underline;
}

/* Style for lists */
ul, ol {
   margin-left: 2em;
}