MediaWiki:Common.css: Difference between revisions
No edit summary |
No edit summary |
||
| Line 97: | Line 97: | ||
/* Container | /*Make pretty button Layout */ | ||
/* Container to force the grid layout */ | |||
.button-grid-container { | .button-grid-container { | ||
display: grid !important; | display: grid !important; | ||
grid-template-columns: | grid-template-columns: 1fr 1fr !important; /* Forces 2 columns */ | ||
gap: | gap: 8px !important; | ||
max-width: | max-width: 350px !important; | ||
margin | margin: 15px 0 !important; | ||
} | } | ||
/* | /* Reset static-button to be a grid item */ | ||
.static-button { | .static-button { | ||
display: block !important; | display: block !important; | ||
width: auto !important; /* Removes the 120px restriction */ | |||
padding: 0 !important; | |||
background-color: #3eb489; /* Your | background-color: #3eb489 !important; /* Your mintarc Green */ | ||
border: 1px solid | border: 1px solid #287a5c !important; | ||
border-radius: | border-radius: 4px !important; | ||
transition: background 0.2s !important; | |||
} | } | ||
/* | /* Make the link inside fill the whole button area */ | ||
.static-button a { | .static-button a { | ||
display: block !important; | display: block !important; | ||
color: | padding: 10px 5px !important; | ||
color: white !important; | |||
text-align: center !important; | |||
text-decoration: none !important; | |||
font-weight: bold !important; | |||
} | |||
.static-button a:hover { | |||
background-color: #287a5c !important; | |||
text-decoration: none !important; | text-decoration: none !important; | ||
border-radius: 4px !important; | |||
} | } | ||
.static-button | /* Hide the external link icon to keep it clean */ | ||
background- | .static-button a.external { | ||
background-image: none !important; | |||
padding-right: 5px !important; | |||
} | } | ||
Revision as of 06:36, 1 May 2026
/* CSS placed here will be applied to all skins */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
h1.firstHeading {
font-family: 'Roboto', sans-serif;
}
.firstHeading {
display: none;
}
.mw-headline {
font-family: 'Roboto', sans-serif !important;
}
#p-search {
position: absolute;
top: 10px; /* Adjust as needed */
right: 20px; /* Change to move it left/right */
}
/* Change background color for Vector skin */
body {
background-color: #3eb489; /* Replace with your desired color */
}
#p-logo {
display: none;
}
#ca-talk { display: none !important; }
#ca-history { display: none !important;}
#ca-viewsource { display: none !important; }
.custom-button {
display: inline-block; /* Makes the button behave like a block */
padding: 5px 5px; /* Adds spacing inside the button */
font-size: 14px; /* Adjusts font size */
color: #fff; /* White text color */
background-color: #3eb489; /* Blue background */
border: 1px solid black; /* Black border */
border-radius: 3px; /* Rounded corners */
text-decoration: none; /* Removes underline from link */
text-align: center; /* Centers text inside the button */
cursor: pointer; /* Pointer cursor on hover */
}
.custom-button a {
display: block; /* Expands the link to fill the entire span */
color: #fff; /* White text color */
text-decoration: none; /* Removes underline from link */
vertical-align: middle; /* Ensures vertical alignment of text */
text-align: center; /* Centers text inside the button */
}
.custom-button:hover {
color: #fff; /* White text color */
}
.static-button {
width: 120px;
display: inline-block; /* Makes the button behave like a block */
padding: 5px 5px; /* Adds spacing inside the button */
font-size: 14px; /* Adjusts font size */
color: #fff; /* White text color */
background-color: #3eb489; /* Blue background */
border: 1px solid black; /* Black border */
border-radius: 3px; /* Rounded corners */
text-decoration: none; /* Removes underline from link */
text-align: center; /* Centers text inside the button */
cursor: pointer; /* Pointer cursor on hover */
}
.static-button a {
display: block; /* Expands the link to fill the entire span */
color: #fff; /* White text color */
text-decoration: none; /* Removes underline from link */
vertical-align: middle; /* Ensures vertical alignment of text */
text-align: center; /* Centers text inside the button */
}
.static-button:hover {
color: #fff; /* White text color */
}
.pre-content.heading-holder {
display: none !important;
}
/*Make pretty button Layout */
/* Container to force the grid layout */
.button-grid-container {
display: grid !important;
grid-template-columns: 1fr 1fr !important; /* Forces 2 columns */
gap: 8px !important;
max-width: 350px !important;
margin: 15px 0 !important;
}
/* Reset static-button to be a grid item */
.static-button {
display: block !important;
width: auto !important; /* Removes the 120px restriction */
padding: 0 !important;
background-color: #3eb489 !important; /* Your mintarc Green */
border: 1px solid #287a5c !important;
border-radius: 4px !important;
transition: background 0.2s !important;
}
/* Make the link inside fill the whole button area */
.static-button a {
display: block !important;
padding: 10px 5px !important;
color: white !important;
text-align: center !important;
text-decoration: none !important;
font-weight: bold !important;
}
.static-button a:hover {
background-color: #287a5c !important;
text-decoration: none !important;
border-radius: 4px !important;
}
/* Hide the external link icon to keep it clean */
.static-button a.external {
background-image: none !important;
padding-right: 5px !important;
}