diff --git a/app.js b/app.js
index 2eb467a..b66fdac 100644
--- a/app.js
+++ b/app.js
@@ -10,6 +10,7 @@ const Sidebar = require('./components/sidebar.js')
const Info = require('./components/info.js')
const Chat = require('./components/chat.js')
+const Input = require('./components/input.js')
let backend = new Matrix("user", "pass", "http://localhost")
@@ -23,6 +24,7 @@ let App = create({
+
>
)
diff --git a/public/scss/style.scss b/public/scss/style.scss
index fc14840..d13490b 100644
--- a/public/scss/style.scss
+++ b/public/scss/style.scss
@@ -13,6 +13,7 @@ html, body {
padding: 0;
background: $bg;
color: white;
+ font-family: monospace;
}
body {
@@ -79,20 +80,21 @@ body {
}
.roomListItem {
+ $height: 1.5rem;
#avatar {
- line-height: 2rem;
- height: 2rem;
- width: 2rem;
+ line-height: $height;
+ height: $height;
+ width: $height;
vertical-align: middle;
object-fit: cover;
}
#name {
- height: 2rem;
- line-height: 2rem;
- font-size: 1.2rem;
- vertical-align: top;
+ height: $height;
+ line-height: $height;
+ vertical-align: middle;
padding-left: $spacing;
+ font-size: 1rem;
}
}
@@ -108,4 +110,13 @@ body {
.input {
background: $bg1;
+ display: flex;
+
+ input {
+ background: transparent;
+ box-sizing: border-box;
+ flex: 1 1 auto;
+ padding: $spacing;
+ font-size: 1.2rem;
+ }
}