Theme for Soundgasm
// ==UserScript==
// @name Soundgasm Change Theme
// @namespace AnimeRaupe
// @version 2.3
// @description Theme for Soundgasm
// @author AnimeRaupe
// @match ://*.soundgasm.net/*
// @grant none
// @license MIT
// @run-at document-end
// ==/UserScript==
(function () {
const style = document.createElement('style');
style.textContent = `
/* ================= GLOBAL BACKGROUND ================= */
body,
.jp-audio,
.jp-details {
background: #18141f !important;
}
/* ================= PLAYER CONTAINER ================= */
.jp-audio {
width: 100%;
max-width: 100%;
box-sizing: border-box;
}
/* ================= PLAYER LEFT ================= */
.jp-gui.jp-interface{
display: flex;
flex-direction: column;
gap: 10px;
padding: 50px 0px;
box-sizing: border-box;
height: 200px;
background: #18141f;
border: 2px solid #7c4dff;
border-radius: 4px;
}
.jp-description {
display: flex;
flex-direction: column;
gap: 10px;
padding: 0px 20px;
box-sizing: border-box;
background: #18141f;
border: 2px solid #7c4dff;
border-radius: 4px;
}
.sound-details {
border: solid 1px #7c4dff;
padding: 10px;
border-radius: 10px;
margin: 5px 0;
}
/* ================= PROGRESS BAR ================= */
.jp-progress {
height: 10px;
background: #18141f;
padding-left: 0px;
}
.jp-seek-bar {
height: 10px;
border-radius: 10px;
background: #2a2438;
padding-left: 0px;
}
.jp-play-bar {
border-radius: 10px;
background: #9a7cff;
padding-left: 0px;
}
/* ================= CONTROLS ================= */
.jp-controls {
display: flex;
gap: 14px;
background: #18141f;
}
.jp-controls button {
filter: brightness(1.15);
}
.jp-volume-bar {
top: 55px;
}
.jp-repeat {
top: 25px;
}
.jp-volume-controls button {
top: 50px;
}
/* ================= TEXT & LINKS ================= */
body, body * {
color: #bd54ff !important;
}
a, a * {
color: #cf82ff !important;
}
a:hover {
color: #eac9ff !important;
}
/* ================= HEADER LAYOUT ================= */
header {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
padding: 0 20px !important;
}
header .logo {
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
}
header nav {
display: flex !important;
gap: 16px !important;
margin: 0 !important;
}
`;
document.head.appendChild(style);
})();