diff options
| author | schneefux <schneefux+commit@schneefux.xyz> | 2017-03-25 13:13:57 +0100 |
|---|---|---|
| committer | schneefux <schneefux+commit@schneefux.xyz> | 2017-03-25 13:13:57 +0100 |
| commit | d25ff2bddd44b9dac1ceb248424109d1782dd211 (patch) | |
| tree | 34fcfd824a1a72e7b4d431b688adcea532b62180 /minionlivesmatter/templates/assets/tether/examples/viewport/index.html | |
| parent | a2cbdd1b88ac723e5e441c0a3c22636f0a8c4dfd (diff) | |
| download | meta-d25ff2bddd44b9dac1ceb248424109d1782dd211.tar.gz meta-d25ff2bddd44b9dac1ceb248424109d1782dd211.zip | |
add minionlivesmatter as submodule
Diffstat (limited to 'minionlivesmatter/templates/assets/tether/examples/viewport/index.html')
| -rw-r--r-- | minionlivesmatter/templates/assets/tether/examples/viewport/index.html | 70 |
1 files changed, 0 insertions, 70 deletions
diff --git a/minionlivesmatter/templates/assets/tether/examples/viewport/index.html b/minionlivesmatter/templates/assets/tether/examples/viewport/index.html deleted file mode 100644 index 742daa6..0000000 --- a/minionlivesmatter/templates/assets/tether/examples/viewport/index.html +++ /dev/null @@ -1,70 +0,0 @@ -<!DOCTYPE html> -<html> - <head> - <link rel="stylesheet" href="../resources/css/base.css" /> - <link rel="stylesheet" href="./colors.css" /> - <style> - * { - box-sizing: border-box; - } - - .element { - background-color: #FFDC00; - width: 80%; - max-width: 300px; - padding: 0 15px; - font-size: 20px; - box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.3); - } - - @media (max-width: 380px) { - .element { - font-size: 16px; - } - } - - .bit { - width: 10vw; - height: 10vw; - float: left; - } - </style> - </head> - <body> - <div class="element"> - <p>This element is tethered to the middle of the visible part of the body.</p> - - <p>Inspect the element to see how Tether decided - to use <code>position: fixed</code>.</p> - </div> - - <script src="//github.hubspot.com/tether/dist/js/tether.js"></script> - <script> - new Tether({ - element: '.element', - target: document.body, - attachment: 'middle center', - targetAttachment: 'middle center', - targetModifier: 'visible' - }); - </script> - - <script> - // Random colors bit, don't mind this - colors = ['navy', 'blue', 'aqua', 'teal', 'olive', 'green', 'lime', - 'yellow', 'orange', 'red', 'fuchsia', 'purple', 'maroon']; - - curColors = null; - for(var i=300; i--;){ - if (!curColors || !curColors.length) - curColors = colors.slice(0); - - var bit = document.createElement('div') - var index = (Math.random() * curColors.length)|0; - bit.className = 'bit bg-' + curColors[index] - curColors.splice(index, 1); - document.body.appendChild(bit); - } - </script> - </body> -</html> |
