diff options
author | emkael <emkael@tlen.pl> | 2014-12-16 13:34:58 +0100 |
---|---|---|
committer | emkael <emkael@tlen.pl> | 2014-12-16 13:34:58 +0100 |
commit | 67fa29786898819ca5af0e3b9e667f586a3c24d2 (patch) | |
tree | 8525e02c91555ffb97788033a71aa8e1be835278 | |
parent | d0474cc7dec9919ac79e0e4e3af14c75183cd638 (diff) |
* styles modified to more mobile-friendly version
-rw-r--r-- | how.js | 4 | ||||
-rw-r--r-- | index.html | 51 | ||||
-rw-r--r-- | style.css | 24 |
3 files changed, 34 insertions, 45 deletions
@@ -352,7 +352,7 @@ var Viewport = function(width, height) { if (!where) { where = jQuery('body'); } - jQuery(where).append(that.container); + jQuery(where).prepend(that.container); } }; @@ -410,7 +410,7 @@ var Control = function(movement) { } jQuery(document).ready(function() { - var vp = new Viewport(jQuery(window).width()*0.6, jQuery(window).height()*0.9); + var vp = new Viewport(jQuery(window).width()*0.70, jQuery(window).height()*0.9); vp.render(); var movements; var moveList = jQuery('.selector .list'); @@ -9,36 +9,29 @@ <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> - <div class="info"> - <h1>Howellki</h1> - Obsługa: wybierz rotację z menu po prawej stronie.<br /> - Autor: <a href="http://emkael.info">MKL</a> - </div> - <div class="selector"> - <div class="lollipop"> - <br /><br /> - «<br /> - M<br /> - E<br /> - N<br /> - U<br /> - « + <div class="rightPane"> + <div class="selector"> + <div class="list"> + <div class="layout">Stoły + <select class="direction"> + <option value="left">od lewej</option> + <option value="right">od prawej</option> + <option value="top">od góry</option> + <option value="bottom">od dołu</option> + </select> + <select class="way"> + <option value="straight">w dwóch rzędach</option> + <option value="uturn">zawinięte</option> + <option value="snake">wężykiem</option> + </select> + </div> + <div> RUNDY STOŁY</div> + </div> </div> - <div class="list"> - <div class="layout">Stoły - <select class="direction"> - <option value="left">od lewej</option> - <option value="right">od prawej</option> - <option value="top">od góry</option> - <option value="bottom">od dołu</option> - </select> - <select class="way"> - <option value="straight">w dwóch rzędach</option> - <option value="uturn">zawinięte</option> - <option value="snake">wężykiem</option> - </select> - </div> - <div> RUNDY STOŁY</div> + <div class="info"> + <h1>Howellki</h1> + Obsługa: wybierz rotację z menu.<br /> + Autor: <a href="http://emkael.info">MKL</a> </div> </div> </body> @@ -5,27 +5,24 @@ body { } .selector { - position: fixed; - top: 0; - right: 0; background-color: grey; height: 395px; color: white; z-index: 100; border: solid 1px black; + min-width: 280px; + width: 25%; + margin-top: 5px; + padding: 5px; + overflow: hidden; } .selector .list { width: 500px; - display: none; float: left; padding-top: 5px; } -.selector:hover .list { - display: block; -} - .selector .lollipop { text-align: center; width: 50px; @@ -106,9 +103,6 @@ table.summary td { } .controls { - position: fixed; - top: 400px; - right: 0px; } .controls .play, @@ -127,10 +121,12 @@ table.summary td { border: solid 1px black; } +.rightPane { + float: right; + width: 25%; +} + .info { - position: fixed; - bottom: 0; - right: 0; width: 250px; height: 150px; } |