From: Christopher Allan Webber Date: Sat, 21 Jan 2017 02:48:25 +0000 (-0600) Subject: Chat alignment works "properly", thanks to a hack X-Git-Tag: fosdem-2017~110 X-Git-Url: https://jxself.org/git/?a=commitdiff_plain;h=0ea9e56921f887613da5472f12c1e2ae229cb829;p=mudsync.git Chat alignment works "properly", thanks to a hack --- diff --git a/data/web-static/css/main.css b/data/web-static/css/main.css index 67113ca..f9e9cd0 100644 --- a/data/web-static/css/main.css +++ b/data/web-static/css/main.css @@ -23,24 +23,65 @@ body { border: 0px; margin: 0px; font-family: 'Inconsolata', monospace; + font-size: 12pt; } #stream-metabox { - flex: 1; + flex-direction: column; + display: flex; min-height: 85vh; max-height: 85vh; background-color: #d5d5d5; - padding: 10px; - overflow-y: scroll; + padding-left: 15px; + padding-right: 15px; + padding-bottom: 0px; + padding-top: 0px; + overflow-y: auto; +} + +/* + Alignment hack: + http://stackoverflow.com/a/37515194 +*/ +#stream-metabox > :first-child { + margin-top: auto !important; +} + +#stream { + background-color: #fbfbfb; + padding-bottom: .25em; } + +.stream-entry { + background-color: #fdfdfd; + padding-left: 5px; + padding-right: 5px; + padding-top: 0px; + padding-bottom: 0px; + border-left-style: solid; + border-left-width: 2px; + border-left-color: #7b7b7b; + margin-top: .5em; + margin-bottom: 0px; + margin-left: -2px; + margin-right: 0px; +} + +.stream-entry p { + margin-top: .25em; + margin-bottom: 0px; +} + + + #input-metabox { flex: 1; min-height: 15vh; max-height: 15vh; background-color: #414141; color: #d5d5d5; - padding: 10px; + padding: 15px; } input { @@ -52,4 +93,6 @@ input { background-color: #ffffff; padding: 5px; width: 75%; -} \ No newline at end of file + font-family: 'Inconsolata', monospace; + font-size: 12pt; +} diff --git a/mudsync/networking.scm b/mudsync/networking.scm index e553e01..4417cfd 100644 --- a/mudsync/networking.scm +++ b/mudsync/networking.scm @@ -210,17 +210,16 @@ (define (view:main-display request body) (define one-entry - '(div (@ (class "stream-entry")) - (p "This is an entry!") - (p "Let's try a few paragraphs") - (p "okay?"))) + '(div (@ (class "stream-entry")) + (p (b "") " Wow, it's so shiny!"))) (define body-tmpl `((div (@ (id "stream-metabox")) (div (@ (id "stream")) - ,@(map (const one-entry) (iota 10)))) + ,@(map (const one-entry) (iota 25)) + (div (@ (class "stream-entry")) + (p (b "") " Last one!")))) (div (@ (id "input-metabox")) - (p "test test") (input (@ (id "input")))))) (define (main-tmpl)