X-Git-Url: http://git.bytex64.net/?a=blobdiff_plain;f=www%2Fcss%2Fblerg.css;h=45a553fdc8b26b8437db9fc7e435f11e75df7965;hb=9898ecd58827583ea997e1ea473dec0e183bf8dd;hp=22300147da51e102ae5f1dfb7ae199a5a003291c;hpb=55431b133192e59138a51591d7ef4ef20b6ceb52;p=blerg.git diff --git a/www/css/blerg.css b/www/css/blerg.css index 2230014..45a553f 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 { @@ -37,36 +38,51 @@ a > img { text-shadow: black 0px 2px; } -.blerg-header a { - color: inherit; +.blerg-header h1 a { text-decoration: none; } -.blerg-header a:hover { +.blerg-header h1 a:hover { text-decoration: underline; } +.blerg-header a { + color: inherit; +} + .blerg-header h2 { margin: 0; font-size: 28px; text-shadow: black 0px 1px; } +.blerg-header .onyx-input, .blerg-header .onyx-textarea { + color: white; +} + +.blerg-header .onyx-focused > .onyx-input, .blerg-header .onyx-focused > .onyx-textarea { + 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 { @@ -74,6 +90,44 @@ 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; +} + .spew-button { color: #333; background-color: #0D0; @@ -101,6 +155,25 @@ h1, h2, h3 { padding: 15pt 15pt 20pt 15pt; } +.signup-button { + font-size: 40pt; + padding: 1em; + background-color: #C0F; + color: #F88; +} + +@media screen and (max-width: 800px) { + .signup-button { + font-size: 20pt; + } +} + +@media screen and (max-width: 400px) { + .signup-button { + font-size: 14pt; + } +} + .blerg-main h2 { margin: 8pt 0; } @@ -126,7 +199,7 @@ h1, h2, h3 { .blerg-post .onyx-input-decorator { display: block; - border-color: #CCC; + border-color: #999; margin: 4pt 0; } @@ -155,6 +228,22 @@ h1, h2, h3 { width: 100%; } +.blerg-user-controls { + font-size: 14pt; + text-align: right; +} + +.blerg-user-controls a { + color: inherit; + text-decoration: none; + margin-left: 4pt; +} + +.blerg-user-controls a:hover { + text-decoration: underline; +} + + .record { margin: 8pt 0 24pt 0; font-size: 14pt; @@ -174,31 +263,53 @@ h1, h2, h3 { color: #8F8F8F; } -#navigation { - font-size: small; - color: #8F8F8F; - text-align: right; +.record h1 { + font-size: 18pt; + margin: 1em 0; } -#latest h2 { +.record h2 { font-size: 16pt; + margin: 1em 0; +} + +.record h3 { + font-size: 14pt; + margin: 1em 0; +} + +.record h4 { + font-size: 14pt; + font-weight: normal; + margin: 1em 0; +} + +.record h5 { + font-size: 14pt; + font-weight: normal; + font-style: italic; + margin: 1em 0; } -#latest-tags { +.latest h2 { + font-size: 16pt; +} + +.latest-tags { text-align: center; line-height: 2em; } -#latest-tags a { +.latest-tags a { margin: 0 0.75em; } -#latest-posts { +.latest-posts { height: 184pt; overflow: hidden; } -#latest-posts .record { +.latest-posts .record { font-size: 12pt; margin: 8pt 0; } @@ -207,10 +318,6 @@ h1, h2, h3 { font-weight: bold; } -#usercontrols { - font-weight: bold; -} - .quote { border-left: 2px solid blue; padding-left: 6px; @@ -239,4 +346,24 @@ h1, h2, h3 { .blerg-dialog .onyx-input { width: 100%; + color: white; +} + +.blerg-dialog .onyx-focused > .onyx-input { + color: black; +} + +.blerg-error { + color: red; + font-weight: bold; +} + +table.help td { + padding: 2pt 8pt; +} + +footer { + margin: 15pt; + font-size: small; + color: #333; }