MediaWiki:Common.css: Difference between revisions
Appearance
No edit summary |
No edit summary Tags: Manual revert Mobile edit Mobile web edit |
||
| (36 intermediate revisions by the same user not shown) | |||
| Line 14: | Line 14: | ||
line-height: 1.5em; | line-height: 1.5em; | ||
width: 22em; | width: 22em; | ||
} | |||
/* Ensure table takes full width */ | |||
.infobox tbody, | |||
.infobox tr { | |||
width: 100%; | |||
display: table; | |||
table-layout: fixed; | |||
} | } | ||
| Line 20: | Line 28: | ||
font-weight: bold; | font-weight: bold; | ||
text-align: center; | text-align: center; | ||
background-color: | background-color: ; | ||
padding: 0.2em; | padding: 0.2em; | ||
} | } | ||
| Line 41: | Line 49: | ||
text-align: left; | text-align: left; | ||
padding: 0.2em 0.4em; | padding: 0.2em 0.4em; | ||
background-color: | background-color: transparent; | ||
width: 35%; | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
} | } | ||
| Line 47: | Line 58: | ||
vertical-align: top; | vertical-align: top; | ||
padding: 0.2em 0.4em; | padding: 0.2em 0.4em; | ||
width: 65%; | |||
word-wrap: break-word; | |||
} | } | ||
.infobox-header { | .infobox-header { | ||
text-align: center; | text-align: center; | ||
background-color: | background-color: ; | ||
font-weight: bold; | font-weight: bold; | ||
padding: 0.2em; | padding: 0.2em; | ||
| Line 61: | Line 74: | ||
padding: 0.2em; | padding: 0.2em; | ||
} | } | ||
/* URL template styling */ | |||
.url { | |||
word-wrap: break-word; | |||
word-break: break-all; | |||
} | |||
/* Code template styling */ | |||
code { | |||
background-color: #f6f6f6; | |||
border: 1px solid #ddd; | |||
border-radius: 3px; | |||
padding: 1px 4px; | |||
font-family: Consolas, Monaco, 'Courier New', monospace; | |||
font-size: 90%; | |||
white-space: pre-wrap; | |||
word-wrap: break-word; | |||
} | |||
.shortdescription { | |||
display: block; | |||
font-size: 90%; | |||
color: #54595d; | |||
font-style: italic; | |||
margin-top: -0.5em; | |||
margin-bottom: 1em; | |||
line-height: 1.4; | |||
} | |||
/* Change the color of User:Shaunak Chakraborty page title to blue */ | |||
.page-User_Shaunak_Chakraborty #firstHeading { | |||
color: blue; | |||
} | |||
/* Alternative: Use a darker blue */ | |||
.page-User_Shaunak_Chakraborty #firstHeading { | |||
color: #00008B; /* Dark blue */ | |||
} | |||
/* Alternative: Use a lighter blue */ | |||
.page-User_Shaunak_Chakraborty #firstHeading { | |||
color: #1E90FF; /* Dodger blue */ | |||
} | |||
/* Mobile responsiveness */ | /* Mobile responsiveness */ | ||
@media screen and (max-width: 640px) { | @media screen and (max-width: 640px) { | ||
.infobox { | |||
width: 100% !important; | |||
max-width: 100% !important; | |||
margin: 0.5em 0 !important; | |||
float: none !important; | |||
clear: both !important; | |||
display: block !important; | |||
box-sizing: border-box !important; | |||
} | |||
/* Ensure table elements take full width on mobile */ | |||
.infobox tbody, | |||
.infobox tr { | |||
width: 100% !important; | |||
display: table !important; | |||
table-layout: fixed !important; | |||
} | |||
.infobox th { | |||
width: 35% !important; | |||
white-space: nowrap !important; | |||
overflow: hidden !important; | |||
text-overflow: ellipsis !important; | |||
} | |||
.infobox td { | |||
width: 65% !important; | |||
word-wrap: break-word !important; | |||
} | |||
} | |||
/* Tablet responsiveness */ | |||
@media screen and (max-width: 768px) { | |||
.infobox { | .infobox { | ||
width: 100%; | width: 100%; | ||
margin: 0.5em 0; | margin: 0.5em 0; | ||
float: none; | float: none; | ||
clear: both; | |||
} | |||
.infobox tbody, | |||
.infobox tr { | |||
width: 100%; | |||
display: table; | |||
table-layout: fixed; | |||
} | } | ||
} | } | ||
Latest revision as of 12:24, 6 December 2025
/* CSS placed here will be applied to all skins */
/* Infobox styling */
.infobox {
border: 1px solid #a2a9b1;
border-spacing: 3px;
background-color: #f8f9fa;
color: black;
margin: 0.5em 0 0.5em 1em;
padding: 0.2em;
float: right;
clear: right;
font-size: 88%;
line-height: 1.5em;
width: 22em;
}
/* Ensure table takes full width */
.infobox tbody,
.infobox tr {
width: 100%;
display: table;
table-layout: fixed;
}
.infobox-title {
font-size: 125%;
font-weight: bold;
text-align: center;
background-color: ;
padding: 0.2em;
}
.infobox-above {
font-size: 110%;
text-align: center;
background-color: #e6e6e6;
padding: 0.2em;
}
.infobox-image {
text-align: center;
padding: 0.2em;
}
.infobox th {
vertical-align: top;
white-space: nowrap;
text-align: left;
padding: 0.2em 0.4em;
background-color: transparent;
width: 35%;
overflow: hidden;
text-overflow: ellipsis;
}
.infobox td {
vertical-align: top;
padding: 0.2em 0.4em;
width: 65%;
word-wrap: break-word;
}
.infobox-header {
text-align: center;
background-color: ;
font-weight: bold;
padding: 0.2em;
}
.infobox-below {
text-align: center;
background-color: #e6e6e6;
padding: 0.2em;
}
/* URL template styling */
.url {
word-wrap: break-word;
word-break: break-all;
}
/* Code template styling */
code {
background-color: #f6f6f6;
border: 1px solid #ddd;
border-radius: 3px;
padding: 1px 4px;
font-family: Consolas, Monaco, 'Courier New', monospace;
font-size: 90%;
white-space: pre-wrap;
word-wrap: break-word;
}
.shortdescription {
display: block;
font-size: 90%;
color: #54595d;
font-style: italic;
margin-top: -0.5em;
margin-bottom: 1em;
line-height: 1.4;
}
/* Change the color of User:Shaunak Chakraborty page title to blue */
.page-User_Shaunak_Chakraborty #firstHeading {
color: blue;
}
/* Alternative: Use a darker blue */
.page-User_Shaunak_Chakraborty #firstHeading {
color: #00008B; /* Dark blue */
}
/* Alternative: Use a lighter blue */
.page-User_Shaunak_Chakraborty #firstHeading {
color: #1E90FF; /* Dodger blue */
}
/* Mobile responsiveness */
@media screen and (max-width: 640px) {
.infobox {
width: 100% !important;
max-width: 100% !important;
margin: 0.5em 0 !important;
float: none !important;
clear: both !important;
display: block !important;
box-sizing: border-box !important;
}
/* Ensure table elements take full width on mobile */
.infobox tbody,
.infobox tr {
width: 100% !important;
display: table !important;
table-layout: fixed !important;
}
.infobox th {
width: 35% !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
.infobox td {
width: 65% !important;
word-wrap: break-word !important;
}
}
/* Tablet responsiveness */
@media screen and (max-width: 768px) {
.infobox {
width: 100%;
margin: 0.5em 0;
float: none;
clear: both;
}
.infobox tbody,
.infobox tr {
width: 100%;
display: table;
table-layout: fixed;
}
}