Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/kdzwinel/CSS-Diff
Chrome extension that allows to easily compare CSS of two HTML elements.
https://github.com/kdzwinel/CSS-Diff
chrome-extension compare-elements css-diff
Last synced: 9 days ago
JSON representation
Chrome extension that allows to easily compare CSS of two HTML elements.
- Host: GitHub
- URL: https://github.com/kdzwinel/CSS-Diff
- Owner: kdzwinel
- License: gpl-3.0
- Created: 2012-09-27T08:19:21.000Z (about 12 years ago)
- Default Branch: master
- Last Pushed: 2022-12-06T17:08:26.000Z (almost 2 years ago)
- Last Synced: 2024-10-30T02:44:28.360Z (15 days ago)
- Topics: chrome-extension, compare-elements, css-diff
- Language: JavaScript
- Size: 539 KB
- Stars: 200
- Watchers: 9
- Forks: 19
- Open Issues: 19
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
CSS Diff
======================Chrome/Chromium extension that allows to easily compare CSS of two HTML elements.
![Screenshot](https://github.com/kdzwinel/CSS-Diff/blob/master/img/screenshot.png?raw=true)
Usage
-----You may install this extension by downloading it from GitHub and manually loading as an 'Unpacked extension' via chrome extensions page (`chrome://extensions`).
To compare elements, activate Chrome Developer Tools (F12) and open "CSS Diff" tab located in the right panel of the "Elements" module (please refer to the screenshot). Next, inspect (e.g. using magnifying glass button) first of the elements that you wish to compare. As soon as it will be selected, CSS Diff will display it in the "last inspected" section. Hit "Compare" button and repeat the whole process for the another element. As soon as two HTML elements will be selected, CSS Diff will show all CSS differences between them.
Bugs and Features
-----------------If you found a bug or have a feature request, please create an issue here on GitHub.
https://github.com/kdzwinel/CSS-Diff/issues
Changelog
---------### 0.30 ###
New features:
+ ability to compare elements from different tabs
+ more control over what is being compared through the 'Compare' button
+ improved look### 0.20 ###
New features:
+ differences displayed in a table
+ similar attributes grouped
+ webkit attributes separatedThanks to
------**Mike Vanderkley** for inspiration
Author
------**Konrad Dzwinel**
+ https://github.com/kdzwinel
+ http://www.linkedin.com/pub/konrad-dzwinel/53/599/366/enLicense
-------This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.You should have received a copy of the GNU General Public License
along with this program. If not, see .