MediaWiki:Common.css: Difference between revisions

From Bose Portable PA Encyclopedia
Jump to navigation Jump to search
mNo edit summary
mNo edit summary
 
(4 intermediate revisions by the same user not shown)
Line 179: Line 179:
}
}


/* === Top-left corner cell (above both sticky layers) === */
/* === Image display on hover over text === */
.mw-parser-output .l1-compare-wrap table.l1-compare th:first-child {
  z-index: 11;
  background: #f8f9fa;
}
 
// Image popup on hover over text


.hover-image-wrapper {
.hover-image-wrapper {
   position: relative;
   position: relative;
  display: inline-block;
   cursor: help;
   cursor: help;
}
}


.hover-image-popup {
.hover-image-popup {
  display: none;
   position: absolute;
   position: absolute;
   top: 1.2em;
   top: 1.2em;
   left: 0;
   left: 0;
   z-index: 9999;
   z-index: 9999;
   background: #fff;
   background: #fff;
   padding: 4px;
   padding: 4px;
   border: 1px solid #ccc;
   border: 1px solid #ccc;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.15s ease-in-out;
}
}


.hover-image-wrapper:hover .hover-image-popup {
.hover-image-wrapper:hover .hover-image-popup {
   display: block;
   visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
}
body { outline: 5px solid red !important; }

Latest revision as of 09:05, 27 February 2026

/** CSS placed here will be applied to all skins */

@font-face {
    font-family:"Gotham-Black";
    src:url("/styles/Gotham-Black.otf")
}

@font-face {
    font-family:"Gotham-BlackItalic";
    src:url("/styles/Gotham-BlackItalic.otf")
}

@font-face {
    font-family:"Gotham-Bold";
    src:url("/styles/Gotham-Bold.otf")
}
@font-face {
    font-family:"Gotham-BoldItalic";
    src:url("/styles/Gotham-BoldItalic.otf")
}

@font-face {
    font-family:"Gotham-Book";
    src:url("/styles/Gotham-Book.otf")
}

@font-face {
    font-family:"Gotham-BookItalic";
    src:url("/styles/Gotham-BookItalic.otf")
}
h1, h2, h3, h4, h5, h6 { font-family:Gotham-Book; 
                         /* text-transform: uppercase; */
}
body {font-family:Gotham-Book;Montserrat}

.mw-body h1,.mw-body h2,.mw-body h3, .mw-body h4,.mw-body h5 {font-family:Gotham-Book,Montserrat}



.mw-headline
{
	font-family: "Gotham-Bold","Gotham-Book" , Montserrat, sans-serif;
	/*font-size: 14px; */
	/*font-weight: bold;*/
	/*color: #008080;*/
background:#ffffff;
//background:#cef2e0;
//	background-color: #CCFFCC;
//	border-radius: 5px;
	//border: 1px outset #008080;
padding: 2px;
	width: 300px;
}
.structuredData {display:none}

td {vertical-align:top}

body {
 max-width:1366px; 
}

/* max-width of text on page 
body {max-width:1366px;}
html {max-width:1366px;}
.mw-body-content {max-width:1366px;}
*/


/* ****************** NO TITLE ON MAINPAGE *************** */
body.page-The_Bose_Professional_Portable_PA_Encyclopedia_FAQ_Wiki.action-view h1.firstHeading, body.page-The_Bose_Professional_Portable_PA_Encyclopedia_FAQ_Wiki.action-submit h1.firstHeading { display: none; }



/* responsive image sizing */
img {
  max-width: 100%;
  height: auto;
}

/* responsive table of contents with introduction https://medium.freecodecamp.org/how-to-make-your-html-responsive-by-adding-a-single-line-of-css-2a62de81e431 */
    .tocdiv {
    max-width: 1366px;
    display: grid;
    grid-gap: 15px;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    grid-template-columns: repeat(auto-fit, minmax(300px, 4fr));
    grid-template-rows: repeat(2, 300px);
    grid-template-rows: repeat(auto-fit, minmax(300px, 1fr));


/*  responsive iframe for youtube videos */
@media screen and (max-width: 750px) {
    iframe {
        max-width: 100% !important;
        width: auto !important;
        height: auto !important;
    }
}

/* Power Characters */
@font-face {
    font-family: 'power_symbols';
    src: url('https://toonz.ca/fonts/unicode/Unicode_IEC_symbol.ttf') format('ttf'),
         url('https://toonz.ca/fonts/unicode/Unicode_IEC_symbol.woff2') format('woff2'),
         url('https://toonz.ca/fonts/unicode/Unicode_IEC_symbol.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.power{
  font-family: 'power_symbols';
  font-style: normal;
}

/* standard link colors */
.mw-body-content a:link { color: #0000FF; } /* normal unvisited links */
.mw-body-content a:link:visited { color: #0B0080; } /* visited links */
.mw-body-content a:link:active { color: #FF0000; } /* active links */
.mw-body-content a:link.new { color: #FF0000; } /* new links */
.mw-body-content a:link.extiw { color: #3366BB; } /* interwiki links */
.mw-body-content a:link.external { color: #3366BB; } /* external links */
.mw-body-content a:link.stub { color: #772233; } /* hovered links */

.mw-body-content a:link {color: #FF0000}
.mw-body-content a:visited {color: #00FF00}
.mw-body-content a:hover {color: #FF00FF}
.mw-body-content a:active {color: #0000FF}

// no right click
img {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

// l1 comparison table

/* === L1 comparison table scroll container === */
.mw-parser-output .l1-compare-wrap {
  display: block;
  overflow-x: auto;
  overflow-y: visible;
  width: 100%;
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
  background: #ffffff;
}

/* === CRITICAL OVERRIDE: defeat Vector/Minerva table width clamp === */
.mw-parser-output .l1-compare-wrap table.l1-compare {
  white-space: nowrap;
  width: max-content;
  min-width: 1400px;
  max-width: none !important;   /* ← THIS is the blocker you were hitting */
  border-collapse: separate;
  border-spacing: 0;
}

/* === Sticky header row === */
.mw-parser-output .l1-compare-wrap table.l1-compare th {
  position: sticky;
  top: 0;
  background: #f8f9fa;
  color: #202122;
  z-index: 10;
}

/* === Sticky first column === */
.mw-parser-output .l1-compare-wrap table.l1-compare th:first-child,
.mw-parser-output .l1-compare-wrap table.l1-compare td:first-child {
  position: sticky;
  left: 0;
  background: #ffffff;
  z-index: 9;
  border-right: 1px solid #a2a9b1;
}

/* === Image display on hover over text === */

.hover-image-wrapper {
  position: relative;
  display: inline-block;
  cursor: help;
}

.hover-image-popup {
  position: absolute;
  top: 1.2em;
  left: 0;
  z-index: 9999;

  background: #fff;
  padding: 4px;
  border: 1px solid #ccc;

  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;

  transition: opacity 0.15s ease-in-out;
}

.hover-image-wrapper:hover .hover-image-popup {
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

body { outline: 5px solid red !important; }