Skip to content

darkcloud [beta] by stashymane

Mirrored from https://github.com/stashymane/darkcloud/releases/latest/download/style.user.css

Screenshot of darkcloud [beta]

Details

Authorstashymane

LicenseApache-2.0

Categorysoundcloud

Created

Updated

Size51 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

dark, clean soundcloud theme.
still work in progress, however mostly usable already.

Notes

Userstyle doesn't have notes.

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name           darkcloud
@namespace      github.com/stashymane/darkcloud
@version        1.0.0-BETA
@description    soundcloud, but good
@author         stashymane
==/UserStyle== */
@-moz-document domain("soundcloud.com") {
  @import url("https://fonts.googleapis.com/css2?family=Inter:wght@500;700;900&display=swap");
  body,
  h1, h2, h3, h4, h5,
  .sc-type-h1, .sc-type-h2, .sc-type-h3, .sc-type-h4, .sc-type-h5,
  .sc-classic .header,
  .sc-font-body, .sc-font-light,
  .sc-tag,
  .sc-button,
  .sc-classic .headerMenu,
  .sc-classic .g-tabs {
    font-family: "Inter", sans-serif !important;
  }
  :root {
    --sidebar-width: 18rem;
    --sidebar-collapsed-width: 4rem;
    --player-height: 4rem;
    --anim: cubic-bezier(0,.3,.2,1);
  }
  @keyframes slide-down {
    0% {
      opacity: 0;
      transform: translateY(0);
    }
    1% {
      opacity: 0;
      transform: translateY(-1rem);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
  :root {
    --bg: #111;
    --bg-transparent: rgba(17, 17, 17, 0.8);
    --container: #292929;
    --container-secondary: #414141;
    --container-transparent: rgba(41, 41, 41, 0.8);
    --container-secondary-transparent: rgba(65, 65, 65, 0.8);
    --on-bg: #e7e7e7;
    --on-container: #eaeaea;
    --on-container-secondary: #ececec;
    --overlay: rgba(136, 136, 136, 0.2);
    --overlay-secondary: rgba(136, 136, 136, 0.3);
    --text: rgba(242, 242, 242, 0.9);
    --text-hover: #f2f2f2;
    --accent: #f50;
  }
  .sc-classic {
    color: var(--text);
  }
  .sc-classic .g-tabs-link, .sc-classic .g-tabs-link:visited, .sc-classic .sc-link-light, .sc-classic .sc-link-light:visited, .sc-classic a.sc-ministats, .sc-classic a.sc-ministats:visited {
    color: var(--text);
  }
  .sc-classic .g-tabs-link:hover, .sc-classic .sc-link-light:hover, .sc-classic a.sc-ministats:hover {
    color: var(--text-hover);
  }
  /* main layout */
  * {
    box-sizing: border-box;
  }
  .sc-classic .l-container.l-content { /* content container */
    margin: 0;
    padding-top: 0;
    width: 100%;
  }
  body.sc-classic {
    background: var(--bg);
  }
  :root {
    --home-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZD0nTTI2MS41NiAxMDEuMjhhOCA4IDAgMDAtMTEuMDYgMEw2Ni40IDI3Ny4xNWE4IDggMCAwMC0yLjQ3IDUuNzlMNjMuOSA0NDhhMzIgMzIgMCAwMDMyIDMySDE5MmExNiAxNiAwIDAwMTYtMTZWMzI4YTggOCAwIDAxOC04aDgwYTggOCAwIDAxOCA4djEzNmExNiAxNiAwIDAwMTYgMTZoOTYuMDZhMzIgMzIgMCAwMDMyLTMyVjI4Mi45NGE4IDggMCAwMC0yLjQ3LTUuNzl6Jy8+PHBhdGggZD0nTTQ5MC45MSAyNDQuMTVsLTc0LjgtNzEuNTZWNjRhMTYgMTYgMCAwMC0xNi0xNmgtNDhhMTYgMTYgMCAwMC0xNiAxNnYzMmwtNTcuOTItNTUuMzhDMjcyLjc3IDM1LjE0IDI2NC43MSAzMiAyNTYgMzJjLTguNjggMC0xNi43MiAzLjE0LTIyLjE0IDguNjNsLTIxMi43IDIwMy41Yy02LjIyIDYtNyAxNS44Ny0xLjM0IDIyLjM3QTE2IDE2IDAgMDA0MyAyNjcuNTZMMjUwLjUgNjkuMjhhOCA4IDAgMDExMS4wNiAwbDIwNy41MiAxOTguMjhhMTYgMTYgMCAwMDIyLjU5LS40NGM2LjE0LTYuMzYgNS42My0xNi44Ni0uNzYtMjIuOTd6Jy8+PC9zdmc+);
    --feed-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZD0nTTE5NC44MiA0OTZhMTguMzYgMTguMzYgMCAwMS0xOC4xLTIxLjUzdi0uMTFMMjA0LjgzIDMyMEg5NmExNiAxNiAwIDAxLTEyLjQ0LTI2LjA2TDMwMi43MyAyM2ExOC40NSAxOC40NSAwIDAxMzIuOCAxMy43MWMwIC4zLS4wOC41OS0uMTMuODlMMzA3LjE5IDE5Mkg0MTZhMTYgMTYgMCAwMTEyLjQ0IDI2LjA2TDIwOS4yNCA0ODlhMTguNDUgMTguNDUgMCAwMS0xNC40MiA3eicvPjwvc3ZnPg==);
    --library-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZD0nTTY0IDQ4MEg0OGEzMiAzMiAwIDAxLTMyLTMyVjExMmEzMiAzMiAwIDAxMzItMzJoMTZhMzIgMzIgMCAwMTMyIDMydjMzNmEzMiAzMiAwIDAxLTMyIDMyek0yNDAgMTc2YTMyIDMyIDAgMDAtMzItMzJoLTY0YTMyIDMyIDAgMDAtMzIgMzJ2MjhhNCA0IDAgMDA0IDRoMTIwYTQgNCAwIDAwNC00ek0xMTIgNDQ4YTMyIDMyIDAgMDAzMiAzMmg2NGEzMiAzMiAwIDAwMzItMzJ2LTMwYTIgMiAwIDAwLTItMkgxMTRhMiAyIDAgMDAtMiAyeicvPjxyZWN0IHg9JzExMicgeT0nMjQwJyB3aWR0aD0nMTI4JyBoZWlnaHQ9JzE0NCcgcng9JzInIHJ5PScyJy8+PHBhdGggZD0nTTMyMCA0ODBoLTMyYTMyIDMyIDAgMDEtMzItMzJWNjRhMzIgMzIgMCAwMTMyLTMyaDMyYTMyIDMyIDAgMDEzMiAzMnYzODRhMzIgMzIgMCAwMS0zMiAzMnpNNDk1Ljg5IDQ0NS40NWwtMzIuMjMtMzQwYy0xLjQ4LTE1LjY1LTE2Ljk0LTI3LTM0LjUzLTI1LjMxbC0zMS44NSAzYy0xNy41OSAxLjY3LTMwLjY1IDE1LjcxLTI5LjE3IDMxLjM2bDMyLjIzIDM0MGMxLjQ4IDE1LjY1IDE2Ljk0IDI3IDM0LjUzIDI1LjMxbDMxLjg1LTNjMTcuNTktMS42NyAzMC42NS0xNS43MSAyOS4xNy0zMS4zNnonLz48L3N2Zz4=);
    --play-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZD0nTTEzMyA0NDBhMzUuMzcgMzUuMzcgMCAwMS0xNy41LTQuNjdjLTEyLTYuOC0xOS40Ni0yMC0xOS40Ni0zNC4zM1YxMTFjMC0xNC4zNyA3LjQ2LTI3LjUzIDE5LjQ2LTM0LjMzYTM1LjEzIDM1LjEzIDAgMDEzNS43Ny40NWwyNDcuODUgMTQ4LjM2YTM2IDM2IDAgMDEwIDYxbC0yNDcuODkgMTQ4LjRBMzUuNSAzNS41IDAgMDExMzMgNDQweicvPjwvc3ZnPg==);
    --pause-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZD0nTTIwOCA0MzJoLTQ4YTE2IDE2IDAgMDEtMTYtMTZWOTZhMTYgMTYgMCAwMTE2LTE2aDQ4YTE2IDE2IDAgMDExNiAxNnYzMjBhMTYgMTYgMCAwMS0xNiAxNnpNMzUyIDQzMmgtNDhhMTYgMTYgMCAwMS0xNi0xNlY5NmExNiAxNiAwIDAxMTYtMTZoNDhhMTYgMTYgMCAwMTE2IDE2djMyMGExNiAxNiAwIDAxLTE2IDE2eicvPjwvc3ZnPg==);
    --forward-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZD0nTTQ4MS4yOSAyMjkuNDdsLTE4OC44Ny0xMTNhMzAuNTQgMzAuNTQgMCAwMC0zMS4wOS0uMzkgMzMuNzQgMzMuNzQgMCAwMC0xNi43NiAyOS40N3Y3OS4wNUw2My44NSAxMTYuNDRhMzAuNTQgMzAuNTQgMCAwMC0zMS4wOS0uMzlBMzMuNzQgMzMuNzQgMCAwMDE2IDE0NS41MnYyMjFBMzMuNzQgMzMuNzQgMCAwMDMyLjc2IDM5NmEzMC41NCAzMC41NCAwIDAwMzEuMDktLjM5TDI0NC41NyAyODcuNHY3OS4wOEEzMy43NCAzMy43NCAwIDAwMjYxLjMzIDM5NmEzMC41NCAzMC41NCAwIDAwMzEuMDktLjM5bDE4OC44Ny0xMTNhMzEuMjcgMzEuMjcgMCAwMDAtNTN6Jy8+PC9zdmc+);
    --backward-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZD0nTTMwLjcxIDIyOS40N2wxODguODctMTEzYTMwLjU0IDMwLjU0IDAgMDEzMS4wOS0uMzkgMzMuNzQgMzMuNzQgMCAwMTE2Ljc2IDI5LjQ3djc5LjA1bDE4MC43Mi0xMDguMTZhMzAuNTQgMzAuNTQgMCAwMTMxLjA5LS4zOUEzMy43NCAzMy43NCAwIDAxNDk2IDE0NS41MnYyMjFBMzMuNzMgMzMuNzMgMCAwMTQ3OS4yNCAzOTZhMzAuNTQgMzAuNTQgMCAwMS0zMS4wOS0uMzlMMjY3LjQzIDI4Ny40djc5LjA4QTMzLjczIDMzLjczIDAgMDEyNTAuNjcgMzk2YTMwLjU0IDMwLjU0IDAgMDEtMzEuMDktLjM5bC0xODguODctMTEzYTMxLjI3IDMxLjI3IDAgMDEwLTUzeicvPjwvc3ZnPg==);
    --skip-forward-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZD0nTTQwMCA2NGExNiAxNiAwIDAwLTE2IDE2djEzNi40M0wxNTEuMjMgNzcuMTFhMzUuMTMgMzUuMTMgMCAwMC0zNS43Ny0uNDRDMTAzLjQ2IDgzLjQ3IDk2IDk2LjYzIDk2IDExMXYyOTBjMCAxNC4zNyA3LjQ2IDI3LjUzIDE5LjQ2IDM0LjMzYTM1LjE0IDM1LjE0IDAgMDAzNS43Ny0uNDVMMzg0IDI5NS41N1Y0MzJhMTYgMTYgMCAwMDMyIDBWODBhMTYgMTYgMCAwMC0xNi0xNnonLz48L3N2Zz4=);
    --skip-backward-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZD0nTTExMiA2NGExNiAxNiAwIDAxMTYgMTZ2MTM2LjQzTDM2MC43NyA3Ny4xMWEzNS4xMyAzNS4xMyAwIDAxMzUuNzctLjQ0YzEyIDYuOCAxOS40NiAyMCAxOS40NiAzNC4zM3YyOTBjMCAxNC4zNy03LjQ2IDI3LjUzLTE5LjQ2IDM0LjMzYTM1LjE0IDM1LjE0IDAgMDEtMzUuNzctLjQ1TDEyOCAyOTUuNTdWNDMyYTE2IDE2IDAgMDEtMzIgMFY4MGExNiAxNiAwIDAxMTYtMTZ6Jy8+PC9zdmc+);
    --repeat-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZmlsbD0nbm9uZScgc3Ryb2tlPSdjdXJyZW50Q29sb3InIHN0cm9rZS1saW5lY2FwPSdyb3VuZCcgc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCcgc3Ryb2tlLXdpZHRoPSczMicgZD0nTTMyMCAxMjBsNDggNDgtNDggNDgnLz48cGF0aCBkPSdNMzUyIDE2OEgxNDRhODAuMjQgODAuMjQgMCAwMC04MCA4MHYxNk0xOTIgMzkybC00OC00OCA0OC00OCcgZmlsbD0nbm9uZScgc3Ryb2tlPSdjdXJyZW50Q29sb3InIHN0cm9rZS1saW5lY2FwPSdyb3VuZCcgc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCcgc3Ryb2tlLXdpZHRoPSczMicvPjxwYXRoIGQ9J00xNjAgMzQ0aDIwOGE4MC4yNCA4MC4yNCAwIDAwODAtODB2LTE2JyBmaWxsPSdub25lJyBzdHJva2U9J2N1cnJlbnRDb2xvcicgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJyBzdHJva2Utd2lkdGg9JzMyJy8+PC9zdmc+);
    --shuffle-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZmlsbD0nbm9uZScgc3Ryb2tlPSdjdXJyZW50Q29sb3InIHN0cm9rZS1saW5lY2FwPSdyb3VuZCcgc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCcgc3Ryb2tlLXdpZHRoPSczMicgZD0nTTQwMCAzMDRsNDggNDgtNDggNDhNNDAwIDExMmw0OCA0OC00OCA0OE02NCAzNTJoODUuMTlhODAgODAgMCAwMDY2LjU2LTM1LjYyTDI1NiAyNTYnLz48cGF0aCBkPSdNNjQgMTYwaDg1LjE5YTgwIDgwIDAgMDE2Ni41NiAzNS42Mmw4MC41IDEyMC43NkE4MCA4MCAwIDAwMzYyLjgxIDM1Mkg0MTZNNDE2IDE2MGgtNTMuMTlhODAgODAgMCAwMC02Ni41NiAzNS42MkwyODggMjA4JyBmaWxsPSdub25lJyBzdHJva2U9J2N1cnJlbnRDb2xvcicgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJyBzdHJva2Utd2lkdGg9JzMyJy8+PC9zdmc+);
    --bell-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZD0nTTQyNy42OCAzNTEuNDNDNDAyIDMyMCAzODMuODcgMzA0IDM4My44NyAyMTcuMzUgMzgzLjg3IDEzOCAzNDMuMzUgMTA5LjczIDMxMCA5NmMtNC40My0xLjgyLTguNi02LTkuOTUtMTAuNTVDMjk0LjIgNjUuNTQgMjc3LjggNDggMjU2IDQ4cy0zOC4yMSAxNy41NS00NCAzNy40N2MtMS4zNSA0LjYtNS41MiA4LjcxLTkuOTUgMTAuNTMtMzMuMzkgMTMuNzUtNzMuODcgNDEuOTItNzMuODcgMTIxLjM1QzEyOC4xMyAzMDQgMTEwIDMyMCA4NC4zMiAzNTEuNDMgNzMuNjggMzY0LjQ1IDgzIDM4NCAxMDEuNjEgMzg0aDMwOC44OGMxOC41MSAwIDI3Ljc3LTE5LjYxIDE3LjE5LTMyLjU3ek0zMjAgMzg0djE2YTY0IDY0IDAgMDEtMTI4IDB2LTE2JyBmaWxsPSdub25lJyBzdHJva2U9J2N1cnJlbnRDb2xvcicgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJyBzdHJva2Utd2lkdGg9JzMyJy8+PC9zdmc+);
    --bell-filled-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGNsYXNzPSdpb25pY29uJyB2aWV3Qm94PScwIDAgNTEyIDUxMic+PHBhdGggZD0nTTQ0MC...

Reviews

No reviews yet.