diff options
| author | Jules Laplace <jules@okfoc.us> | 2017-04-29 21:49:35 -0400 |
|---|---|---|
| committer | Jules Laplace <jules@okfoc.us> | 2017-04-29 21:49:35 -0400 |
| commit | 863f00b54ab6db35c791ee31143283b1155e1de3 (patch) | |
| tree | 39d25ef25e70b10dc1a040c0c5cc2e82d83e1beb /index.html | |
| parent | 74f32f24febbae1ba8c5179627b53bfb200be579 (diff) | |
sort by color and brightness
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 34 |
1 files changed, 32 insertions, 2 deletions
@@ -1,8 +1,7 @@ <html> <head> <title>honeycomb</title> -<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> -<style> +<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> <style> html,body { margin: 0; padding: 0; width: 100%; height: 100%; } body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; @@ -16,6 +15,31 @@ body { .desktop body { user-select: none; } +svg { + transition: all 0.5s ease; + cursor: pointer; +} +#buttons { + position: absolute; + bottom: 0; left: 0; + width: 100%; + text-align: center; +} +#buttons button { + margin: 10px; + font-size: 18px; + border: 2px solid; + background: #000; + color: #bbb; + font-weight: bold; + padding: 5px; +} +#hertz { + font-size: 36px; + padding: 10px; + color: #fff; + font-weight: bold; +} @media only screen and (max-device-width: 800px) { html,body { margin: 0; @@ -26,6 +50,12 @@ body { </head> <body> <div id="container"></div> +<div id="buttons"> + <div id="hertz"></div> + <button id="frequency">frequency</button> + <button id="color">color</button> + <button id="brightness">brightness</button> +</div> </body> <script> var s = document.createElement('script'); |