Firebug Extension or JQuery App for live CSS editing, easy buttons, WYSIWG


I need a Frontend that will change existing CSS of a website by overriding it with custom one.

Website -> Proxy -> User

Our backend operates on the proxy and inserts a blank CSS file into the datastream. That CSS file will need to be generated by a non-webdesign-person.

When the website is displayed through that proxy to one of our workers, a user-interface, such as Firebug, should be displayed where the worker can easily:

- Select an item (such as a Logo or Menubutton)

- Iterate to its parent (such as the entire Menu), next sibling, and back the way he came.

- OR, instead of selecting a CSS-Path or CSS-id, select the corresponding class (such as ) (solved by radiobuttons or dropdown)

- The currently selected element needs to be highlighted (such as with firebug)

- Hide that element or element-group (e.g. thisOneParagraph { display: none; })

- Adjust hight, width, fontsize and other important options with "up" and "down" arrow-buttons

- Apply a predefined "theme" to that element (e.g.: thisOtherParagraph: { font-size: 12px, color: red; }), solved by dropdown

- An optional text area that shows the CSS for manual input

- the Flag "!important" should be able to be added to most of the commands

There should be an instant preview, and a Upload&Reload Button, that uploads the generated CSS to the server and reloads the website to check the result.

The upload should be implemented via REST or similar, a Backend (either PHP or Ruby on Rails) accepts the file and saves it in the right place.

there already is a similar solution: [url removed, login to view] and [url removed, login to view]

which could be adapted to be more resiliant (since this sometines doesnt work) and added the buttons and easy-select-features.

this is a prototype for a larger project.

after this, the backend needs to be designed, where a worker can add a new site and open the editor.

the picture is an early draft and can definately be improved upon. the interface can be below OR to the right of the website OR in a seperate window.

Skills: Javascript, jQuery / Prototype, PHP, Ruby on Rails, Software Architecture

See more: this class jquery, server for ruby on rails, ruby on rails new logo, ruby on rails jquery, ruby on rails app for server, ruby on rails app, rest with ruby on rails, php live person, php live editor, jquery class, easy prototype, rails github, jquery back, is github down, github ruby on rails, prototype app, need editor for manual, logo for window, live draft, css webdesign, css app, change -an-already-designed -logo, app prototype, app preview, app manual

About the Employer:
( 0 reviews ) Germany

Project ID: #4180018

3 freelancers are bidding on average $507 for this job


I'm a Firefox addon developer

$720 USD in 28 days
(9 Reviews)

Dear sir, Greetings!!!Certified guys is here according to your requirement. We understand your requirement clearly. Please check your private message for bid details. Thank for your consideration. Regards

$500 USD in 10 days
(4 Reviews)

Hi, I am interested for doing this project. I have made many jquery projects and games as well.This project is equally important as i have to user my skills to provide you you quality and timely delivery of work. Pleas More

$300 USD in 10 days
(2 Reviews)