diff options
| -rw-r--r-- | static/style.css | 73 | ||||
| -rw-r--r-- | tpls/chat.html | 6 |
2 files changed, 77 insertions, 2 deletions
diff --git a/static/style.css b/static/style.css index 00fe4a4..b08bef5 100644 --- a/static/style.css +++ b/static/style.css @@ -19,8 +19,79 @@ display: table-cell; padding-right: 1ex; font-weight: bold; + text-align: right; } #chatlog li .msg { display: table-cell; -}
\ No newline at end of file +} + +#chatlog li.leave, #chatlog li.join { + color: gray !important; + font-style: italic !important; +} + +h1 { + text-align: center; + font-weight: bold; + font-size: 18pt; + margin: 0; + position: fixed; + top: 0; + left: 0; + right: 0; + border-bottom: 1px solid #28f; + height: 8mm; + background: white; +} + +#buddiescontainer { + position: fixed; + top: 0; + right: 0; + width: 35mm; + margin: 10mm 0 12mm 0; +} + +#buddiescontainer h2 { + font-weight: bold; + font-size: 12pt; +} + +#buddies { + margin: 0; + padding: 0; +} +#buddies li { + margin: 0; + padding: 0; +} + +#chatlog { + margin: 10mm 40mm 12mm 0; +} + +#chatinput { + position: fixed; + bottom: 0; + left: 0; + right: 0; + height: 10mm; + border-top: 1px solid #28f; +} + +#chatinput input { + position: absolute; + top: 0; + left: 0; + right: 20mm; + bottom: 0; +} + +#chatinput button { + position: absolute; + top: 0px; + left: 0px; + height: 8mm; + width: calc(100% - 25mm); +} diff --git a/tpls/chat.html b/tpls/chat.html index 27ad69f..35582c7 100644 --- a/tpls/chat.html +++ b/tpls/chat.html @@ -8,8 +8,12 @@ <link rel="stylesheet" type="text/css" href="/static/style.css" /> </head> <body> + <h1>{{.Roomname}}</h1> - <ul id="buddies"></ul> + <div id="buddiescontainer"> + <h2>Users online</h2> + <ul id="buddies"></ul> + </div> <ul id="chatlog"></ul> <div id="chatinput"> <input type="text" name="chattext" id="chattext"/> |