Michal Čaplygin myfonj
This file contains 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
| /* slanted menu | |
| */ | |
| html { background-color: #222; } | |
| body { | |
| font-family: Tahoma, sans-serif; | |
| padding: 10px 0; | |
| max-width: 20em; | |
| margin: 1em auto; | |
| background-color: #fff; | |
| font-size: 30px; |
This file contains 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
| /* slanted menu | |
| */ | |
| html { background-color: #222; } | |
| body { | |
| font-family: Tahoma, sans-serif; | |
| padding: 10px 0; | |
| max-width: 20em; | |
| margin: 1em auto; | |
| background-color: #fff; | |
| font-size: 30px; |
This file contains 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
| /* etn Q&A */ | |
| .w { | |
| width: 16px; | |
| height: 16px; | |
| border: 1px solid red; | |
| position: relative; | |
| } | |
| .q, .a, .amp { | |
| position: absolute; |
This file contains 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
| /* etn Q&A */ | |
| .w { | |
| width: 16px; | |
| height: 16px; | |
| border: 1px solid red; | |
| position: relative; | |
| } | |
| .q, .a, .amp { | |
| position: absolute; |
This file contains 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
| /* | |
| CSS selector specificity test | |
| pass trough code and activate/deactivate comments to see it in action | |
| */ | |
| /* add or remove space after "*" → */ | |
| #Menu:not(#x):not(#x):after { | |
| content:'#Menu:not(#x):not(#x) ' !important; | |
| } | |
| /* equals * / | |
| #Menu#Menu#Menu:after { |
This file contains 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
| /* | |
| § `sharp` corners | |
| */ | |
| .arrowscrollbox-scrollbox { | |
| -moz-padding-start: 0 !important; | |
| } | |
| .tab-background-middle, | |
| .tab-background { | |
| -moz-margin-start: 0; |
myfonj
/ Self-modifying in-page editor saving itself into data-URI
Last active
August 29, 2015 14:01
Single page self-contained browser 'boorkamark apps' or keyword commands / bookmarklets
This file contains 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
| data:text/html;charset=utf-8;base64,PCFET0NUWVBFIEhUTUw+PG1ldGEgY2hhcnNldD11dGYtOD48dGl0bGU+U2VsZi1tb2RpZnlpbmcgZGF0YVVSSSBkb2N1bWVudDwvdGl0bGU+Cjxib2R5CglvbmxvYWQ9KHQ9KGQ9ZG9jdW1lbnQpLmJvZHkuY2hpbGROb2Rlc1swXSkudmFsdWU9ZGVjb2RlVVJJQ29tcG9uZW50KGVzY2FwZShhdG9iKGQubG9jYXRpb24uaHJlZi5zbGljZSgzNikpKSkKCXN0eWxlPSJmb250LWZhbWlseTogU2VyaWYsIFNlZ29lIFVJIFN5bWJvbCwgU2VyaWYiCj48dGV4dGFyZWEKCWF1dG9mb2N1cwoJY29scz0yMDAKCXJvd3M9MzAKCXN0eWxlPSJ0YWItc2l6ZTogNDsgLW1vei10YWItc2l6ZTogNDsgZm9udC1mYW1pbHk6IENvdXJpZXIgbmV3LCBTZWdvZSBVSSBTeW1ib2wsIG1vbm9zcGFjZTsgZm9udC1zaXplOiAxM3B4OyIKCXdyYXA9b2ZmCj48L3RleHRhcmVhPjxicj48YnV0dG9uCglvbmNsaWNrPWQubG9jYXRpb24uaHJlZj0nZGF0YTp0ZXh0L2h0bWw7Y2hhcnNldD11dGYtODtiYXNlNjQsJytidG9hKHVuZXNjYXBlKGVuY29kZVVSSUNvbXBvbmVudCh0LnZhbHVlKSkpCglhY2Nlc3NrZXk9cwoJaWQ9cwo+PHU+czwvdT5hdmU8L2J1dHRvbj4KPG9sPgoJPGxpPlRoaXMgZG9jdW1lbnQgaXMgc29tZXdoYXQgc2VsZi1jb250YWluZWQgaW4gaXRzIG93biA8Y29kZT5kYXRhOjwvY29kZT4gVVJJIG1ha2VzIGl0cyBjb250ZW50Cgk8bGk+VGhpcyBkb2N1bWVudCBtb2RpZmllcyBpdHNlbGYgdXBvbiA8bGFiZWwgZm9yPSJz |
myfonj
/ js_multiline_string.html
Created
May 27, 2014 17:46
Javascript multiline string expression shim
This file contains 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
| <!DOCTYPE HTML><html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"> | |
| <meta http-equiv="X-UA-Compatible" content="IE=7" /> | |
| <title>Javascript multiline string expression shim</title><style type="text/css"> | |
| body{background-color:#333;color:#ccc;max-width:40em;margin:0 auto;} | |
| h1,h2,h3,em,strong,th,thead,label,dt,legend,caption{color:#fff} | |
| a:link{color:#6ff}a:visited{color:#9f3}label:hover,a:hover{background-color:#000} | |
| html *{font-family:"Courier New",monospace} | |
| pre{tab-size:2;-moz-tab-size:2;background-color: #444} | |
| </style></head><body> |
myfonj
/ dabblet.css
Last active
June 27, 2016 21:33
Chrome radial-gradient closest-side color stop nearing 100% clamps to infinity
This file contains 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
| /** Chrome radial-gradient closest-side color stop nearing 100% clamps to infinity | |
| */ | |
| .a { background-image: radial-gradient(closest-side, red 50%, white 0) } | |
| .b { background-image: radial-gradient(closest-side, red 99%, white 0) } | |
| .c { background-image: radial-gradient(closest-side, red 99.609371185302727214061491167740314267575740814208984374%, white 0)} | |
| .d { background-image: radial-gradient(closest-side, red 99.609371185302727214061491167740314267575740814208984375%, white 0)} | |
| .e { background-image: radial-gradient(closest-side, red 100%, white 0)} | |
| p { width: 15vw; height: 15vw; margin-right: 2vw; background-color: #ccc; float: left; word-break: break-all; word-wrap: break-word; border: 1px solid; } |
myfonj
/ dummyze2.html
Last active
January 4, 2024 16:00
Dummyze bookmarklet - replace all texts in page with ▒▒▒▒ and images with dummyimage.com counterparts
This file contains 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
| <p>Bookmarklet: | |
| <a title="Dummyze2" href="javascript:(function (dummyze, entry) {function textWalker(node, cbck) {var i = -1,n, s, w, h;if (!node) {return}if (node.nodeType === 3) {cbck(node, 'nodeValue');return}if (node.tagName == 'IFRAME') {try {textWalker(node.contentDocument.documentElement, cbck)} catch (e) {}return}if (node.tagName == 'STYLE' || node.tagName == 'SCRIPT' || node.tagName == 'SVG') {return}if (node.tagName == 'IMG') {s = getComputedStyle(node);node.src = 'https://dummyimage.com/' + (parseInt(s.width) || 10) + 'x' + (parseInt(s.height) || 10);return}if (node.tagName == 'INPUT' || node.tagName == 'TEXTAREA') {cbck(node, 'placeholder');cbck(node, 'value');return}if (node.tagName) {if ((s = node.getAttribute('style')) && (s = (s = getComputedStyle(node)).backgroundImage) && (s != 'none') && (s = (s.match(/url\("([^"]+)"\)/))) && (s = s[1])) {pic = new Image();pic.onload = function () {node.style.backgroundImage = 'url(https://dummyimage.com/' + (p |
OlderNewer