From: Chip Black Date: Tue, 7 Aug 2012 06:31:46 +0000 (-0700) Subject: Rework header for small-screens X-Git-Tag: v1.7~2^2~9 X-Git-Url: http://git.bytex64.net/?a=commitdiff_plain;h=868758a60c47c984eb76bae45183d063981ebdd5;p=blerg.git Rework header for small-screens --- diff --git a/www/css/blerg.css b/www/css/blerg.css index cec598b..73dc13d 100644 --- a/www/css/blerg.css +++ b/www/css/blerg.css @@ -24,6 +24,7 @@ a > img { background-color: #1E1E1E; color: white; padding: 8px 8px 16px 8px; + position: relative; } .blerg-header .logo { @@ -63,21 +64,25 @@ a > img { color: black; } +.blerg-title { + float: left; + width: 35%; +} + .blerg-controls { float: right; - position: relative; - width: 50%; margin-top: 8px; margin-right: 8px; font-size: large; text-align: right; - height: 114px; } .blerg-controls-toolbar { position: absolute; right: 0; - bottom: 0; + top: 69pt; + margin-bottom: 16px; + margin-right: 16px; } .blerg-controls-toolbar .onyx-button { @@ -85,6 +90,40 @@ a > img { font-size: 14pt; } +@media screen and (max-width: 800px) { + .blerg-title { + float: none; + width: auto; + } + + .blerg-controls { + float: none; + text-align: left; + margin: 1em 0 0 0; + } + + .blerg-controls-greeting { + margin: 1em 8px; + } + + .blerg-controls-toolbar { + position: static; + margin: 1em 8px; + } + + .blerg-controls-toolbar .onyx-button { + display: block; + width: 100%; + margin: 8px 0; + } + + .blerg-controls .login { + display: block; + width: auto; + margin: 1em 0; + } +} + .feed-button.new { background-color: #E4C010; } diff --git a/www/jssrc/blerg/Controls.js b/www/jssrc/blerg/Controls.js index 529df1e..f386627 100644 --- a/www/jssrc/blerg/Controls.js +++ b/www/jssrc/blerg/Controls.js @@ -28,7 +28,7 @@ enyo.kind({ ]} ]}, {name: "loggedInControls", showing: false, components: [ - {name: "greeting", components: [ + {name: "greeting", classes: "blerg-controls-greeting", components: [ {tag: null, content: "Hello, "}, {name: "userlink", tag: "a"}, {tag: null, content: ". "}, diff --git a/www/jssrc/blerg/Title.js b/www/jssrc/blerg/Title.js index a8282fb..17d62a2 100644 --- a/www/jssrc/blerg/Title.js +++ b/www/jssrc/blerg/Title.js @@ -1,7 +1,7 @@ enyo.kind({ name: "blerg.Title", kind: "Control", - style: "float: left; width: 40%;", + classes: "blerg-title", published: { section: "" },