User:Gabonnie/steinsgate.css

From Tower Defense Simulator 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)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
:root {
	--theme-link-color: #EFC300;
	--theme-link-color--hover: #EDD46F;
	--border-radius-lg: 1.5rem;
	--border-radius-md: 0.625rem;
	--border-radius-sm: 0.2rem;
	--spacing-md: 1.25rem;
	--spacing-sm: 0.3rem;
	--border-width: 0.25rem;
	--transition-smooth: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	--yellow-shadow: 0 0 20px rgba(255, 239, 0, 0.3);
	--cool-yellow: #ffef00;
}

user-identity-avatar__image .theme-fandomdesktop-dark :root {
	--theme-link-color: #FFD400;
}

.tag-maintenance,
.tag-wiki_contributor,
.tag-contributor_of_the_week {
	background-repeat: no-repeat !important;
	background-position: center right !important;
	background-size: contain !important;
	color: transparent !important;
	padding-right: 0 !important;
}

.theme-fandomdesktop-light .tag-wiki_contributor,
.theme-fandomdesktop-dark .tag-wiki_contributor {
	background-image: url('https://static.wikia.nocookie.net/tower-defense-sim/images/6/68/0kabe.png/revision/latest?cb=20250629022205&format=original') !important;
	background-color: black !important;
}

.tag-wiki_contributor::before {
	content: "Salieri's Neighbor";
	color: white;
	margin-right: -66px;
}

.tag-maintenance {
	background-image: url('https://static.wikia.nocookie.net/tower-defense-sim/images/7/70/C%26J.png/revision/latest?cb=20250620155551&format=original') !important;
	background-color: #003cce !important;
}

.tag-maintenance::before {
	content: "Velvet Attendant";
	color: white;
	margin-right: -24px;
}

.tag-contributor_of_the_week {
	background-image: url('https://static.wikia.nocookie.net/tower-defense-sim/images/0/0e/Sho.png/revision/latest?cb=20250628204743&format=original') !important;
	background-color: beige !important;
}

.tag-contributor_of_the_week::before {
	content: "Quod Erat Demonstrandum";
	color: black;
	margin-right: -104px;
}

.user-identity-header__tag:hover {
	transform: translateY(-2px);
}

.page-header__action-button:hover {
	background-color: rgba(136, 116, 8, 0.15);
	transition: var(--transition-smooth);
}

#userProfileApp .user-identity-avatar__image {
	border-radius: var(--border-radius-lg);
	outline: var(--border-width) solid white;
	outline-offset: var(--spacing-sm);
	transition: var(--transition-smooth);
	width: min(100%, 12rem);
	height: auto;
	background-color: #ffffff52;
}

#userProfileApp .user-identity-avatar__image:hover {
	transform: rotate(720deg) scale(1.05);
	border-radius: 50%;
	outline: var(--border-width) solid #84E0DD;
	/* probably some legacy code, but i can't be bothered to check it */
}

#userProfileApp .user-identity-social__icon,
#userProfileApp .user-identity-social__icon svg {
	animation: RotateClockwise 22s linear infinite;
	width: 2rem;
	height: 2rem;
	transition: var(--transition-smooth);
	color: white;
}

@keyframes RotateClockwise {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

#userProfileApp .user-identity-box {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--spacing-md);
}

#userProfileApp .user-identity-box {
	background-image: linear-gradient(to left, transparent 30%, rgba(0, 0, 0, 0.3)), url("https://static.wikia.nocookie.net/8a263a2b-3ee5-406e-a401-417c66fd556b"), url("https://static.wikia.nocookie.net/abd-stand-archive/images/a/a0/Ras.png/revision/latest/");
	padding: 0.75rem 1.25rem;
	border-radius: 1.5rem;
	background-position: right center, right center, top left;
	background-repeat: no-repeat, no-repeat, repeat;
	background-size: auto, auto 100%, 350px;
	border: 0.25rem solid var(--cool-yellow);
	transition: var(--transition-smooth);
}

#userProfileApp .user-identity-box:hover {
	border-color: var(--cool-yellow);
	box-shadow: var(--yellow-shadow);
}

#userProfileApp .user-identity-header__attributes>h1 {
	border-radius: var(--border-radius-md);
	padding: var(--spacing-sm);
	color: var(--cool-yellow);
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
	font-size: clamp(1.5rem, 4vw, 2rem);
	transition: var(--transition-smooth);
}

#userProfileApp .user-identity-header__attributes>h1:hover {
	text-shadow: 0 0 10px rgba(255, 239, 0, 0.7);
}

#userProfileApp .user-identity-header__attributes>h2 {
	border-radius: var(--border-radius-sm);
	padding: var(--spacing-sm);
	color: white;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
	font-size: clamp(1rem, 3vw, 1.5rem);
	word-break: break-word;
	transition: var(--transition-smooth);
}

#userProfileApp .user-identity-header__attributes>h2:hover {
	text-shadow: 0 0 8px rgba(255, 255, 255, 0.5);
}

#userProfileApp .user-identity-stats,
#userProfileApp .user-identity-bio {
	border-radius: var(--border-radius-sm);
	padding: var(--spacing-sm);
	color: white;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
	width: fit-content;
	max-width: 100%;
	background: none;
	transition: var(--transition-smooth);
}

#userProfileApp .user-identity-stats:hover,
#userProfileApp .user-identity-bio:hover {
	background: rgba(0, 0, 0, 0.2);
}

#userProfileApp .user-identity-header__tag {
	background-color: rgb(15, 222, 229);
	color: black;
	display: inline-block;
	margin-top: var(--spacing-sm);
	font-size: 0.9em;
	transition: var(--transition-smooth);
	user-select: none;
}

#userProfileApp .user-identity-header__tag:hover {
	transform: translateY(-2px);
	box-shadow: var(--yellow-shadow);
}

body.skin-fandomdesktop #userProfileApp .user-identity-avatar__image {
	outline-color: var(--cool-yellow);
	border-color: black;
}

#userProfileApp ul.user-identity-stats a {
	color: white;
	font-size: 1em;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
	transition: var(--transition-smooth);
}

#userProfileApp ul.user-identity-stats a:hover {
	color: var(--theme-link-color);
}

.page-header__bottom {
	display: none;
}

.user-profile-navigation__link {
	text-transform: uppercase;
	position: relative;
	flex: 1 !important;
	text-align: center;
	white-space: nowrap;
}

.user-profile-navigation__link::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 55%;
	background: linear-gradient(to top, rgba(255, 215, 0, 0.8), rgba(255, 215, 0, 0));
	transform: scaleY(0);
	transform-origin: bottom;
	transition: transform 0.3s ease;
	pointer-events: none;
}

.user-profile-navigation__link.is-active {
	background-color: var(--theme-link-color) !important;
	pointer-events: none;
	border-bottom: 4px solid var(--cool-yellow) !important;
}

.user-profile-navigation__link.is-active a {
	color: white !important;
	font-weight: bold;
}

.user-profile-navigation__link:not(.is-active):hover {
	border-bottom: 4px solid var(--cool-yellow);
}

.user-profile-navigation__link:hover::after {
	transform: scaleY(1);
}
  
.user-profile-navigation__link a:hover {
	text-decoration: none;
	color: var(--fandom-heading-color--hover) !important;
}

#userProfileApp .user-profile-navigation {
	border-top: 1px solid var(--theme-border-color);
	border-bottom: 1px solid var(--theme-border-color)
}

.fandom-community-header__community-name {
	font-family: uni sans heavy;
}

.fandom-community-header__image img, .fandom-sticky-header__logo img {
    display: none !important;
}

.fandom-community-header > .fandom-community-header__image {
    background-image: url('https://static.wikia.nocookie.net/alter-ego/images/f/f0/Tofulogo.png/revision/latest');
    width: 34dvh;
    max-width: 245.1px;
    min-width: 174px;
    height: 14dvh;
    max-height: 138px;
    min-height: 80px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center bottom;
}

.community-navigation > .fandom-sticky-header__logo {
	background-image: url('https://static.wikia.nocookie.net/alter-ego/images/f/f0/Tofulogo.png/revision/latest');
	width: 120px;
	height: 42px;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center bottom;
}