4 <link rel="stylesheet" href="../resources/css/base.css" />
5 <link rel="stylesheet" href="./colors.css" />
8 box-sizing: border-box;
12 background-color: #FFDC00;
17 box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.3);
20 @media (max-width: 380px) {
35 <p>This element is tethered to the middle of the visible part of the body.</p>
37 <p>Inspect the element to see how Tether decided
38 to use <code>position: fixed</code>.</p>
41 <script src="../../tether.js"></script>
45 target: document.body,
46 attachment: 'middle center',
47 targetAttachment: 'middle center',
48 targetModifier: 'visible'
53 // Random colors bit, don't mind this
54 colors = ['navy', 'blue', 'aqua', 'teal', 'olive', 'green', 'lime',
55 'yellow', 'orange', 'red', 'fuchsia', 'purple', 'maroon'];
59 if (!curColors || !curColors.length)
60 curColors = colors.slice(0);
62 var bit = document.createElement('div')
63 var index = (Math.random() * curColors.length)|0;
64 bit.className = 'bit bg-' + curColors[index]
65 curColors.splice(index, 1);
66 document.body.appendChild(bit);