// ==UserScript==
// @name Ice Acer Theme
// @namespace http://tampermonkey.net/
// @version 0.1
// @description Simple SS Theme using CSS Variables
// @author You
// @match https://shellshock.io/*
// @match https://mathdrills.life/*
// @grant none
// ==/UserScript==
(function () {
const addScript = () => {
document.head.innerHTML += `<style>
* {
--ss-transparent: #00000000;
--ss-black: #000;
--ss-white: #0539e6; /*White Text*/
--ss-offwhite: #FFF3E4;
--ss-yellow0:#F7FFC1;
--ss-yellow: #FAF179;
--ss-yolk0: #f1c59a;
--ss-yolk: #f79605; /*Yellow Buttons*/
--ss-yolk2: #d97611;
--ss-red0: #e29092;
--ss-red: #d15354;
--ss-red2: #801919;
--ss-red-bright: #EF3C39;
--ss-pink: #EC008C;
--ss-pink1: #b9006e;
--ss-pink-light: #ff3aaf;
--ss-brown: #924e0c;
--ss-blue00: #abe3f6;
--ss-blue0: #c8edf8;
--ss-blue1: #95E2FE;
--ss-blue2: #5EBBD9;
--ss-blue3: #2fd1fa; /*Lighter Box Borders*/
--ss-blue4: #1e80e8; /*Blue Subtitles, Darker Box Borders*/
--ss-blue5: #0a5771;
--ss-green0: #87ddbb;
--ss-green1: #3ebe8d;
--ss-green2: #2a7256;
--ss-orange1: #F79520;
--ss-vip-gold: linear-gradient(to right, #D1A943, #CFCDAF, #CC8630, #D1AA44, #CC8630);
--ss-clear: rgba(255, 255, 255, 0);
--ss-blue2clear: rgba(94, 186, 217, 0);
--ss-shadow: rgba(0,0,0,0.4);
--ss-blueshadow: #0a577187;
--ss-darkoverlay: rgba(0, 0, 0, 0.8);
--ss-darkoverlay2: rgba(0, 0, 0, 0.2);
--ss-lightoverlay: linear-gradient(#0f16d9, #225fe3, #1db4f5, #1aebeb); /*Main Background*/
--ss-lightbackground: linear-gradient(var(--ss-blue1), var(--ss-blue2));
--ss-blueblend1: linear-gradient(#349ec1, #5fbad8); /*Some Box fill colors*/
--ss-scrollmask1: linear-gradient(var(--ss-blue2clear), var(--ss-blue2));
--ss-scrollmask2: linear-gradient(rgba(56, 158, 192, 0), #389EC0);
--ss-fieldbg: linear-gradient(#91CADB, #ffffff, #ffffff, #ffffff, #ffffff);
--ss-white-60: rgba(255,255,255,.6);
--ss-white-90: rgba(255,255,255,.9);
--ss-me-player-bg: rgba(247,149,32,.8);
--ss-them-blue-bg: rgba(0,66,87,.8);
--ss-them-blue-color: #5ebbd9;
--ss-them-red-bg: rgb(133,0,0,.8);
--ss-them-red-color: #ff4145
--ss-me-red-bg: rgba(255,65,69,.8);
--ss-me-blue-bg: rgb(94,187,217,.8);
}
/* ----------------------------------------------------------------- scope -- */
#maskmiddle {
background: url('https://media.discordapp.net/attachments/705329064256208957/844281233432248390/boolet_scope.png') center center no-repeat;
background-size: contain;
width: 100vh;
height: 100vh;
}
#maskleft, #maskright {
background: black;
flex: 1;
}
/*---------------------------------------------------------crosshair*/
.crosshair {
position: absolute;
transform-origin: 50% top;
top: 50%;
border: solid 0.05em #000dff;
height: 0.8em;
margin-bottom: 0.12em;
opacity: 0.7;
}
.crosshair.normal {
left: calc(50% - 0.15em);
background: #000dff;
width: 0.3em;
}
.crosshair.powerful {
left: calc(50% - 0.25em);
background: red;
width: 0.5em;
}
#dotReticle {
position: absolute;
left: 50%; top: 50%;
transform: translate(-50%, -50%);
background: var(--ss-yolk);
width: 0.7em; height: 0.7em;
border-radius: 100%;
}
#shotReticleContainer {
position: absolute;
text-align: center;
left: 50%; top: 50%;
transform: translate(-50%, -50%);
opacity: 0.7;
overflow-x: hidden;
}
#reticleContainer {
position: fixed;
top: 0; left: 0;
width: 100%; height: 100%;
}
#crosshairContainer {
position: absolute;
left: 50%; top: 50%;
transform: perspective(0px);
}
.shotReticle {
box-sizing: border-box;
position: absolute;
left: 50%;
width: 2.5em;
height: 100%;
transform-origin: center;
background: transparent;
border: solid;
border-left: solid transparent;
border-right: solid transparent;
border-radius: 1.25em 1.25em 1.25em 1.25em;
}
.shotReticle:nth-child(1n) {
transform: translateX(-50%) rotate(0deg);
}
.shotReticle:nth-child(2n) {
transform: translateX(-50%) rotate(90deg);
}
.shotReticle.fill {
}
.shotReticle.border {
}
.shotReticle.fill.normal {
border-color: #000dff;
border-left: solid transparent;
border-right: solid transparent;
border-width: 0.1em;
padding: 0.1em;
}
.shotReticle.fill.powerful {
border-color: red;
border-left: solid transparent;
border-right: solid transparent;
border-width: 0.3em;
padding: 0.1em;
}
.shotReticle.border.normal {
border-color: #000dff;
border-left: solid transparent;
border-right: solid transparent;
border-width: 0.2em;
}
.shotReticle.border.powerful {
border-color: #000dff;
border-left: solid transparent;
border-right: solid transparent;
border-width: 0.4em;
}
</style>`
}
document.body ? addScript() : document.addEventListener("DOMContentLoaded", e => addScript());
})();
