CSS StylEditor by atarimnet

A live CSS editor for your browser — edit, see, save. No more page reloads. CSS StylEditor is a browser extension that lets you edit the CSS files of any website directly in your browser — and see the changes instantly on scre

Experimental

0 (0 reviews)

Download Firefox and get the extension

Download file

About this extension

The extension only makes temporary changes in the browser’s memory. To save the changes permanently, you need to upload an additional file to the server. More details are available in the instructions and on the extension’s website.
About CSS StylEditor
A live CSS editor for your browser — edit, see, save. No more page reloads.
What is CSS StylEditor?
CSS StylEditor is a browser extension that lets you edit the CSS files of any website directly in your browser — and see the changes instantly on screen, without saving a file, uploading to a server, or refreshing the page.
The Problem It Solves
Every developer and designer knows the frustration: change one line of CSS, save, switch to the browser, refresh, see the result — then go back to the editor for another small change. This cycle repeats dozens of times a day. CSS StylEditor breaks this cycle entirely.

Developer comments

Operating Instructions

General Requirements

The extension reads CSS settings directly from the browser. Therefore, settings that are specific to a particular browser may not be recognized by the extension and will not be written to the file when saving. It is recommended to keep a separate file for settings intended for a different browser.
All changes made by the extension exist only in the browser’s memory until they are finally saved to a file on the server.
The extension works with http and https protocols and does not work with the file protocol.

Using the Extension

Clicking the extension activation button will open the extension in a draggable window that can be positioned anywhere inside the browser.

Select a CSS file — a list of selectors from the file will appear.
Select a selector — a list of properties within the selected selector will appear.
Property values can be changed using the controls attached to each property.
Right-clicking a property name allows you to:
Delete the property
Restore the value it had when the selector was selected
Edit the value as text
You can add a new property to the list — it will appear at the end of the list with default values.

The Property Did Not Appear at the End of the List?

Possible reasons:

You selected sorted list display.
Your browser does not support that property.

You can also add a new selector.

Saving the File

When everything is correct, the file should be saved.
Saving affects only the currently selected file, so the save process must be repeated for each file that was modified.

The extension sends the data to the server using a POST request:

ptr — the file identifier and its location on the server
content — the file content (selectors and settings)
key — the identifier name defined by the user in the settings panel, containing the password value (val)

Example

If the key is abc and the val is 123, then the parameter sent to the server will be named abc and will contain 123.

Downloading the Example Update Program

The file se-conf.zip contains two files:

CSSStyleDeclaration.php — the program file configured in the extension
se-conf.php — a helper file containing the key and val values, which must also be updated in the extension settings

Download the file from the following page:
https://css.styleditor.net/?d=e5

Use of the program is free and entirely at the user’s own responsibility.

Rated 0 by 0 reviewers

CSS StylEditor by atarimnet

Required permissions:

Data collection: