Custom Cherry Blossom Theme for ShellShock.io
// ==UserScript==
// @name Theme - Cherry Blossom
// @namespace Custom Theme
// @version 1.1
// @description Custom Cherry Blossom Theme for ShellShock.io
// @author slimy0686
// @license MIT
// @match https://shellshock.io/*
// @match https://dev.shellshock.io/*
// @grant none
// @icon https://raw.githubusercontent.com/darkstalkerl/Shell-Shocker-Themes/main/cherry_blossom_icon.webp
// ==/UserScript==
(function () {
'use strict';
// URL of the custom background image
const backgroundImageURL = 'https://raw.githubusercontent.com/darkstalkerl/Shell-Shocker-Themes/main/cherry_blossom_wallpaper2.webp';
const addScript = () => {
console.log("Applying Cherry Blossom theme...");
document.title = "Cherry Blossom Theme";
// Inject the custom styles
document.head.innerHTML += `<style>
/* General Background */
#ss_background {
background: url('${backgroundImageURL}') no-repeat center center fixed !important;
background-size: cover !important;
}
/* Custom Colors and Variables */
* {
--ss-lightoverlay: url('${backgroundImageURL}');
--ss-popupbackground: url('${backgroundImageURL}');
--ss-red: #d15354;
--ss-pink: #EC008C;
--ss-blue1: #f8a3b1;
--ss-blue2: #f68da2;
--ss-green1: #13BA65;
--ss-orange1: #F79520;
}
/* In-game Crosshair */
.crosshair {
position: absolute;
transform-origin: 50% top;
top: 50%;
border: solid 0.05em black;
height: 0.8em;
margin-bottom: 0.12em;
opacity: 100;
}
.crosshair.normal {
background: #f06cbb !important;
border-color: #c95199 !important;
height: 7px;
width: 7px;
opacity: 0.8;
}
.crosshair.powerful {
left: calc(50% - 0.25em);
background: #ff0000;
width: 0.5em;
}
#reticleDot {
position: absolute;
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
background: #ffffff;
border: solid 0.01em #ffffff;
width: 0.1em;
height: 0.1em;
opacity: 0.7;
}
/* Chat and Pause Menu Adjustments */
.is-paused .pause-ui-element {
background-color: #00000000 !important;
border: var(--ss-common-border-width) solid var(--ss-blue5);
bottom: 0;
width: var(--ss-chat-wrapper-width);
height: var(--ss--chat-height);
left: 0;
}
/* Grenade Throw Indicator */
#grenadeThrowContainer {
position: absolute;
display: flex;
visibility: hidden;
align-items: flex-end;
top: 50%;
left: 50%;
transform: translate(-6em, -3em);
width: 1em;
height: 6em;
background: #9da7bd !important;
border-radius: 0.3em;
padding: 0.25em;
}
#grenadeThrow {
width: 100%;
height: 50%;
border-radius: 0.05em;
background: linear-gradient(0deg, rgba(255, 249, 253, 1), rgba(255, 232, 245, 1), rgba(255, 208, 233, 1), rgba(253, 188, 223, 1), rgba(253, 188, 212, 1), rgba(255, 140, 201, 1), rgba(255, 112, 188, 1), rgba(252, 87, 175, 1)) !important;
}
</style>`;
};
// Apply styles when DOM is ready
document.body ? addScript() : document.addEventListener("DOMContentLoaded", addScript);
})();