Skip to content

focat69/tStyle

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

18 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

tStyle

Python CSS injecter. (Soon to be Python & JS injecter)

Inspired by Reflux

tStyle is a great css injecter. It allows you do anything that you could do in normal css! NOT just changing colo(u)rs, but also keyframes, web kit tools and everything! It saves into a .css file so you don't have to write everything again.

Creating a theme

You can create a theme easily due to tStyle's ease!

import tStyle as ts

black = ts.Theme()
black.style()
black.description({
    "name": "Black",
    "author": "Your name",
    "date_made": "Date",
    "about": "Desc."
})

That's it!

HOW TO INJECT

  1. Go to website
  2. Open inspect element
  3. Make a new tStyle theme
  4. Copy the css file contents and add to main css file
  5. Enjoy!

Before/After

image << This is the code.

image << Creation of the pink theme.

(You all can do better than this lmao i did it rlly quick so)

Line 1: body {
Line 2:   background-color: pink;
Line 3: }
Line 4:
Line 5:  * {
Line 6:   color: white;
Line 7:   font-family: monospace;
Line 8:  }

BEFORE image

AFTER image

Here's why you should use it.

Some people might say, "You can just write that code! You don't need tStyle!". Well, tStyle is working on auto generation so you can just sit back and relax while we do the work. How it works is you pick a few options you want to add, then configure those options and we will automatically generate the css for you! (Soon to come)

An example:

>>> import tStyle as ts
>>> ANIMATION = { "type": "slide", "sec": 0.6, "extra": "ease forwards"}
>>> TRANSFORM = "-150px"
>>> ts.add("*", ANIMATION, TRANSFORM)
>>> ts.generate()

Output:

* {
  transition:0.3s;
  -moz-transition:0.3s;
  transform: translateX(-150px);
  animation:slide 0.8s ease forwards;
}

*:nth-child(odd) {
  animation-duration: 0.6s;
}

@keyframes slide {
  /* 0% {
    left:-100px;
  }
  50% {
    left:-50px;
  }
  100% {
    text-align:center;
  } */
  to { transform: translateX(0); }
}

5 lines of python and we have generated 23 lines of css!

FUTURE UPDATES

! Easy css generation ! Some commits would be awesome :D
Add a GUI?
Auto inject using js
Save injections with js bookmarks