A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.
One-line version to paste in your DevTools
Use $$ if your browser aliases it:
~ 108 byte version
Indrashish Ghosh ghosh
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| " --------------------------------------------- | |
| " Appearance Settings | |
| " --------------------------------------------- | |
| " Don't check compatibility | |
| set nocompatible | |
| " Enable syntax highlighting | |
| syntax on |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| alias c="clear" | |
| alias ~="cd ~" | |
| alias ..="cd .." | |
| alias ls="ls -a" | |
| alias bashreload="source $HOME/.bashrc" |
ghosh
/ .gitignore
Created
November 4, 2019 08:27
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| node_modules/ | |
| .DS_Store |
ghosh
/ micromodal.css
Last active
July 1, 2025 17:27
Demo modal styles for micromodal.js and corresponding expected html. If using this, set the `awaitCloseAnimation` in config to true
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /**************************\ | |
| Basic Modal Styles | |
| \**************************/ | |
| .modal { | |
| font-family: -apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif; | |
| } | |
| .modal__overlay { | |
| position: fixed; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // ---- | |
| // libsass (v3.2.5) | |
| // ---- | |
| $breakpoints: ( | |
| small : 570px, | |
| medium: 800px, | |
| large : 1030px | |
| ); |
ghosh
/ README.md
Last active
July 30, 2022 18:49
— forked from addyosmani/README.md
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * The path to the fonts folder, relative to the | |
| * compiled stylesheet | |
| * | |
| * @type String | |
| */ | |
| $font-path: "../fonts/" !default; | |
| /** |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // ---- | |
| // Sass (v3.3.0.rc.5) | |
| // Compass (v1.0.0.alpha.18) | |
| // ---- | |
| // Prefixing mixin | |
| // ---------- | |
| // @param [map] $map: property/value pairs to be prefixed | |
| // @param [list] $vendors: vendor prefixes to use | |
| // ---------- |