Suroi.io legacy css

suroi-surviv.css

/* Suroi CSS mod */
/* Contact <@1063520096028479611> on Discord for feedback */
/* Use Stylus browser extension to apply styles */

/* Font Change*/

@import url(https://fonts.bunny.net/css?family=roboto-condensed:300,400,700);

*:not(i) {
	font-family: 'Roboto Condensed';
}

/* Home screen */

#splash-ui {
	background-image: url("https://images.unsplash.com/photo-1505506874110-6a7a69069a08?w=2070");
}

#btn-rules {
	display: none;
}

/* Change counter and move killfeed */

.ui-leaderboard {
	flex-direction: row-reverse;
	display: flex;
	gap: 10px;
	right: 10px;
}

.counter {
	max-height: 100px;
	min-height: 100px;
	min-width: 100px;
	max-width: 100px;
}

.counter::after {
	content: "Alive";
	position: absolute;
	top: 70px;
	right: 33.5px;
	font-size: 16px;
	font-weight: 800;
}

.counter-text {
	position: absolute;
	top: 10px;
}

.counter img {
	display: none;
}

/* Moved consumables and ammo buttons */

#items-container {
	right: 10px;
	left: auto;
	top: 120px;
	width: 100px;
	gap: 10px;
}

.inventory-container {
	flex-direction: column;
}

#equipment-container {
	flex-direction: row !important;
}

#ammo-container {
	padding-top: 15px;
	/* display: grid; */
	grid-template-columns: repeat(2, minmax(0, 1fr));
	display: flex;
}

#ammo-container .ammo-slot {
	width: 45px !important;
	height: 70px !important;
	margin-left: auto;
	flex-direction: column-reverse;
}

#ammo-container .item-image {
	width: 25px;
	position: absolute;
	top: 1px;
}

#ammo-container .item-count {
	position: absolute;
	bottom: 5px;
}

#healing-items-container .item-slot {
	min-width: 100px;
	max-width: 100px;
}

/* Weapons UI change */
#weapons-container .inventory-slot {
	width: 250px;
	height: 70px;
	background: none;
	text-shadow: 2px 2px 4px rgba(0,0,0,.6);
}

#weapons-container .has-item {
	background: #00000000 !important;
	opacity: 0.7 !important;
}

#weapons-container .active {
	background: #00000050 !important;
	opacity: 1 !important;
	outline: none;
}

#weapons-container .item-image {
	width: 65px;
	height: 65px;
	position: absolute;
	left: 15px;
}

#weapons-container .item-name {
	position: absolute;
	right: 15px;
	bottom: 5px;
	font-size: 20px;
	font-weight: 700;
}

#weapons-container .item-ammo {
	left: 75px;
	top: auto;
	bottom: 5px;
}

#weapons-container .slot-number {
	position: absolute;
	right: 15px;
	left: auto;
	top: 5px;
	bottom: auto;
}

/* Blurred game over */


#game-over-overlay {
	backdrop-filter: blur(3px);
}

/* Sideways health */

#health-bar-container {
	transform: rotate(-90deg);
	bottom: 150px;
	left: -100px;
}

#health-bar-percentage {
	transform: rotate(90deg);
}

#adrenaline-bar-container {
	transform: rotate(-90deg);
	bottom: 165px;
	left: -140px;
}

#adrenaline-bar-percentage {
	transform: rotate(90deg);
}

#weapon-ammo-container {
	bottom: 10px;
	left: 200px;
}