summaryrefslogtreecommitdiff
path: root/minionlivesmatter/templates/assets/tether/examples/viewport
diff options
context:
space:
mode:
authorschneefux <schneefux+commit@schneefux.xyz>2017-03-25 13:13:57 +0100
committerschneefux <schneefux+commit@schneefux.xyz>2017-03-25 13:13:57 +0100
commitd25ff2bddd44b9dac1ceb248424109d1782dd211 (patch)
tree34fcfd824a1a72e7b4d431b688adcea532b62180 /minionlivesmatter/templates/assets/tether/examples/viewport
parenta2cbdd1b88ac723e5e441c0a3c22636f0a8c4dfd (diff)
downloadmeta-d25ff2bddd44b9dac1ceb248424109d1782dd211.tar.gz
meta-d25ff2bddd44b9dac1ceb248424109d1782dd211.zip
add minionlivesmatter as submodule
Diffstat (limited to 'minionlivesmatter/templates/assets/tether/examples/viewport')
-rw-r--r--minionlivesmatter/templates/assets/tether/examples/viewport/colors.css145
-rw-r--r--minionlivesmatter/templates/assets/tether/examples/viewport/index.html70
2 files changed, 0 insertions, 215 deletions
diff --git a/minionlivesmatter/templates/assets/tether/examples/viewport/colors.css b/minionlivesmatter/templates/assets/tether/examples/viewport/colors.css
deleted file mode 100644
index 64f8c1c..0000000
--- a/minionlivesmatter/templates/assets/tether/examples/viewport/colors.css
+++ /dev/null
@@ -1,145 +0,0 @@
-@charset "UTF-8";
-/****
-
- colors.css v1.0 For a friendlier looking web
- MIT License • http://clrs.cc • http://github.com/mrmrs/colors
-
- Author: mrmrs
- http://mrmrs.cc
- @mrmrs_
-
-****/
-/*
-
- SKINS
- • Backgrounds
- • Colors
-
-*/
-/* Backgrounds */
-.bg-navy {
- background-color: #001f3f; }
-
-.bg-blue {
- background-color: #0074d9; }
-
-.bg-aqua {
- background-color: #7fdbff; }
-
-.bg-teal {
- background-color: #39cccc; }
-
-.bg-olive {
- background-color: #3d9970; }
-
-.bg-green {
- background-color: #2ecc40; }
-
-.bg-lime {
- background-color: #01ff70; }
-
-.bg-yellow {
- background-color: #ffdc00; }
-
-.bg-orange {
- background-color: #ff851b; }
-
-.bg-red {
- background-color: #ff4136; }
-
-.bg-fuchsia {
- background-color: #f012be; }
-
-.bg-purple {
- background-color: #b10dc9; }
-
-.bg-maroon {
- background-color: #85144b; }
-
-.bg-white {
- background-color: white; }
-
-.bg-gray {
- background-color: #aaaaaa; }
-
-.bg-silver {
- background-color: #dddddd; }
-
-.bg-black {
- background-color: #111111; }
-
-/* Colors */
-.navy {
- color: #001f3f; }
-
-.blue {
- color: #0074d9; }
-
-.aqua {
- color: #7fdbff; }
-
-.teal {
- color: #39cccc; }
-
-.olive {
- color: #3d9970; }
-
-.green {
- color: #2ecc40; }
-
-.lime {
- color: #01ff70; }
-
-.yellow {
- color: #ffdc00; }
-
-.orange {
- color: #ff851b; }
-
-.red {
- color: #ff4136; }
-
-.fuchsia {
- color: #f012be; }
-
-.purple {
- color: #b10dc9; }
-
-.maroon {
- color: #85144b; }
-
-.white {
- color: white; }
-
-.silver {
- color: #dddddd; }
-
-.gray {
- color: #aaaaaa; }
-
-.black {
- color: #111111; }
-
-/* PRETTIER LINKS */
-a {
- text-decoration: none;
- -webkit-transition: color .3s ease-in-out;
- transition: color .3s ease-in-out; }
-
-a:link {
- color: #0074d9;
- -webkit-transition: color .3s ease-in-out;
- transition: color .3s ease-in-out; }
-
-a:visited {
- color: #b10dc9; }
-
-a:hover {
- color: #7fdbff;
- -webkit-transition: color .3s ease-in-out;
- transition: color .3s ease-in-out; }
-
-a:active {
- color: #ff851b;
- -webkit-transition: color .3s ease-in-out;
- transition: color .3s ease-in-out; }
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>