User:LV-CRzhan-hun/common.css


 * root {

--theme-body-dynamic-color-1: #fff; --theme-body-dynamic-color-1--rgb: 255,255,255; --theme-body-dynamic-color-2: #e6e6e6; --theme-body-dynamic-color-2--rgb: 230,230,230;

--theme-page-dynamic-color-1: #fff; --theme-page-dynamic-color-1--rgb: 255,255,255; --theme-page-dynamic-color-1--inverted: #8B0000; --theme-page-dynamic-color-1--inverted--rgb: 30,12,27; --theme-page-dynamic-color-2: #e6e6e6; --theme-page-dynamic-color-2--rgb: 230,230,230;

--theme-sticky-nav-dynamic-color-1: #fff; --theme-sticky-nav-dynamic-color-1--rgb: 255,255,255; --theme-sticky-nav-dynamic-color-2: #e6e6e6; --theme-sticky-nav-dynamic-color-2--rgb: 230,230,230;

--theme-link-dynamic-color-1: #8B0000; --theme-link-dynamic-color-1--rgb: 30,12,27; --theme-link-dynamic-color-2: #3a3a3a; --theme-link-dynamic-color-2--rgb: 58,58,58;

--theme-accent-dynamic-color-1: #fff; --theme-accent-dynamic-color-1--rgb: 255,255,255; --theme-accent-dynamic-color-2: #e6e6e6; --theme-accent-dynamic-color-2--rgb: 230,230,230;

--theme-body-background-color: #202225; --theme-body-background-color--rgb: 32,34,37;

--theme-body-text-color: #eee; --theme-body-text-color--hover: #cccccc;

--theme-sticky-nav-background-color: #cc0000; /* --discord-background-secondary */ --theme-sticky-nav-text-color: #eee; /* --discord-text */ --theme-sticky-nav-text-color--hover: #b9bbbe;

--theme-page-background-color: #8B0000; /* --discord-background-primary */ --theme-page-background-color--rgb: 54,57,63; --theme-page-background-color--secondary: #cc0000; /* --discord-background-secondary */

--theme-page-text-color: #eee; /* --discord-text */ --theme-page-text-color--rgb: 238,238,238; --theme-page-text-color--hover: #b3b3b3; --theme-page-text-mix-color: #8e9093; --theme-page-text-mix-color-95: #3f4247; --theme-page-accent-mix-color: #474f99;

--theme-link-color: #00AFF4; /* --discord-link */ --theme-link-color--rgb: 0,175,244; --theme-link-color--hover: #009ad8; --theme-link-label-color: #8B0000;

--theme-accent-color: #fe4c40; /* --discord-accent */ --theme-accent-color--rgb: 88,101,242; --theme-accent-color--hover: #4752C4; /* --discord-accent-dark */ --theme-accent-label-color: #eee;

--theme-border-color: #23262A; --theme-border-color--rgb: 35,38,42;

--theme-alert-color: #ff2400; --theme-alert-color--rgb: 237, 66, 69; --theme-alert-color--hover: #C03537; --theme-alert-label: #fff;

--theme-warning-color: #faa81a; --theme-warning-label: #fff;

--theme-success-color: #4fdc7c; --theme-success-color--rgb: 79, 220, 124; --theme-success-label: #fff;

--theme-message-color: #FFC0CB; --theme-message-label: #fff;

--theme-community-header-color: #eee; --theme-community-header-color--hover: #b3b3b3; }

.theme-fandomdesktop-light { --theme-page-dynamic-color-1: #8B0000; --theme-page-dynamic-color-1--rgb: 30,12,27; --theme-page-dynamic-color-1--inverted: #fff; --theme-page-dynamic-color-1--inverted--rgb: 255,255,255; --theme-page-dynamic-color-2: #3a3a3a; --theme-page-dynamic-color-2--rgb: 58,58,58;

--theme-link-dynamic-color-1: #fff; --theme-link-dynamic-color-1--rgb: 255,255,255; --theme-link-dynamic-color-2: #e6e6e6; --theme-link-dynamic-color-2--rgb: 230,230,230;

--theme-page-background-color: #fff; --theme-page-background-color--rgb: 255,255,255; --theme-page-background-color--secondary: #f2f3f5;

--theme-page-text-color: #2e3338; --theme-page-text-color--rgb: 46,51,56; --theme-page-text-color--hover: #212529; --theme-page-text-mix-color: #9d9d9d; --theme-page-text-mix-color-95: #f5f5f5; --theme-page-accent-mix-color: #acb2f9;

--theme-link-color: #8B0000; --theme-link-color--rgb: 0,104,224; --theme-link-color--hover: #00397a; --theme-link-label-color: #fff;

--theme-border-color: #CECFD1; --theme-border-color--rgb: 206,207,209;

--theme-alert-color: #ff2400; --theme-alert-color--rgb: 237, 66, 69; --theme-alert-color--hover: #C03537; --theme-alert-label: #fff;

--theme-warning-color: #faa81a; --theme-warning-label: #fff;

--theme-success-color: #3ba55d; --theme-success-color--rgb: 59, 165, 93; --theme-success-label: #fff;

--theme-message-color: #fe4c40; --theme-message-label: #fff; }

/* Banner notifications */ .wds-banner-notification { --wds-banner-notification-background-color: var(--theme-page-background-color--secondary); --wds-banner-notification-text-color: var(--theme-page-text-color); --wds-banner-notification-link-color: var(--theme-link-color); --wds-banner-notification-link-color--hover: var(--theme-link-color--hover); --wds-banner-notification-border-color: var(--theme-border-color); --wds-banner-notification-close-icon: var(--theme-page-text-mix-color); }

.wds-alert .wds-banner-notification__icon { background-color: var(--theme-alert-color) } .wds-warning .wds-banner-notification__icon { background-color: var(--theme-warning-color) } .wds-success .wds-banner-notification__icon { background-color: var(--theme-success-color) } .wds-message .wds-banner-notification__icon { background-color: var(--theme-message-color) }

/* Custom wordmarks */ .wiki-wikia .fandom-community-header__image img, .wiki-wikia .fandom-sticky-header__logo img { content: url('https://static.wikia.nocookie.net/caburum/images/5/5f/Blurple-central.svg'); }

.wiki-dev .fandom-community-header__image img, .wiki-dev .fandom-sticky-header__logo img { content: url('https://static.wikia.nocookie.net/caburum/images/d/d6/Blurple-dev.png'); }

.wiki-vstf .fandom-community-header__image img, .wiki-vstf .fandom-sticky-header__logo img { content: url('https://static.wikia.nocookie.net/caburum/images/1/10/Blurple-soap.svg'); }

.wiki-infobox .fandom-community-header__image img, .wiki-infobox .fandom-sticky-header__logo img { content: url('https://static.wikia.nocookie.net/caburum/images/5/54/Blurple-portability.svg'); }

/* "Official wiki badge" */
 * 1) wds-brand-fandom-official-wiki path[fill="#280033"] { fill: #cc0000; }
 * 2) wds-brand-fandom-official-wiki path[fill="#fa005a"] { fill: #fe4c40; }
 * 3) wds-brand-fandom-official-wiki path[fill="#fff"] { fill: #eee; }

.featured-video, .featured-video-player-container, .sponsored-content, .sponsored-content img, .sponsored-content__title, .marketing-notifications, .gpt-ad, .top-ads-container, .top-ads-container, .bottom-ads-container, display: none } /*** * @title			DiscordTheme * @description		Styles Fandom to resemble Discord's design. * @docs			DiscordTheme * @version			v2.1 * @author			Caburum * @skin			FandomDesktop * @installation	@import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:DiscordTheme.css"); ***/
 * 1) rail-boxad-wrapper,
 * 2) incontent-boxad,
 * 3) incontent-boxad-2,
 * 1) hivi_leaderboard,
 * 2) top_leaderboard,
 * 3) bottom_leaderboard,
 * 4) top_boxad,
 * 5) bottom-ads-container,
 * 6) top-ads-container,
 * 1) bottom_boxad,
 * 2) SurveyModule {


 * root {

--discord-accent: #FF1493; --discord-accent-secondary: #FFC0CB; --discord-accent-dark: #4752c4; --discord-link: #00b0f4; --discord-ping: #ed4245; --discord-success: #3ba55d; --discord-text: #eee; --discord-text-muted: #72767d; --discord-background-primary: #FF69B4; --discord-background-secondary: #FFC0CB; --discord-background-tertiary: #C71585; --discord-background-accent: #4f545c; --discord-background-accent-hover: #5a6069; --discord-background-mentioned: #49443C; --discord-border: #23262A; }

/* Overwrite the color of Fandom's logo colors to Discord colors */ fill: var(--discord-accent); }
 * 1) wds-brand-fandom-logo-light > path:nth-of-type(1),
 * 2) wds-brand-fandom-logomark > path:nth-of-type(1) {

fill: var(--discord-accent-secondary); }
 * 1) wds-brand-fandom-logo-light > path:nth-of-type(2),
 * 2) wds-brand-fandom-logomark > path:nth-of-type(2) {

fill: var(--discord-text); }
 * 1) wds-brand-fandom-logo-light > path:nth-of-type(3) {

filter: invert(47%) sepia(71%) saturate(5171%) hue-rotate(223deg) brightness(100%) contrast(99%); /* https://codepen.io/sosuke/pen/Pjoqqp */ }	opacity: 0.3; }	opacity: 0; }
 * 1) wds-brand-fandom-logo-store {
 * 1) wds-brand-fandom-logo-store [fill="url(#SVGID_1_)"] {
 * 1) wds-brand-fandom-logo-store [fill="url(#SVGID_3_)"] {

/*** Global navigation ***/ .global-navigation { --fandom-global-nav-background-color: var(--discord-background-secondary); --fandom-global-nav-link-color: var(--discord-text); --fandom-global-nav-link-color--hover: var(--discord-accent); --fandom-global-nav-icon-color: var(--discord-text); --fandom-global-nav-icon-background-color: var(--discord-background-accent); --fandom-global-nav-icon-background-color--hover: var(--discord-accent); --fandom-global-nav-icon-background-color--active: var(--fandom-global-nav-icon-background-color--hover); --fandom-global-nav-icon-border-color: var(--discord-text); --fandom-global-nav-icon-border-color--hover: var(--fandom-global-nav-icon-background-color--hover); --fandom-global-nav-icon-border-color--active: var(--fandom-global-nav-icon-border-color--hover); --fandom-global-nav-bottom-icon-color: var(--fandom-global-nav-icon-color); --fandom-global-nav-counter-background-color: var(--discord-ping); --fandom-global-nav-counter-label-color: var(--discord-text); }

/* Make "Start a Wiki" look like Discord's "Add a Server" */ .global-navigation__link[data-tracking-label="start-a-wiki"] .global-navigation__icon { color: var(--discord-success); background-color: var(--discord-background-accent); border: none; }

.global-navigation__link[data-tracking-label="start-a-wiki"] .global-navigation__icon:hover, .global-navigation__link[data-tracking-label="start-a-wiki"]:hover .global-navigation__icon { color: var(--discord-text); background-color: var(--discord-success); }

/* Change border radius on hover, based on Discord server list */ .global-navigation__links .global-navigation__icon { transition: border-color 250ms ease, color 250ms ease, background-color 250ms ease, border-radius 250ms ease; }

.global-navigation__links .global-navigation__icon:hover, .global-navigation__link:hover .global-navigation__icon, .global-navigation__links .wds-dropdown:hover .global-navigation__icon { border-radius: 33%; }

/*** Dropdowns ***/ .global-navigation .wds-dropdown:not(.notifications .wds-dropdown) { --fandom-dropdown-background-color: var(--discord-background-tertiary); --fandom-border-color: var(--fandom-dropdown-background-color); --fandom-text-color: var(--discord-text); --fandom-link-color: var(--discord-text); --fandom-link-color--fadeout: var(--discord-accent-dark); }

/*** Notifications ***/ .global-navigation .notifications { --fandom-border-color: var(--discord-background-primary); --fandom-text-color: var(--discord-text); --fandom-link-color: var(--discord-accent-secondary); --fandom-link-color--hover: var(--discord-accent-secondary); --fandom-accent-color: var(--discord-accent); --fandom-accent-color--hover: var(--discord-accent-secondary); --fandom-accent-label-color: var(--discord-text); --fandom-notifications-background-color: var(--discord-background-primary); --fandom-dropdown-background-color: var(--discord-background-tertiary); --fandom-notifications-read-card-background-color: var(--discord-background-secondary); --fandom-notifications-unread-card-background-color: var(--discord-background-primary); --fandom-notifications-footer-text-color: var(--discord-text); }

/* Tabs */ .global-navigation .notifications .wds-tabber .wds-tabs__tab:not(.wds-is-current) { color: var(--discord-text-muted); }

.global-navigation .notifications .wds-tabs__tab-label > span { background-color: var(--fandom-global-nav-counter-background-color); color: var(--fandom-global-nav-counter-label-color); }

/* Cards */ .global-navigation .notifications [class*="NotificationCard-module_card__"] { --fandom-border-color: var(--discord-background-accent); }

.global-navigation .notifications [class*="NotificationCard-module_card__"] [class^="NotificationCard-module_unreadStatusDot__"] { --fandom-link-color: var(--discord-ping); }

/*** Search ***/ .search-modal { --fandom-text-color: var(--discord-text); --fandom-dropdown-background-color: var(--discord-background-primary); --fandom-border-color: var(--fandom-dropdown-background-color); --fandom-accent-color: var(--discord-accent); --fandom-accent-color--hover: var(--discord-accent-dark); --fandom-accent-label-color: var(--discord-text); --fandom-link-color: var(--discord-link); --fandom-link-color--fadeout: var(--discord-background-accent); }

/*** Global footer ***/ .global-footer, .global-footer__section-header { background-color: var(--discord-background-secondary); color: var(--discord-text); }

.global-footer__link, .global-footer__link:active, .global-footer__link:focus, .global-footer__link:visited, .global-footer__bottom a, .global-footer__bottom a:visited { color: var(--discord-accent-secondary); }

.global-footer__link:hover, .global-footer__bottom a:hover, .global-footer__section-social-links .global-footer__link-icon:hover { color: var(--discord-accent-dark); }

.global-footer__section-social-links .global-footer__link-icon{ color: inherit; }

.global-footer__bottom { background-color: inherit; }

/*** QuickBar ***/ --theme-accent-color: var(--discord-background-primary); --theme-accent-label-color: var(--discord-text); }
 * 1) WikiaBar {

border-color: var(--discord-text-muted); }
 * 1) WikiaBar .tools > li {

--wds-dropdown-background-color: var(--discord-background-tertiary); --wds-dropdown-border-color: var(--wds-dropdown-background-color); --wds-dropdown-text-color: var(--discord-text); --wds-dropdown-linked-item-color: var(--wds-dropdown-text-color); --wds-dropdown-linked-item-background-color: var(--discord-accent-dark); }
 * 1) WikiaBar .wds-dropdown__content {

border-top-color: var(--discord-background-tertiary) }
 * 1) WikiaBar .wds-dropdown:before, #WikiaBar .wds-dropdown:after {

/*** Scrollbar ***/
 * -webkit-scrollbar-track {

background-color: var(--discord-background-primary); }


 * -webkit-scrollbar-thumb {

background-color: var(--discord-background-tertiary); border-radius: 10px; }


 * -webkit-scrollbar {

width: 10px; height: 10px; }


 * -webkit-scrollbar-corner {

background-color: var(--discord-background-primary); }

.button1 { position: relative; background-color: #b11116; border: none; font-size: 28px; color: #FFFFFF; padding: 20px; width: 100%; text-align: center; transition-duration: 0.4s; text-decoration: none; overflow: hidden; cursor: pointer; border-radius: 5px; } .button1:hover { box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19); } .button1:after { content: ""; background: #b11116; display: block; position: absolute; padding-top: 300%; padding-left: 350%; margin-left: -20px !important; margin-top: -120%; opacity: 0; transition: all 0.8s }

.button1:active:after { padding: 0; margin: 0; opacity: 1; transition: 0s } .fandom-community-header{ background: #b11116; border: 5px outset #b11116; border-radius: 15px; box-shadow: 0 -3em 3em rgba(0,0,0,0.1), 0.3em 0.3em 1em rgba(0,0,0,0.3); height:auto; width:auto; opacity:0.8; z-index:114514; }

.main-container, .resizable-container { --theme-page-background-color:rgba(237,111,0,0.5) !important; --theme-body-background-color:rgba(237,111,0,0.5) !important; --theme-page-background-color--secondary:rgba(237,111,0,0.5) !important; text-align:ZCOOL XiaoWei; /**/

.snowflake {

color: #ffffff; font-size: 1em; font-family: Arial, sans-serif; text-shadow: 0 0 5px #fb6600; }

@-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes snowflakes-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}}@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@keyframes snowflakes-shake{0%,100%{transform:translateX(0)}50%{transform:translateX(80px)}}.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}.snowflake:nth-of-type(10){left:25%;-webkit-animation-delay:2s,0s;animation-delay:2s,0s}.snowflake:nth-of-type(11){left:65%;-webkit-animation-delay:4s,2.5s;animation-delay:4s,2.5s} .snowflake:nth-of-type(12){left:60%;-webkit-animation-delay:4s,2.5s;animation-delay:3s,2.5s} .snowflake:nth-of-type(13){left:10%;-webkit-animation-delay:3s,2.5s;animation-delay:3s,2.5s} .snowflake:nth-of-type(14){left:20%;-webkit-animation-delay:7s,2.5s;animation-delay:7s,2.5s}

.logoblock{

padding: 20px 20px 20px 25px; /* adds space - up right down left */ font-size: 2rem; font-family: 'Share Tech Mono'; background: url(https://s1.ax1x.com/2022/12/14/zId4Gd.png) center/40% no-repeat; background-color: rgb(var(--pale-gray-monochrome)); background-position: right 50% bottom 25px; border: 10px solid rgb(var(--mid-accent-red)); border-radius: 35px; color: rgb(var(--black-monochrome)); margin: 10px auto 0; padding-bottom: 65px; position: relative; display: table; }

.logoblock::after{

content: "1"; display: flex !important; justify-content: center !important; font-family: 'Kelly Slab', 'Liu ti'; font-weight: bold; font-size: 90%; color: #ffffff; background-color: rgb(var(--pale-gray-monochrome)); position: relative; transform: translateY(325%); }

.logoblock h2{

color: #87CEEB; }

/* * @desc Improving the userpages' design to adapt to any theme and making it esthetically appealing * @author GreenWithin * @version 1.0.4.2 * @changes Text color is ugly, links are cool /** Importing font **/ @font-face { font-family: 'FANDOM-Icons'; src: url('https://vignette.wikia.nocookie.net/dev/images/b/b4/FANDOM-Icons.woff2/revision/latest') format('woff2'), url('https://vignette.wikia.nocookie.net/dev/images/e/ee/FANDOM-Icons.woff/revision/latest') format('woff'); font-weight: normal; font-style: normal; }

/** Tags **/ background: rgba(var(--theme-link-color--rgb), 0.20); border: 1px solid var(--theme-link-color); }
 * 1) userProfileApp .user-identity-header__tag {

/** Buttons **/ background-color: rgba(var(--theme-link-color--rgb), 0.20); border: 1px solid var(--theme-link-color); color: var(--theme-link-color); }
 * 1) userProfileApp .user-identity-header__actions .wds-button {

/** Avatar **/ border: 2px solid var(--theme-link-color) !important; padding: 5px; }
 * 1) userProfileApp .user-identity-avatar img {

/** Navigational links **/ border-radius: 3px; margin-right: 5px; padding: 8px !important; margin: 5px 5px 5px 0px; text-align: center; font-weight: bold !important; text-transform: unset !important; border: 1px solid var(--theme-link-color) !important; background: rgba(var(--theme-link-color--rgb), 0.20); }
 * 1) userProfileApp .user-profile-navigation__link {

color: var(--theme-link-color) !important; }
 * 1) userProfileApp .user-profile-navigation__link a {

border-bottom-color: var(--theme-link-color); }
 * 1) userProfileApp .user-profile-navigation {

/** Header (nickname display)**/ background-image: linear-gradient(to top, rgba(var(--theme-link-color--rgb), 0.3) 40%, transparent 40%, transparent 100%); line-height: normal; color: var(--theme-link-color); }
 * 1) userProfileApp .user-identity-header :is(h1) {

/** Profile editor **/ /*** "Save" button ***/ .modal-wrapper__header .modal-wrapper__cta-button { background-color: rgba(var(--theme-link-color--rgb), 0.15); border: 1px solid var(--theme-link-color); color: var(--theme-link-color); }

/*** Modal ***/ background: none; }
 * 1) userProfileApp .modal-wrapper {

/** Icons for navigational links **/ opacity: 1; transition: .2s; }
 * 1) userProfileApp .user-profile-navigation__link:not(.is-active):hover {

font-family: Fandom-Icons; color: var(--theme-link-color); }
 * 1) userProfileApp .user-profile-navigation__link:before {

content: 'avatar '; }
 * 1) userProfileApp .user-profile-navigation__link:nth-child(1):before {

content: 'comment '; }
 * 1) userProfileApp .user-profile-navigation__link:nth-child(2):before {

content: 'book '; }
 * 1) userProfileApp .user-profile-navigation__link:nth-child(3):before {

content: 'pencil '; }
 * 1) userProfileApp .user-profile-navigation__link:nth-child(4):before {

content: 'grid '; } /* */
 * 1) userProfileApp .user-profile-navigation__link:nth-child(5):before {