106 lines
3.0 KiB
SCSS
106 lines
3.0 KiB
SCSS
/*!*
|
|
* This file is part of the SplendidBear Websites' projects.
|
|
*
|
|
* Copyright (c) 2026 @ www.splendidbear.org
|
|
*
|
|
* For the full copyright and license information, please view the LICENSE
|
|
* file that was distributed with this source code.
|
|
*/
|
|
|
|
.game-brand-bar {
|
|
display: flex;
|
|
align-items: center;
|
|
position: fixed;
|
|
top: 20px;
|
|
left: 20px;
|
|
z-index: 20;
|
|
}
|
|
|
|
.back-from-game {
|
|
display: inline-block;
|
|
-ms-transform: scale(1);
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
-webkit-transition: all 250ms cubic-bezier(.17, .67, .83, .67);
|
|
transition: all 250ms cubic-bezier(.17, .67, .83, .67);
|
|
}
|
|
|
|
.back-from-game img {
|
|
width: 100px;
|
|
}
|
|
|
|
.back-from-game:hover {
|
|
-ms-transform: scale(1.2);
|
|
-webkit-transform: scale(1.2);
|
|
transform: scale(1.2);
|
|
-webkit-transition: all 250ms cubic-bezier(.17, .67, .83, .67);
|
|
transition: all 250ms cubic-bezier(.17, .67, .83, .67);
|
|
}
|
|
|
|
.game-cap-badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
position: fixed;
|
|
bottom: 20px;
|
|
left: 50%;
|
|
z-index: 20;
|
|
padding: 5px 10px;
|
|
border: 1px solid rgba(255, 216, 92, 0.42);
|
|
-webkit-border-radius: 999px;
|
|
border-radius: 999px;
|
|
background:
|
|
linear-gradient(115deg, transparent 0 38%, rgba(255, 255, 255, 0.22) 48%, transparent 58% 100%),
|
|
rgba(14, 16, 18, 0.72);
|
|
background-position: 120% 50%, 0 0;
|
|
background-size: 260% 100%, auto;
|
|
-webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.32), 0 8px 22px rgba(0, 0, 0, 0.28);
|
|
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.32), 0 8px 22px rgba(0, 0, 0, 0.28);
|
|
color: #ffe58a;
|
|
font: 700 11px 'Rajdhani', sans-serif;
|
|
letter-spacing: 0.9px;
|
|
line-height: 1;
|
|
text-decoration: none;
|
|
text-transform: uppercase;
|
|
-ms-transform: translateX(-50%);
|
|
-webkit-transform: translateX(-50%);
|
|
transform: translateX(-50%);
|
|
white-space: nowrap;
|
|
-webkit-transition:
|
|
background-position 650ms ease,
|
|
border-color 200ms ease,
|
|
box-shadow 200ms ease,
|
|
color 200ms ease,
|
|
transform 200ms ease;
|
|
transition:
|
|
background-position 650ms ease,
|
|
border-color 200ms ease,
|
|
box-shadow 200ms ease,
|
|
color 200ms ease,
|
|
transform 200ms ease;
|
|
}
|
|
|
|
.game-cap-badge:hover,
|
|
.game-cap-badge:focus-visible {
|
|
background-position: -60% 50%, 0 0;
|
|
border-color: rgba(255, 229, 138, 0.78);
|
|
-webkit-box-shadow: 0 0 0 1px rgba(255, 229, 138, 0.18), 0 0 24px rgba(255, 195, 50, 0.28);
|
|
box-shadow: 0 0 0 1px rgba(255, 229, 138, 0.18), 0 0 24px rgba(255, 195, 50, 0.28);
|
|
color: #fff4bd;
|
|
text-decoration: none;
|
|
-ms-transform: translateX(-50%) translateY(-1px);
|
|
-webkit-transform: translateX(-50%) translateY(-1px);
|
|
transform: translateX(-50%) translateY(-1px);
|
|
}
|
|
|
|
.game-cap-badge:focus,
|
|
.game-cap-badge:active,
|
|
.game-cap-badge:visited {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.game-cap-badge:focus-visible {
|
|
outline: 2px solid rgba(255, 229, 138, 0.75);
|
|
outline-offset: 2px;
|
|
}
|