haskal
/
asciiflow2
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Some improvements to mobile menu rendering

This commit is contained in:
Lewis Hemens 2014-02-19 23:11:51 +00:00
parent 7317fbaf23
commit 8b5e3139a6
1 changed files with 25 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
index.html
View File

@ -3,10 +3,11 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>ASCIIFlow Infinity</title> <title>ASCIIFlow Infinity</title>
<style> <style>
#menu { #menu {
position: fixed; position: absolute;
top: 95px; top: 95px;
left: 0px; left: 0px;
z-index: 100; z-index: 100;
@ -14,10 +15,12 @@
.dialog { .dialog {
position: fixed; position: fixed;
top: 0px; top: 95px;
left: 70px; left: 70px;
width: 400px; right: 10px;
height: 300px; bottom: 10px;
max-width: 640px;
max-height: 480px;
transition: height 0.3s; transition: height 0.3s;
margin-top: 3px; margin-top: 3px;
background: #F8F8F8; background: #F8F8F8;
@ -70,16 +73,31 @@ button.file.active {
border-bottom: 1px solid #444; border-bottom: 1px solid #444;
} }
/* Small screen overrides */
@media(max-width: 700px) {
#logo {
display: none;
}
#menu {
top: 0px;
}
.dialog {
top: 0px;
}
}
#logo pre { #logo pre {
margin: 0px; margin: 0px;
} }
textarea { textarea {
width: 380px; width: 100%;
height: 280px; height: 100%;
overflow: hidden; overflow: hidden;
resize: none; resize: none;
margin: 5px; margin: 0px;
padding: 0px;
border: 0px;
font-family: monospace; font-family: monospace;
white-space: pre; white-space: pre;
} }