MediaWiki:Common.css: Difference between revisions
From PC Gaming Shelter
No edit summary Tag: Reverted |
No edit summary Tag: Reverted |
||
| Line 20: | Line 20: | ||
} | } | ||
/* --- FORM INPUT FIXES --- */ | /* --- FORM INPUT FIXES (The "Strange Box" Fix) --- */ | ||
/* 1. Force Text Inputs and Date Pickers to | /* 1. Force Text Inputs and Date Pickers to be 100% Width */ | ||
.game-form input[type="text"], | .game-form input[type="text"], | ||
.game-form input.hasDatepicker { | .game-form input.hasDatepicker { | ||
| Line 37: | Line 37: | ||
} | } | ||
/* 2. Fix Series/Token Box */ | /* 2. Fix Series/Token Box (The "Select2" Script) */ | ||
/* This forces the token box to expand fully */ | |||
.select2-container { | .select2-container { | ||
width: 100% !important; | width: 100% !important; | ||
| Line 50: | Line 51: | ||
} | } | ||
/* --- THE CHECKBOX FIX ( | /* --- THE CHECKBOX FIX (The "Invisible Comma" Method) --- */ | ||
/* 1. The Container: Hide the commas */ | /* 1. The Container: Hide the commas using font-size 0 */ | ||
.checkbox-grid { | .checkbox-grid { | ||
width: 100%; | width: 100%; | ||
font-size: 0 !important; /* This | font-size: 0 !important; /* This hides the text commas */ | ||
line-height: 0 !important; | line-height: 0 !important; | ||
margin-top: 5px; | margin-top: 5px; | ||
} | } | ||
/* 2. The Items: Make them visible blocks */ | /* 2. The Items: Make them visible blocks again */ | ||
/* | /* We target 'span' because Page Forms wraps every checkbox in a span */ | ||
.checkbox-grid span { | .checkbox-grid span { | ||
display: inline-block !important; | display: inline-block !important; | ||
width: 32 | width: 32%; /* 3 Columns (32% * 3 approx 96%) */ | ||
vertical-align: top; | vertical-align: top; | ||
margin-right: | margin-right: 1%; | ||
margin-bottom: 6px; | margin-bottom: 6px; | ||
/* RESTORE TEXT */ | /* RESTORE TEXT VISIBILITY */ | ||
font-size: 13px !important; | font-size: 13px !important; | ||
line-height: 1.4 !important; | line-height: 1.4 !important; | ||
| Line 85: | Line 86: | ||
} | } | ||
/* 3 | /* 3. Hover Effect */ | ||
.checkbox-grid span:hover { | .checkbox-grid span:hover { | ||
background: #f0f8ff; | background: #f0f8ff; | ||
border-color: #3366cc; | border-color: #3366cc; | ||
cursor: pointer; | |||
} | } | ||
/* | /* 4. Hide invisible line breaks */ | ||
.checkbox-grid br { display: none !important; } | .checkbox-grid br { display: none !important; } | ||
Revision as of 12:39, 10 February 2026
/* CSS placed here will be applied to all skins */
/* --- TABLE FIXES (Keep these) --- */
.fullwidth { width: 100% !important; }
.nowrap { white-space: nowrap; }
table.wikitable th a,
table.wikitable th.headerSort a {
pointer-events: none !important;
cursor: pointer !important;
color: black !important;
text-decoration: none !important;
}
.hide-Genre .col-genre,
.hide-Platform .col-platform,
.hide-Mode .col-mode,
.hide-Players .col-players {
display: none !important;
}
/* --- FORM INPUT FIXES (The "Strange Box" Fix) --- */
/* 1. Force Text Inputs and Date Pickers to be 100% Width */
.game-form input[type="text"],
.game-form input.hasDatepicker {
width: 100% !important;
box-sizing: border-box !important;
height: 34px !important;
padding: 5px 8px !important;
border: 1px solid #ccc !important;
border-radius: 3px !important;
font-family: sans-serif !important;
font-size: 13px !important;
margin: 0 !important;
box-shadow: none !important;
}
/* 2. Fix Series/Token Box (The "Select2" Script) */
/* This forces the token box to expand fully */
.select2-container {
width: 100% !important;
display: block !important;
}
.select2-container .select2-selection--multiple {
min-height: 34px !important;
border: 1px solid #ccc !important;
border-radius: 3px !important;
background: #fff;
padding: 2px !important;
}
/* --- THE CHECKBOX FIX (The "Invisible Comma" Method) --- */
/* 1. The Container: Hide the commas using font-size 0 */
.checkbox-grid {
width: 100%;
font-size: 0 !important; /* This hides the text commas */
line-height: 0 !important;
margin-top: 5px;
}
/* 2. The Items: Make them visible blocks again */
/* We target 'span' because Page Forms wraps every checkbox in a span */
.checkbox-grid span {
display: inline-block !important;
width: 32%; /* 3 Columns (32% * 3 approx 96%) */
vertical-align: top;
margin-right: 1%;
margin-bottom: 6px;
/* RESTORE TEXT VISIBILITY */
font-size: 13px !important;
line-height: 1.4 !important;
/* Box Look */
background: #fcfcfc;
border: 1px solid #ddd;
border-radius: 3px;
padding: 6px;
box-sizing: border-box;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* 3. Hover Effect */
.checkbox-grid span:hover {
background: #f0f8ff;
border-color: #3366cc;
cursor: pointer;
}
/* 4. Hide invisible line breaks */
.checkbox-grid br { display: none !important; }
