MediaWiki:Common.css: Difference between revisions
From Ages of Conflict
Content added Content deleted
No edit summary Tag: Reverted |
m (Reverted edits by CrimzonConflict (talk) to last revision by [[User:wikia:aocw>XRusak|wikia:aocw>XRusak]]) Tags: Rollback Reverted |
||
Line 1: | Line 1: | ||
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:BalancedSearch.css&only=styles"; |
|||
/** Sidebars **/ |
|||
/* CSS */ |
|||
/* Placing all sidebars to the left aka forcing layout under 1340px as default |
|||
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:UpgradedToolbar.css&only=styles"; |
|||
Taken from Inkipedia [ https://splatoonwiki.org/wiki/MediaWiki:Timeless.css ] */ |
|||
/* CSS */ |
|||
@media (min-width: 1340px) { |
|||
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:LocalNavExploreIcons.css&only=styles"; |
|||
#mw-content-block { |
|||
/* CSS */ |
|||
display: block; } |
|||
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:BalancedProfile.css&only=styles"; |
|||
#mw-content, |
|||
/* CSS */ |
|||
#content-bottom-stuff { |
|||
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:StylizedTabs.css&only=styles"; |
|||
margin-left: 14em; } |
|||
/* CSS */ |
|||
#mw-content-wrapper { |
|||
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:OldEuropa.css&only=styles"; |
|||
float: right; |
|||
/* CSS */ |
|||
margin-left: -14em; |
|||
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:AdBlock.css&only=styles"; |
|||
width: 100%; } |
|||
/* CSS */ |
|||
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:opsz,wght@6..12,200&display=swap'); |
|||
#mw-site-navigation, #mw-related-navigation { |
|||
/* CSS */ |
|||
width: 14em; } |
|||
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:FontAwesome.css&only=styles"; |
|||
#mw-related-navigation { |
|||
/* CSS */ |
|||
padding: 0 1em 0 0; } |
|||
.main-container h1,.main-container h2, .main-container h3, .main-container h4, .main-container h5 { |
|||
font-family: "Nunito Sans", sans-serif; |
|||
} |
} |
||
.resizable-container { |
|||
font-family: "Nunito Sans", sans-serif; |
|||
font-weight: 400; |
|||
} |
|||
div.page:before { |
|||
/* first we initialise the pseudo element */ |
|||
content: ''; |
|||
display: block; |
|||
position: absolute; /* remove the element from the normal document flow so it doesn't shift anything unwanted */ |
|||
/* fill the entire container */ |
|||
width: 100%; |
|||
height: 100%; |
|||
/* now we have our code */ |
|||
background: url('https://static.wikia.nocookie.net/ages-of-conflict-world-war-simulator/images/f/fb/Camo.png/revision/latest/scale-to-width-down/600'); |
|||
background-repeat: repeat; |
|||
background-attachment: fixed; |
|||
background-size: auto; |
|||
opacity: 0.2; |
|||
} |
|||
.page__main { |
|||
background-color: rgba(var(--theme-page-background-color--rgb), |
|||
0.7); |
|||
} |
|||
/*COMMUNITY HEADER drop shadow*/ |
|||
.theme-fandomdesktop-light .fandom-community-header { |
|||
filter: drop-shadow(0px 0px 6px #FF6A00) drop-shadow(0px 0px 2px #FF6A00); |
|||
z-index: 200; |
|||
} |
|||
.theme-fandomdesktop-dark .fandom-community-header { |
|||
filter: drop-shadow(0px 0px 6px #FF6A00) drop-shadow(0px 0px 2px #FF6A00); |
|||
z-index: 200; |
|||
} |
|||
/* CSS */ |
|||
a[href="/wiki/User:Spacewolf9"] {color:Gold; font-weight:bold; filter:drop-shadow(0px 0px 2px #Ffd700);} |
|||
/* CSS */ |
|||
#navbar a:hover { |
|||
background-color: #ddd; |
|||
color: black; |
|||
} |
|||
.MPElement { |
|||
padding: 20px; |
|||
background-color: #D2B48C; |
|||
color: #3D3D3D; |
|||
border: 1px solid #888; |
|||
margin-bottom: 10px; |
|||
transition: all 0.3s ease; /* Shorter transition for a more subtle effect */ |
|||
} |
|||
.MPElement:hover { |
|||
background-color: #C19A6B; /* Subtle change in background color on hover */ |
|||
} |
|||
.MPElement h2 { |
|||
margin: 0; |
|||
padding-bottom: 10px; |
|||
border-bottom: 1px solid #888; |
|||
} |
|||
.MPElement p.small { |
|||
font-size: 0.8em; |
|||
margin-top: 10px; |
|||
border-top: 1px solid #888; |
|||
} |
|||
.MPElement a { |
|||
color: #008B8B; /* Link color that stands out against both light and dark backgrounds */ |
|||
} |
|||
.MPElement a:hover { |
|||
color: #00FFFF; /* Link color on hover */ |
|||
} |
|||
.container { |
|||
display: flex; /* Aligns the boxes horizontally */ |
|||
} |
|||
.MPElement { |
|||
flex: 1; /* Each box will take up an equal amount of space */ |
|||
padding: 20px; |
|||
background-color: #D2B48C; |
|||
color: #3D3D3D; |
|||
border: 1px solid #888; |
|||
margin: 10px; /* Space around each box */ |
|||
transition: all 0.3s ease; |
|||
} |
|||
.MPElement:hover { |
|||
background-color: #776650; |
|||
} |
|||
.MPElement h2 { |
|||
margin: 0; |
|||
padding-bottom: 10px; |
|||
border-bottom: 1px solid #888; |
|||
} |
|||
.MPElement p.small { |
|||
font-size: 0.8em; |
|||
margin-top: 10px; |
|||
border-top: 1px solid #888; |
|||
} |
|||
.fandom-community-header .wds-button.wds-is-secondary { |
|||
border-radius: 20px; |
|||
border-width: 2px; |
|||
margin: 3px |
|||
} |
|||
.fandom-community-header .wds-button-group > .wds-dropdown:not(:first-child) .wds-button { |
|||
border-radius: 10px; |
|||
margin: 3px; |
|||
} |
|||
/* MediaWiki:Common.css */ |
|||
.navigation-item:hover { |
|||
background-color: #D2B48C; |
|||
color: #fff; |
|||
} |
|||
.pi-image { |
|||
clip-path: content-box; |
|||
} |
|||
.pi-image img { |
|||
transition: transform 0.5s; |
|||
} |
|||
.pi-image img:hover { |
|||
transform: scale(1.04); |
|||
} |
|||
/*Username Custom Font*/ |
|||
a[href$="/wiki/User:XRusak"] { |
|||
animation-name:rainbow; |
|||
animation-duration: 3s; |
|||
animation-delay:0s; |
|||
animation-iteration-count: infinite; |
|||
animation-timing-function: linear; |
|||
-webkit-background-clip:text; |
|||
-moz-animation-timing-function: linear; |
|||
-webkit-animation-timing-function: linear; |
|||
} |
|||
@keyframes rainbow { |
|||
0% {color:red;} |
|||
17% {color:orange;} |
|||
33% {color:yellow;} |
|||
50% {color:green;} |
|||
67% {color:blue;} |
|||
83% {color:violet;} |
|||
100% {color:red;} |
|||
} |
|||
} |
|||
.image-row { |
.image-row { |
||
display: flex; |
display: flex; |
||
Line 42: | Line 199: | ||
transition: transform 0.5s; |
transition: transform 0.5s; |
||
} |
} |
||
/* Social wrapper */ |
|||
.some-wrapper { |
|||
.pi-image img:hover { |
|||
display: grid; |
|||
grid-template-columns: repeat(2, 1fr); |
|||
/* Community background color */ |
|||
place-content: center; |
|||
body { |
|||
background |
background: #303237; |
||
width: 100%; |
|||
overflow: hidden; |
|||
} |
} |
||
/* |
/* Social header */ |
||
#mw-navigation { |
|||
.some-header { |
|||
background-color: #5e6732; |
|||
font-family: 'Nunito Sans', sans-serif; |
|||
font-weight: bold; |
|||
font-size: 20px; |
|||
text-align: center; |
|||
grid-column: 1 / -1; |
|||
color: white; |
|||
background: #0C699F; |
|||
padding: 10px; |
|||
margin: 0 0 1rem; |
|||
} |
|||
/* Social icons */ |
|||
:is(.some-itch, .some-steam, .some-twitter, .some-youtube) { |
|||
padding: 1rem; |
|||
font-size: 4rem; |
|||
place-self: center; |
|||
transition: color 1s ease-in; |
|||
} |
} |
||
.some-itch a { |
|||
/* Community header color */ |
|||
color: #fa5c5c; |
|||
#mw-head { |
|||
background-color: #ffffff; |
|||
} |
} |
||
.some-steam a { |
|||
/* Accent color */ |
|||
color: #00adee; |
|||
a, |
|||
a:visited { |
|||
color: #c7b78b; |
|||
} |
} |
||
.some-twitter a { |
|||
/* Link color */ |
|||
color: #1DA1F2; |
|||
a:hover, |
|||
a:active { |
|||
color: #ffffff; |
|||
} |
} |
||
.some-youtube a { |
|||
/* Article background color */ |
|||
color: #FF0000; |
|||
#content { |
|||
background-color: #575f46; |
|||
} |
} |
||
:is(.some-itch, .some-steam, .some-twitter, .some-youtube) a:hover { |
|||
/* Text color */ |
|||
color: grey; |
|||
body { |
|||
cursor: pointer; |
|||
transition: color .5s ease-out; |
|||
} |
} |
Revision as of 15:01, 17 February 2024
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:BalancedSearch.css&only=styles";
/* CSS */
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:UpgradedToolbar.css&only=styles";
/* CSS */
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:LocalNavExploreIcons.css&only=styles";
/* CSS */
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:BalancedProfile.css&only=styles";
/* CSS */
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:StylizedTabs.css&only=styles";
/* CSS */
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:OldEuropa.css&only=styles";
/* CSS */
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:AdBlock.css&only=styles";
/* CSS */
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:opsz,wght@6..12,200&display=swap');
/* CSS */
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:FontAwesome.css&only=styles";
/* CSS */
.main-container h1,.main-container h2, .main-container h3, .main-container h4, .main-container h5 {
font-family: "Nunito Sans", sans-serif;
}
.resizable-container {
font-family: "Nunito Sans", sans-serif;
font-weight: 400;
}
div.page:before {
/* first we initialise the pseudo element */
content: '';
display: block;
position: absolute; /* remove the element from the normal document flow so it doesn't shift anything unwanted */
/* fill the entire container */
width: 100%;
height: 100%;
/* now we have our code */
background: url('https://static.wikia.nocookie.net/ages-of-conflict-world-war-simulator/images/f/fb/Camo.png/revision/latest/scale-to-width-down/600');
background-repeat: repeat;
background-attachment: fixed;
background-size: auto;
opacity: 0.2;
}
.page__main {
background-color: rgba(var(--theme-page-background-color--rgb),
0.7);
}
/*COMMUNITY HEADER drop shadow*/
.theme-fandomdesktop-light .fandom-community-header {
filter: drop-shadow(0px 0px 6px #FF6A00) drop-shadow(0px 0px 2px #FF6A00);
z-index: 200;
}
.theme-fandomdesktop-dark .fandom-community-header {
filter: drop-shadow(0px 0px 6px #FF6A00) drop-shadow(0px 0px 2px #FF6A00);
z-index: 200;
}
/* CSS */
a[href="/wiki/User:Spacewolf9"] {color:Gold; font-weight:bold; filter:drop-shadow(0px 0px 2px #Ffd700);}
/* CSS */
#navbar a:hover {
background-color: #ddd;
color: black;
}
.MPElement {
padding: 20px;
background-color: #D2B48C;
color: #3D3D3D;
border: 1px solid #888;
margin-bottom: 10px;
transition: all 0.3s ease; /* Shorter transition for a more subtle effect */
}
.MPElement:hover {
background-color: #C19A6B; /* Subtle change in background color on hover */
}
.MPElement h2 {
margin: 0;
padding-bottom: 10px;
border-bottom: 1px solid #888;
}
.MPElement p.small {
font-size: 0.8em;
margin-top: 10px;
border-top: 1px solid #888;
}
.MPElement a {
color: #008B8B; /* Link color that stands out against both light and dark backgrounds */
}
.MPElement a:hover {
color: #00FFFF; /* Link color on hover */
}
.container {
display: flex; /* Aligns the boxes horizontally */
}
.MPElement {
flex: 1; /* Each box will take up an equal amount of space */
padding: 20px;
background-color: #D2B48C;
color: #3D3D3D;
border: 1px solid #888;
margin: 10px; /* Space around each box */
transition: all 0.3s ease;
}
.MPElement:hover {
background-color: #776650;
}
.MPElement h2 {
margin: 0;
padding-bottom: 10px;
border-bottom: 1px solid #888;
}
.MPElement p.small {
font-size: 0.8em;
margin-top: 10px;
border-top: 1px solid #888;
}
.fandom-community-header .wds-button.wds-is-secondary {
border-radius: 20px;
border-width: 2px;
margin: 3px
}
.fandom-community-header .wds-button-group > .wds-dropdown:not(:first-child) .wds-button {
border-radius: 10px;
margin: 3px;
}
/* MediaWiki:Common.css */
.navigation-item:hover {
background-color: #D2B48C;
color: #fff;
}
.pi-image {
clip-path: content-box;
}
.pi-image img {
transition: transform 0.5s;
}
.pi-image img:hover {
transform: scale(1.04);
}
/*Username Custom Font*/
a[href$="/wiki/User:XRusak"] {
animation-name:rainbow;
animation-duration: 3s;
animation-delay:0s;
animation-iteration-count: infinite;
animation-timing-function: linear;
-webkit-background-clip:text;
-moz-animation-timing-function: linear;
-webkit-animation-timing-function: linear;
}
@keyframes rainbow {
0% {color:red;}
17% {color:orange;}
33% {color:yellow;}
50% {color:green;}
67% {color:blue;}
83% {color:violet;}
100% {color:red;}
}
}
.image-row {
display: flex;
justify-content: space-between;
padding: 20px; /* Add padding to the row */
}
.image-box img {
height: 134.38px;
width: 100%;
transition: 0.2s;
object-fit: cover;
}
.image-box:hover img {
transform: scale(1.05);
}
.pi-image {
clip-path: content-box;
}
.pi-image img {
transition: transform 0.5s;
}
/* Social wrapper */
.some-wrapper {
display: grid;
grid-template-columns: repeat(2, 1fr);
place-content: center;
background: #303237;
width: 100%;
overflow: hidden;
}
/* Social header */
.some-header {
font-family: 'Nunito Sans', sans-serif;
font-weight: bold;
font-size: 20px;
text-align: center;
grid-column: 1 / -1;
color: white;
background: #0C699F;
padding: 10px;
margin: 0 0 1rem;
}
/* Social icons */
:is(.some-itch, .some-steam, .some-twitter, .some-youtube) {
padding: 1rem;
font-size: 4rem;
place-self: center;
transition: color 1s ease-in;
}
.some-itch a {
color: #fa5c5c;
}
.some-steam a {
color: #00adee;
}
.some-twitter a {
color: #1DA1F2;
}
.some-youtube a {
color: #FF0000;
}
:is(.some-itch, .some-steam, .some-twitter, .some-youtube) a:hover {
color: grey;
cursor: pointer;
transition: color .5s ease-out;
}