MediaWiki:Fandomdesktop.css

From Marvel Rivals Wiki
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/*============================

ATTENTION! Please refrain from copying any imported/customized content within the Marvel Rivals Wiki Fandom CSS
before seeking permission from the admin/bureaucrat -- Turquoisebutyellow --- who customized it.

ALL CSS placed here will be applied to the Fandomdesktop skin.

============================*/


/*============================
** Imports Section
============================*/

@import "/load.php?articles=MediaWiki:UserProfile.css|MediaWiki:Infobox.css|MediaWiki:Variables.css|MediaWiki:Templates.css|MediaWiki:ColorSchemes.css&only=styles&mode=articles";
@import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:CSS3Tooltip.css");
@import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:InterlanguageFlags.css");
@import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:BalancedProfile.css");
@import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:BalancedComments.css");
@import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:BalancedCategories.css");
@import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:AjaxPoll.Discussions.css");
@import url("https://use.fontawesome.com/releases/v5.9.0/css/all.css");


/* Fonts ================ */

@font-face {
    font-family: Marvel Rivals;
    src: url("https://www.marvelrivals.com/pc/gw/20240301101352//css/RefrigeratorDeluxeHeavy_8349567.ttf")
        format("truetype");
}

/*============================
** Mainpage Section
============================*/

.page__main, .page__right-rail {
    background: rgb(var(--theme-page-background-color--rgb), 0.70) !important;
}
body.page-Marvel_Rivals_Wiki .page__main, .rail-module {
    background: transparent !important;
}
body.page-Marvel_Rivals_Wiki .page-header__title {
    display: none !important;
}

/* Borders ================ */

#mr-main {
    position: relative;
    overflow: hidden;
    color: var(--main-font);
    background: var(--main-background);
    padding: 15px;
    margin-bottom: 20px;
    margin-right: 10px;
    padding-top: 30px;
    border: 3px solid var(--main-font);
    filter: drop-shadow(0.5em 0.5em 0 var(--main-font)) !important;
}
#mr-main h3 {
    font-family: Marvel Rivals;
    color: var(--main-font);
    text-align: left;
    position: relative;
    font-size: 50px;
    text-transform: uppercase;
    padding-left: 10px;
    margin-bottom: 0px;
    bottom: 25px;
    font-style: italic;
    z-index: 1;
    filter: drop-shadow(4px 4px 0 var(--main-background)) !important;
    text-shadow: 1px 1px 0 var(--main-background), -1px -1px 0 var(--main-background), 1px -1px 0 var(--main-background), -1px 1px 0 var(--main-background), 1px 1px 0 var(--main-background);
}

/* Welcome Banner ================ */

.page-content .welcome-block p,
.page-content .mp-block p,
.page-content .mp-block ul {
	margin-bottom: 0;
	margin-top:0;
}
.welcome-block .wds-button,
.mp-block .wds-button {
	cursor: pointer;
}
.page-content {
	overflow-x: initial;
}

/* welcome */
.page .welcome-block {
	position: relative;
	margin: 0px;
	--theme-page-text-color: #e6e6e6;
	color: #e6e6e6;
	--theme-accent-color:rgba(var(--theme-accent-color--rgb),.5);
	--theme-accent-color--hover:rgba(var(--theme-accent-color--rgb))
}
.welcome-block:before {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	content: '';
	background: linear-gradient(to top, rgba(0, 0, 0, .8) 25%, transparent);
	width: 100%;
	height: 100%;
	border-radius: 9px;
}
.welcome-block img {
	object-fit: cover;
	object-position: center;
	width: 100%;
	max-height: 30rem;
	border-radius: 9px;
}
.welcome-block .container-top {
	position: absolute;
	padding: 18px 36px;
	width: 100%;
	top: 0;
	text-align: justify;
}
.welcome-block .container-top .fas {
	font-size: 15px;
}
.welcome-block .container-bottom {
	position: absolute;
	bottom: 0;
	padding: 18px 36px;
	display: flex;
	align-items: center;
	width: 100%
}
.welcome-block .container-bottom div:first-of-type {
	flex: 1;
}


/* Mainpage Gallery Setup ================ */

.featured-img-main-page .wikia-gallery-item {
    transition: 0.5s all;
    margin-bottom: 0px;
}
.featured-img-main-page .wikia-gallery-spacing-small .wikia-gallery-item {
    padding: 3px;
}
.featured-img-main-page .wikia-gallery-item .thumb a.image img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}
.featured-img-main-page .wikia-gallery-item img {
    background: var(--theme-page-background-color) !important;
    border-radius: 3px;
    outline-offset: -1px;
    outline: 1px solid var(--theme-page-text-color);
    position: relative;
    object-position: top;
    top: 50%;
    transform: translateY(-50%) !important;
}
.featured-img-main-page .wikia-gallery-item .thumb {
    overflow: hidden !important;
    transition: 0.2s all;
}
.featured-img-main-page .wikia-gallery-item .thumb .lightbox-caption {
    padding: 3px 0;
    text-transform: uppercase;
    font-style: italic;
    font-size: 23px;
    color: var(--theme-page-text-color);
    text-shadow: 1px 1px 0 var(--theme-page-background-color),
        -1px -1px 0 var(--theme-page-background-color),
        1px -1px 0 var(--theme-page-background-color),
        -1px 1px 0 var(--theme-page-background-color),
        1px 1px 0 var(--theme-page-background-color);
    text-decoration: none;
    transition: 1s all;
    background: transparent !important;
    text-align: right;
    margin-right: 10px;
}
.featured-img-main-page a,
.wikia-gallery-item .thumb .lightbox-captionn {
    color: var(--theme-page-text-color);
    font-family: Marvel Rivals;
}
.featured-img-main-page
    .wikia-gallery-item
    .thumb
    .gallery-image-wrapper.accent {
    border: transparent;
}
.featured-img-main-page .wikia-gallery-item {
    transition: 0.5s all;
}
.featured-img-main-page .gallery-image-wrapper {
    transition: all 0.3s;
}

/* Hover ================ */
.featured-img-main-page .wikia-gallery-item .thumb:hover {
    background: transparent !important;
    transform: scale(1);
    filter: blur(0px);
    filter: saturate(1.2);
    opacity: 1;
    transition: 0.2s all;
    border: transparent;
    border-radius: 3px !important;
}
.featured-img-main-page .wikia-gallery-item .thumb a.image img:hover {
    transform: scale(1);
    filter: blur(0px);
    filter: saturate(1.2);
    transform: scale(1.05);
    transition: all 0.15s;
    outline-offset: -3px;
    outline: 3px solid var(--theme-page-text-color);
    border-radius: 3px !important;
}
.featured-img-main-page .wikia-gallery-item .thumb:hover a,
.featured-img-main-page .wikia-gallery-item:hover a,
.featured-img-main-page
    .wikia-gallery-captions-center
    .wikia-gallery-item:hover
    .lightbox-caption {
    border: transparent !important;
    color: var(--theme-link-color) !important;
    text-shadow: 1px 1px 0 var(--main-background),
        -1px -1px 0 var(--main-background),
        1px -1px 0 var(--main-background),
        -1px 1px 0 var(--main-background),
        1px 1px 0 var(--main-background) !important;
    text-decoration: none !important;
    transition: 1s all !important;
}
.featured-img-main-page .wikia-gallery-item img:hover {
    outline: 3px solid var(--theme-link-color) !important;
    outline-offset: -3px !important;
}
.featured-img-main-page:hover .gallery-image-wrapper:not(:hover) {
    filter: blur(0.75px);
    opacity: 0.5;
    transform: scale(0.9);
    box-shadow: none;
    transition: 0.2s all;
    border: transparent !important;
}