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
<!-- put this to IDEA keymaps config folder. For v13 it is <userdir>\.IntelliJIdea13\config\keymaps\ --> | |
<?xml version="1.0" encoding="UTF-8"?> | |
<keymap version="1" name="Mac OS X 10.5+ Windows Ctrl" parent="Mac OS X 10.5+"> | |
<action id="$Copy"> | |
<keyboard-shortcut first-keystroke="meta C" /> | |
<keyboard-shortcut first-keystroke="meta INSERT" /> | |
<keyboard-shortcut first-keystroke="control C" /> | |
<keyboard-shortcut first-keystroke="control INSERT" /> | |
</action> | |
<action id="$Cut"> |
ℹ️ There is a newer alternative project that does similar things and more, check it out at https://github.com/stevenilsen123/mac-keyboard-behavior-in-windows
Make Windows PC's shortcut act like macOS (Mac OS X) (using AutoHotkey (ahk) script)
With this AutoHotKey script, you can use most macOS style shortcuts (eg, cmd+c, cmd+v, ...) on Windows with a standard PC keyboard.
module ApplicationHelper | |
def responsive_image_tag(image, options = {}) | |
content_tag(:picture) do | |
concat content_tag(:source, nil, media: '(max-width: 768px)', srcset: image.url(:thumbnail_mobile)) | |
concat content_tag(:source, nil, media: '(max-width: 960px)', srcset: image.url(:thumbnail_tablet)) | |
concat image_tag(image.url(:thumbnail_desktop), options) | |
end | |
end | |
end |
{ | |
"Block (with comment)": { | |
"prefix": "di", | |
"body": [ | |
"<!-- begin ${1} -->", | |
"<div class=\"${1}\">", | |
"\t${2}", | |
"</div>", | |
"<!-- end ${1} -->" | |
] |
$ cd /usr/local/lib | |
$ sudo ln -s ../../lib/libSystem.B.dylib libgcc_s.10.5.dylib | |
$ sudo ln -s ../../lib/libSystem.B.dylib libgcc_s.10.4.dylib |
Visual documentation
Faster design delivery (than having component embedded into the page)