Share your repls and programming experiences

← Back to all posts
Reflux: Style your Repl.it IDE!
h
frissyn (361)

Intro

Reflux is a Python tool I made to streamline the process of creating CSS injections for the purpose of styling your Repl.it IDE! It allows you to programmatically create a theme, set and change colors, and then build it to a JavaScript Bookmarklet for EZ use in your browser!

Demo

Reflux is designed so that even if you don't know Python, it's pretty easy to get started, just take a look:

import reflux

t = reflux.Theme({
    "name": "New Theme!",
    "author": "frissyn",
    "description": None,
    "default": "light"
})

t.set_color("primary-1", "whitesmoke")

t.build("mytheme.min.js", "w+")

After poking around with some colors and looking up cool color combos and schemes you can create amazing themes like this!


Information

If you want to get started creating themes, please check out the GitHub Repository and star it, where you can find the Documentation and Source Code, and even contribute if you'd like! Reflux works by generating JavaScript bookmarklets, and if you'd like to learn more about how that works, you can read these:

Reflux is also a package on PyPI if you wanna check that out! Thanks for taking a look ;)

Have fun theming! =P

Note:

There were a lot of bugs in the initial release (I didn't test it as well as I thought =/) but I've gone through em and fixed them. Let me know if you have any problems! :)

Comments
hotnewtop
angrydoge (465)

(⌐■o■)
( •o•)>⌐■-■
(•o•)

JBloves27 (1729)

lol, its just, the emojis fit so perfectly XD @dabombdgdzjr

angrydoge (465)

True art @JBYT27

No offense bookie
Whippingdot (573)

wait a sec you used to be called some gibberish? @angrydoge

angrydoge (465)

THE BIGGEST SAD @Whippingdot
Its not gibberish its a gamertag.

frissyn (361)

@ch1ck3n I know right? It feels great to see the colors change!

AndrewAung11 (14)

@frissyn I have opened a pull request in the reflux repo! Here take a look:
https://github.com/frissyn/Reflux/pull/4

Code1Tech (108)

Hey, I made a inspired version of Reflux for any website with plain css.
It's called tStyle.
If you wanna help me in auto inject or saving, feel free to contribute!
Or we could work together on another project like this?

  • Code1Tech
Whippingdot (573)

Wait frissyn this still doesn't work on the post pages. My eyes don't like the mix of white and my aqua theme. Please make it so it works on the post pages too(my eyes are burning out insert 'My Eyes!' meme here)

frissyn (361)

@Whippingdot Repl.it has been updating their CSS designs lately, so I have to update the vars along with it. The IDE vars don't match the site vars, so there's not much I can do for now :/

Whippingdot (573)

How in the world did I miss this... At least I found the tutorial

supcoolak (5)

How do I use this in my own project?

Code1Tech (108)

When I tried injecting, it didn't work for me.
Am I doing smt wrong?

t.build("mytheme.min.js", "w+")
frissyn (361)

@Code1Tech you need to copy the code into a JavaScript bookmarklet on your browser

Code1Tech (108)

I don't know much js so how do I do that.. lol
@IreTheKID

Whippingdot (573)

Check out the tutorial released...you don't need to know js. @Code1Tech

Code1Tech (108)

@Whippingdot k thanks and also i do know js lmao

CoolCoderSJ (509)

Let me say a few things:
1) I think you have a really cool project and I know people kill for different themes but
2) I think the current theme is fine as is..so

Whippingdot (573)

what is wrong with you the current theme is TRASH @CoolCoderSJ

CoolCoderSJ (509)

@Whippingdot hahahahaha that was before eerie made the cool premade themes
Now I love reflux

frissyn (361)

@CoolCoderSJ it's not eerie, T_T

yall are a buncha bullies I swear

CoolCoderSJ (509)

@frissyn fine, sorry frissyn

But reflux is cool now that i learned how to make my own theme

[deleted]

um @IreTheKID is there a way to make my own special theme and edit the synta highlinting/colors?

frissyn (361)

@DevZlx As of right now, you can only change the IDE colors. I'm working on adding a way to change the syntax right now, and it'll be ready soon.

[deleted]

@IreTheKID ok, but how can i make my own special theme?

frissyn (361)

@DevZlx If you mean IDE themes, you can read the Reflux Docs and learn how to create your own themes.

If you mean Syntax Highlights, you can read the post @minx28 made about it (I cant find the link though)

[deleted]

@IreTheKID thin is, Im confused about the docs

Nayoar (564)

@IreTheKID this what you're looking for?

EpicGamer007 (1644)

Is it possible to this with repl talk or something?
Dark theme for repl talk would be really pog

frissyn (361)

@EpicGamer007 It's definitely possible, you'd just need to find what CSS Repl.it uses and change it with JS. I made a Repl.it CSS Index if you wanna look at that and make your own. :)

@mat1 also made a dark theme if you wanna try that out.

Nayoar (564)

@IreTheKID he made a whole set of site-wide themes here

zplusfour (892)

We I need a syntax coloring package!!
Not a background styling!!!

sorry bout that, but good job on it!
frissyn (361)

@ZDev1 That's coming soon! Reflux started as a syntax highlight package actually, but I ran into a lot of problems and it still needs a lot of work. I'll make a post when I finish it.

CodingRedpanda (180)

@IreTheKid
i tried to do it in my repl

but it didn't work.

frissyn (361)

@ridark well you have to install reflux first of course!

Screenshot 2020-12-23 at 12.37.00 PM

CodingRedpanda (180)

@IreTheKID oh forgot all about that thx!

frissyn (361)

@ridark gimme a sec to fix that, sorry T~T

frissyn (361)

@ridark OK just published the v0.1.1 version which has the fix. Reload the REPL and reinstall, please :)

frissyn (361)

@ridark Gimme a minute to fix agghhh

ch1ck3n (1632)

@IreTheKID boo hoo hoo i want pink ide

CodingRedpanda (180)

@IreTheKID i dont think adding a folder worked

frissyn (361)

@ridark agghh, more bugs! it works fine for me though =/

frissyn (361)

@ridark Boom, it should be all good now! I think

CodingRedpanda (180)

@ch1ck3n here is the code for the candyland theme:

javascript:(function() {let p1=document.getElementById("reflux-theme");let p2=document.getElementById("reflux-display");if (p1 && p2) {var go=confirm("There is a Reflux theme already running. Would you like to stop it?");if (go) {p1.remove();p2.remove();alert("This theme has been stopped.");} else {alert("This theme will continue running.");}} else {var go=confirm("Run this Reflux Theme?\n\nName: Candyland\nAuthor: IreTheKID\nDescription: Turn your Repl IDE into a candy wonderland!");if (go) {var style=document.createElement("style");var head=document.getElementsByTagName("head")[0];var target=document.getElementsByClassName("jsx-3593981321")[0];style.setAttribute("id", "reflux-theme");style.appendChild(document.createTextNode(`.replit-ui-theme-root.dark{--color-background-1: #ffc0cb !important;--color-background-2: #ffacbb !important;--color-background-3: #ff99ab !important;--color-control-1: #e0e0e0 !important;--color-control-2: #e9e9e9 !important;--color-control-3: #f3f3f3 !important;--color-border: #32cd32 !important;--color-foreground-1: #006400 !important;--color-foreground-2: #005000 !important;--color-foreground-3: #003d00 !important;--color-foreground-4: #002900 !important;--color-foreground-transparent-1: rgba(255, 255, 255, 0.48) !important;--color-foreground-transparent-2: rgba(255, 255, 255, 0.24) !important;--color-foreground-transparent-3: rgba(255, 255, 255, 0.12) !important;--color-primary-1: #ff1493 !important;--color-primary-2: #ff289c !important;--color-primary-3: #ff3ba5 !important;--color-primary-4: #ff4fae !important;--color-primary-transparent-1: rgba(52, 133, 228, 0.48) !important;--color-primary-transparent-2: rgba(52, 133, 228, 0.24) !important;--color-primary-transparent-3: rgba(52, 133, 228, 0.12) !important;--color-negative-1: #ff491c !important;--color-negative-2: #e9441b !important;--color-negative-3: #d8411b !important;--color-negative-4: #c93d1a !important;--color-negative-transparent-1: rgba(255, 73, 28, 0.48) !important;--color-negative-transparent-2: rgba(255, 73, 28, 0.24) !important;--color-negative-transparent-3: rgba(255, 73, 28, 0.12) !important;--color-warning-1: #eb6404 !important;--color-warning-2: #d65c08 !important;--color-warning-3: #c7560b !important;--color-warning-4: #b8510d !important;--color-warning-transparent-1: rgba(242, 103, 2, 0.48) !important;--color-warning-transparent-2: rgba(242, 103, 2, 0.24) !important;--color-warning-transparent-3: rgba(242, 103, 2, 0.12) !important;--color-positive-1: #ff1493 !important;--color-positive-2: #ff289c !important;--color-positive-3: #ff3ba5 !important;--color-positive-4: #ff4fae !important;--color-positive-transparent-1: rgba(255, 20, 147, 0.48) !important;--color-positive-transparent-2: rgba(255, 20, 147, 0.24) !important;--color-positive-transparent-3: rgba(255, 20, 147, 0.12) !important;}.replit-ui-theme-root.light{--color-background-1: #ffc0cb !important;--color-background-2: #ffacbb !important;--color-background-3: #ff99ab !important;--color-control-1: #e0e0e0 !important;--color-control-2: #e9e9e9 !important;--color-control-3: #f3f3f3 !important;--color-border: #32cd32 !important;--color-foreground-1: #006400 !important;--color-foreground-2: #005000 !important;--color-foreground-3: #003d00 !important;--color-foreground-4: #002900 !important;--color-foreground-transparent-1: rgba(255, 255, 255, 0.48) !important;--color-foreground-transparent-2: rgba(255, 255, 255, 0.24) !important;--color-foreground-transparent-3: rgba(255, 255, 255, 0.12) !important;--color-primary-1: #ff1493 !important;--color-primary-2: #ff289c !important;--color-primary-3: #ff3ba5 !important;--color-primary-4: #ff4fae !important;--color-primary-transparent-1: rgba(52, 133, 228, 0.48) !important;--color-primary-transparent-2: rgba(52, 133, 228, 0.24) !important;--color-primary-transparent-3: rgba(52, 133, 228, 0.12) !important;--color-negative-1: #ff491c !important;--color-negative-2: #e9441b !important;--color-negative-3: #d8411b !important;--color-negative-4: #c93d1a !important;--color-negative-transparent-1: rgba(255, 73, 28, 0.48) !important;--color-negative-transparent-2: rgba(255, 73, 28, 0.24) !important;--color-negative-transparent-3: rgba(255, 73, 28, 0.12) !important;--color-warning-1: #eb6404 !important;--color-warning-2: #d65c08 !important;--color-warning-3: #c7560b !important;--color-warning-4: #b8510d !important;--color-warning-transparent-1: rgba(242, 103, 2, 0.48) !important;--color-warning-transparent-2: rgba(242, 103, 2, 0.24) !important;--color-warning-transparent-3: rgba(242, 103, 2, 0.12) !important;--color-positive-1: #ff1493 !important;--color-positive-2: #ff289c !important;--color-positive-3: #ff3ba5 !important;--color-positive-4: #ff4fae !important;--color-positive-transparent-1: rgba(255, 20, 147, 0.48) !important;--color-positive-transparent-2: rgba(255, 20, 147, 0.24) !important;--color-positive-transparent-3: rgba(255, 20, 147, 0.12) !important;}`));target.insertAdjacentHTML("afterend", `<a id="reflux-display" class="jsx-3593981321" target="_blank" href="//reflux.repl.co/"><span class="jsx-3593981321 sidebar-layout-nav-item-icon"><svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="24" height="24" viewBox="0 0 172 172" style="fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#00d1b2"><path d="M35.83333,21.5c-7.91917,0 -14.33333,6.41417 -14.33333,14.33333v100.33333c0,7.90483 6.4285,14.33333 14.33333,14.33333h100.33333c7.90483,0 14.33333,-6.4285 14.33333,-14.33333v-100.33333c0,-7.91917 -6.41417,-14.33333 -14.33333,-14.33333zM35.83333,35.83333h100.33333v14.33333h-100.33333zM35.83333,64.5h100.33333v71.66667h-100.33333zM71.66667,77.34961l-22.98372,22.98372l22.98372,22.98372l7.16667,-7.16667l-15.81706,-15.81706l15.81706,-15.81706zM100.33333,77.34961l-7.16667,7.16667l15.81706,15.81706l-15.81706,15.81706l7.16667,7.16667l22.98372,-22.98372z"></path></g></g></svg></span><div class="jsx-3593981321">Reflux</div><div class="jsx-3593981321 beta-label"><div style="background-color: #6262ff;" class="jsx-4210545632 beta-tag">ON</div></div></a>`);head.appendChild(style);alert("Reflux is now running!");} else {alert("Reflux operation cancelled.");}}})();

jet black:

javascript:(function() {let p1=document.getElementById("reflux-theme");let p2=document.getElementById("reflux-display");if (p1 && p2) {var go=confirm("There is a Reflux theme already running. Would you like to stop it?");if (go) {p1.remove();p2.remove();alert("This theme has been stopped.");} else {alert("This theme will continue running.");}} else {var go=confirm("Run this Reflux Theme?\n\nName: Jett-Black\nAuthor: IreTheKID\nDescription: Lights out >:)");if (go) {var style=document.createElement("style");var head=document.getElementsByTagName("head")[0];var target=document.getElementsByClassName("jsx-3593981321")[0];style.setAttribute("id", "reflux-theme");style.appendChild(document.createTextNode(`.replit-ui-theme-root.dark{--color-background-1: #1d2333 !important;--color-background-2: #171d2d !important;--color-background-3: #0e1525 !important;--color-control-1: #313646 !important;--color-control-2: #2b3140 !important;--color-control-3: #262b3b !important;--color-border: #313646 !important;--color-foreground-1: #e1e2e4 !important;--color-foreground-2: #90939c !important;--color-foreground-3: #696d78 !important;--color-foreground-4: #4e525f !important;--color-foreground-transparent-1: rgba(14, 21, 37, 0.48) !important;--color-foreground-transparent-2: rgba(14, 21, 37, 0.24) !important;--color-foreground-transparent-3: rgba(14, 21, 37, 0.12) !important;--color-primary-1: #3485e4 !important;--color-primary-2: #337bd2 !important;--color-primary-3: #3273c4 !important;--color-primary-4: #316cb8 !important;--color-primary-transparent-1: rgba(52, 133, 228, 0.48) !important;--color-primary-transparent-2: rgba(52, 133, 228, 0.24) !important;--color-primary-transparent-3: rgba(52, 133, 228, 0.12) !important;--color-negative-1: #ff491c !important;--color-negative-2: #eb451b !important;--color-negative-3: #db411b !important;--color-negative-4: #cd3e1a !important;--color-negative-transparent-1: rgba(255, 73, 28, 0.48) !important;--color-negative-transparent-2: rgba(255, 73, 28, 0.24) !important;--color-negative-transparent-3: rgba(255, 73, 28, 0.12) !important;--color-warning-1: #f26702 !important;--color-warning-2: #de5f07 !important;--color-warning-3: #ce590a !important;--color-warning-4: #c0540c !important;--color-warning-transparent-1: rgba(242, 103, 2, 0.48) !important;--color-warning-transparent-2: rgba(242, 103, 2, 0.24) !important;--color-warning-transparent-3: rgba(242, 103, 2, 0.12) !important;--color-positive-1: #20ab46 !important;--color-positive-2: #219d41 !important;--color-positive-3: #22923d !important;--color-positive-4: #22883a !important;--color-positive-transparent-1: rgba(24, 204, 81, 0.48) !important;--color-positive-transparent-2: rgba(24, 204, 81, 0.24) !important;--color-positive-transparent-3: rgba(24, 204, 81, 0.12) !important;}.replit-ui-theme-root.light{--color-background-1: #1d2333 !important;--color-background-2: #171d2d !important;--color-background-3: #0e1525 !important;--color-control-1: #313646 !important;--color-control-2: #2b3140 !important;--color-control-3: #262b3b !important;--color-border: #313646 !important;--color-foreground-1: #e1e2e4 !important;--color-foreground-2: #90939c !important;--color-foreground-3: #696d78 !important;--color-foreground-4: #4e525f !important;--color-foreground-transparent-1: rgba(14, 21, 37, 0.48) !important;--color-foreground-transparent-2: rgba(14, 21, 37, 0.24) !important;--color-foreground-transparent-3: rgba(14, 21, 37, 0.12) !important;--color-primary-1: #3485e4 !important;--color-primary-2: #337bd2 !important;--color-primary-3: #3273c4 !important;--color-primary-4: #316cb8 !important;--color-primary-transparent-1: rgba(52, 133, 228, 0.48) !important;--color-primary-transparent-2: rgba(52, 133, 228, 0.24) !important;--color-primary-transparent-3: rgba(52, 133, 228, 0.12) !important;--color-negative-1: #ff491c !important;--color-negative-2: #eb451b !important;--color-negative-3: #db411b !important;--color-negative-4: #cd3e1a !important;--color-negative-transparent-1: rgba(255, 73, 28, 0.48) !important;--color-negative-transparent-2: rgba(255, 73, 28, 0.24) !important;--color-negative-transparent-3: rgba(255, 73, 28, 0.12) !important;--color-warning-1: #f26702 !important;--color-warning-2: #de5f07 !important;--color-warning-3: #ce590a !important;--color-warning-4: #c0540c !important;--color-warning-transparent-1: rgba(242, 103, 2, 0.48) !important;--color-warning-transparent-2: rgba(242, 103, 2, 0.24) !important;--color-warning-transparent-3: rgba(242, 103, 2, 0.12) !important;--color-positive-1: #20ab46 !important;--color-positive-2: #219d41 !important;--color-positive-3: #22923d !important;--color-positive-4: #22883a !important;--color-positive-transparent-1: rgba(24, 204, 81, 0.48) !important;--color-positive-transparent-2: rgba(24, 204, 81, 0.24) !important;--color-positive-transparent-3: rgba(24, 204, 81, 0.12) !important;}`));target.insertAdjacentHTML("afterend", `<a id="reflux-display" class="jsx-3593981321" target="_blank" href="//reflux.repl.co/"><span class="jsx-3593981321 sidebar-layout-nav-item-icon"><svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="24" height="24" viewBox="0 0 172 172" style="fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#00d1b2"><path d="M35.83333,21.5c-7.91917,0 -14.33333,6.41417 -14.33333,14.33333v100.33333c0,7.90483 6.4285,14.33333 14.33333,14.33333h100.33333c7.90483,0 14.33333,-6.4285 14.33333,-14.33333v-100.33333c0,-7.91917 -6.41417,-14.33333 -14.33333,-14.33333zM35.83333,35.83333h100.33333v14.33333h-100.33333zM35.83333,64.5h100.33333v71.66667h-100.33333zM71.66667,77.34961l-22.98372,22.98372l22.98372,22.98372l7.16667,-7.16667l-15.81706,-15.81706l15.81706,-15.81706zM100.33333,77.34961l-7.16667,7.16667l15.81706,15.81706l-15.81706,15.81706l7.16667,7.16667l22.98372,-22.98372z"></path></g></g></svg></span><div class="jsx-3593981321">Reflux</div><div class="jsx-3593981321 beta-label"><div style="background-color: #6262ff;" class="jsx-4210545632 beta-tag">ON</div></div></a>`);head.appendChild(style);alert("Reflux is now running!");} else {alert("Reflux operation cancelled.");}}})();

blueberry:

import reflux

t = reflux.Theme({
    "name": "Blueberry",
    "author": "IreTheKID",
    "description": "Make your Repl IDE a blueberry color scheme!",
    "default": "light"
})

t.set_colors({
    "border": "#00008b",

    "background-1": "#6495ed",
    "background-2": "#76a1ef",
    "background-3": "#87adf1",

    "primary-1": "#00008b",
    "primary-2": "#00009f",
    "primary-3": "#0000b2",
    "primary-4": "#0000c6",

    "positive-1": "#000077",
    "positive-2": "#00008b",
    "positive-3": "#00009f",
    "positive-4": "#0000b2",

    "foreground-1": "#590059",
    "foreground-2": "#450045",
    "foreground-3": "#320032",
    "foreground-4": "#1e001e",

    "positive-transparent-1": "rgba(0, 0, 139, 0.48)",
    "positive-transparent-2": "rgba(0, 0, 139, 0.24)",
    "positive-transparent-3": "rgba(0, 0, 139, 0.12)",
})

t.build("themes/blueberry/theme.min.js")
javascript:(function() {let p1=document.getElementById("reflux-theme");let p2=document.getElementById("reflux-display");if (p1 && p2) {var go=confirm("There is a Reflux theme already running. Would you like to stop it?");if (go) {p1.remove();p2.remove();alert("This theme has been stopped.");} else {alert("This theme will continue running.");}} else {var go=confirm("Run this Reflux Theme?\n\nName: Blueberry\nAuthor: IreTheKID\nDescription: Make your Repl IDE a blueberry color scheme!");if (go) {var style=document.createElement("style");var head=document.getElementsByTagName("head")[0];var target=document.getElementsByClassName("jsx-3593981321")[0];style.setAttribute("id", "reflux-theme");style.appendChild(document.createTextNode(`.replit-ui-theme-root.dark{--color-background-1: #6495ed !important;--color-background-2: #76a1ef !important;--color-background-3: #87adf1 !important;--color-control-1: #e0e0e0 !important;--color-control-2: #e9e9e9 !important;--color-control-3: #f3f3f3 !important;--color-border: #00008b !important;--color-foreground-1: #590059 !important;--color-foreground-2: #450045 !important;--color-foreground-3: #320032 !important;--color-foreground-4: #1e001e !important;--color-foreground-transparent-1: rgba(255, 255, 255, 0.48) !important;--color-foreground-transparent-2: rgba(255, 255, 255, 0.24) !important;--color-foreground-transparent-3: rgba(255, 255, 255, 0.12) !important;--color-primary-1: #00008b !important;--color-primary-2: #00009f !important;--color-primary-3: #0000b2 !important;--color-primary-4: #0000c6 !important;--color-primary-transparent-1: rgba(52, 133, 228, 0.48) !important;--color-primary-transparent-2: rgba(52, 133, 228, 0.24) !important;--color-primary-transparent-3: rgba(52, 133, 228, 0.12) !important;--color-negative-1: #ff491c !important;--color-negative-2: #e9441b !important;--color-negative-3: #d8411b !important;--color-negative-4: #c93d1a !important;--color-negative-transparent-1: rgba(255, 73, 28, 0.48) !important;--color-negative-transparent-2: rgba(255, 73, 28, 0.24) !important;--color-negative-transparent-3: rgba(255, 73, 28, 0.12) !important;--color-warning-1: #eb6404 !important;--color-warning-2: #d65c08 !important;--color-warning-3: #c7560b !important;--color-warning-4: #b8510d !important;--color-warning-transparent-1: rgba(242, 103, 2, 0.48) !important;--color-warning-transparent-2: rgba(242, 103, 2, 0.24) !important;--color-warning-transparent-3: rgba(242, 103, 2, 0.12) !important;--color-positive-1: #000077 !important;--color-positive-2: #00008b !important;--color-positive-3: #00009f !important;--color-positive-4: #0000b2 !important;--color-positive-transparent-1: rgba(0, 0, 139, 0.48) !important;--color-positive-transparent-2: rgba(0, 0, 139, 0.24) !important;--color-positive-transparent-3: rgba(0, 0, 139, 0.12) !important;}.replit-ui-theme-root.light{--color-background-1: #6495ed !important;--color-background-2: #76a1ef !important;--color-background-3: #87adf1 !important;--color-control-1: #e0e0e0 !important;--color-control-2: #e9e9e9 !important;--color-control-3: #f3f3f3 !important;--color-border: #00008b !important;--color-foreground-1: #590059 !important;--color-foreground-2: #450045 !important;--color-foreground-3: #320032 !important;--color-foreground-4: #1e001e !important;--color-foreground-transparent-1: rgba(255, 255, 255, 0.48) !important;--color-foreground-transparent-2: rgba(255, 255, 255, 0.24) !important;--color-foreground-transparent-3: rgba(255, 255, 255, 0.12) !important;--color-primary-1: #00008b !important;--color-primary-2: #00009f !important;--color-primary-3: #0000b2 !important;--color-primary-4: #0000c6 !important;--color-primary-transparent-1: rgba(52, 133, 228, 0.48) !important;--color-primary-transparent-2: rgba(52, 133, 228, 0.24) !important;--color-primary-transparent-3: rgba(52, 133, 228, 0.12) !important;--color-negative-1: #ff491c !important;--color-negative-2: #e9441b !important;--color-negative-3: #d8411b !important;--color-negative-4: #c93d1a !important;--color-negative-transparent-1: rgba(255, 73, 28, 0.48) !important;--color-negative-transparent-2: rgba(255, 73, 28, 0.24) !important;--color-negative-transparent-3: rgba(255, 73, 28, 0.12) !important;--color-warning-1: #eb6404 !important;--color-warning-2: #d65c08 !important;--color-warning-3: #c7560b !important;--color-warning-4: #b8510d !important;--color-warning-transparent-1: rgba(242, 103, 2, 0.48) !important;--color-warning-transparent-2: rgba(242, 103, 2, 0.24) !important;--color-warning-transparent-3: rgba(242, 103, 2, 0.12) !important;--color-positive-1: #000077 !important;--color-positive-2: #00008b !important;--color-positive-3: #00009f !important;--color-positive-4: #0000b2 !important;--color-positive-transparent-1: rgba(0, 0, 139, 0.48) !important;--color-positive-transparent-2: rgba(0, 0, 139, 0.24) !important;--color-positive-transparent-3: rgba(0, 0, 139, 0.12) !important;}`));target.insertAdjacentHTML("afterend", `<a id="reflux-display" class="jsx-3593981321" target="_blank" href="//reflux.repl.co/"><span class="jsx-3593981321 sidebar-layout-nav-item-icon"><svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="24" height="24" viewBox="0 0 172 172" style="fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#00d1b2"><path d="M35.83333,21.5c-7.91917,0 -14.33333,6.41417 -14.33333,14.33333v100.33333c0,7.90483 6.4285,14.33333 14.33333,14.33333h100.33333c7.90483,0 14.33333,-6.4285 14.33333,-14.33333v-100.33333c0,-7.91917 -6.41417,-14.33333 -14.33333,-14.33333zM35.83333,35.83333h100.33333v14.33333h-100.33333zM35.83333,64.5h100.33333v71.66667h-100.33333zM71.66667,77.34961l-22.98372,22.98372l22.98372,22.98372l7.16667,-7.16667l-15.81706,-15.81706l15.81706,-15.81706zM100.33333,77.34961l-7.16667,7.16667l15.81706,15.81706l-15.81706,15.81706l7.16667,7.16667l22.98372,-22.98372z"></path></g></g></svg></span><div class="jsx-3593981321">Reflux</div><div class="jsx-3593981321 beta-label"><div style="background-color: #6262ff;" class="jsx-4210545632 beta-tag">ON</div></div></a>`);head.appendChild(style);alert("Reflux is now running!");} else {alert("Reflux operation cancelled.");}}})();
ch1ck3n (1632)

@ridark

Does not look very good, does it?

Whippingdot (573)

wait a sec you were ridark? WHY IS EVERYONE CHANGING THERE NAME ALL OF A SUDDON!!! I didn't know you were ridark(you are in my github org) I didn't know angrydoge used to be some gibberish characters and I didn't know frissyn used to be irethekid @CodingRedpanda

CodingRedpanda (180)

@Whippingdot yah, i used to be programmer567, then ridark, then i didn't like that so here i am now wait just a little while i doubt i'll still be CodingRedpanda xD

Whippingdot (573)

if u are on my github org don't u think you shud've at least told me you are changing your name @CodingRedpanda

CodingRedpanda (180)

@IreTheKID

is this a problem?

btw rly rly kewl!
frissyn (361)

@ridark nope! there's no need for a main.py file, I use Bash to automate the creation of my themes. This post exists to tell you what Reflux is and what it can do, but you have to make the themes on your own :)

angrydoge (465)

Man, youre starting to make some ebic stuff :D

JBloves27 (1729)

Really nice tutorial!

frissyn (361)

@JBYT27 Tutorial!? This is a Python project for styling your IDE smh, I guess no one bothered to try it out T~T

and I worked hard on it...

JBloves27 (1729)

Oop, sry. :( No, its really good! @IreTheKID

frissyn (361)

@JBYT27 no need to feel bad :)