User:Gabonnie/steinsgate.css
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;
}