diff options
| author | Adam Mathes <adam@trenchant.org> | 2018-04-27 10:17:38 -0700 |
|---|---|---|
| committer | Adam Mathes <adam@trenchant.org> | 2018-04-27 10:17:38 -0700 |
| commit | 85ad7965934f98f84e9e937029ac9c1704b75e88 (patch) | |
| tree | 4e2073a41e0088560285119093de22643c42a517 | |
| parent | 4b3f852a009a1582b40250e9c78cb412d7523936 (diff) | |
| download | neko-85ad7965934f98f84e9e937029ac9c1704b75e88.tar.gz neko-85ad7965934f98f84e9e937029ac9c1704b75e88.tar.bz2 neko-85ad7965934f98f84e9e937029ac9c1704b75e88.zip | |
wip filter ui
| -rw-r--r-- | static/style.css | 126 | ||||
| -rw-r--r-- | static/ui.html | 2 |
2 files changed, 65 insertions, 63 deletions
diff --git a/static/style.css b/static/style.css index 4305e56..1e813b7 100644 --- a/static/style.css +++ b/static/style.css @@ -153,16 +153,18 @@ pre { } .logo { + margin: 0; + padding: 1rem; position: fixed; top: 0; left: 0; - font-size: 36px; - text-align: center; + font-size: 18px; color: black; line-height: 1em; z-index: 1; cursor: pointer; - width: 10rem; + width: 100%; + background-color: #ccc; } .hasunread { @@ -204,62 +206,62 @@ button { } -/* @media only screen and (max-device-width: 768px) { */ -/* html { */ -/* width: 100%; */ -/* font-size: 22px; */ -/* } */ - -/* body { */ -/* min-width: 0; */ -/* width: 100%; */ -/* max-width: 100%; */ -/* overflow: hidden; */ -/* } */ - - -/* #filters h4, #filters h1 { */ -/* display: none; */ -/* } */ - -/* #controls { */ -/* width: 100%; */ -/* font-size: 1.5rem; */ -/* } */ - -/* #controls ul { */ -/* padding: 0; */ -/* margin: 0; */ -/* text-align: center; */ -/* } */ - -/* #controls li { */ -/* display: inline; */ -/* } */ - -/* #filters { */ -/* width: 100%; */ -/* height: 50px; */ -/* position: fixed; */ -/* top: 0; */ -/* left: 0; */ -/* background: #ccc; */ -/* } */ - - -/* #items { */ -/* margin: 0 auto; */ -/* max-width: 100%; */ -/* } */ -/* } */ - -/* @media only screen and (max-device-width: 400px) { */ -/* html { */ -/* font-size: 16px; */ -/* } */ - -/* body { */ -/* min-width: 0; */ -/* width: 100%; */ -/* } */ -/* } */ +@media only screen and (max-device-width: 768px) { + html { + width: 100%; + font-size: 22px; + } + + body { + min-width: 0; + width: 100%; + max-width: 100%; + /* overflow: hidden; */ + } + + + /* #filters h4, #filters h1 { */ + /* display: none; */ + /* } */ + + /* #controls { */ + /* width: 100%; */ + /* font-size: 1.5rem; */ + /* } */ + + /* #controls ul { */ + /* padding: 0; */ + /* margin: 0; */ + /* text-align: center; */ + /* } */ + + /* #controls li { */ + /* display: inline; */ + /* } */ + + /* #filters { */ + /* width: 100%; */ + /* height: 50px; */ + /* position: fixed; */ + /* top: 0; */ + /* left: 0; */ + /* background: #ccc; */ + /* } */ + + + #items { */ + margin: 0 auto; + max-width: 100%; + } +} + +@media only screen and (max-device-width: 400px) { + html { + font-size: 16px; + } + + body { + min-width: 0; + width: 100%; + } +} diff --git a/static/ui.html b/static/ui.html index 06be649..89283a4 100644 --- a/static/ui.html +++ b/static/ui.html @@ -14,7 +14,7 @@ <meta name="viewport" content="width=device-width,height=device-height, initial-scale=1, maximum-scale=1" /> </head> <body> - <h1 class="logo" onclick="$('#filters').toggle();">neko</h1> + <h1 class="logo" onclick="$('#filters').toggle();">😸neko</h1> <div id="filters"> |