Add a scroll view so that messages can be scrolled without input.
This commit is contained in:
parent
56a2212410
commit
d855467f14
|
@ -108,7 +108,7 @@ joinedRoomView m roomId jr =
|
||||||
]
|
]
|
||||||
|
|
||||||
eventWrapperView : Model -> List (Html Msg) -> Html Msg
|
eventWrapperView : Model -> List (Html Msg) -> Html Msg
|
||||||
eventWrapperView m = table [ class "events-wrapper" ]
|
eventWrapperView m es = div [ class "events-wrapper" ] [ table [ class "events-table" ] es ]
|
||||||
|
|
||||||
eventView : Model -> RoomEvent -> Maybe (Html Msg)
|
eventView : Model -> RoomEvent -> Maybe (Html Msg)
|
||||||
eventView m re =
|
eventView m re =
|
||||||
|
|
|
@ -9,6 +9,10 @@ $inactive-input-color: darken($active-input-color, 3%);
|
||||||
$active-input-border-color: $primary-color;
|
$active-input-border-color: $primary-color;
|
||||||
$inactive-input-border-color: darken($inactive-input-color, 10%);
|
$inactive-input-border-color: darken($inactive-input-color, 10%);
|
||||||
|
|
||||||
|
html, body {
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
font-family: 'Open Sans', sans-serif;
|
font-family: 'Open Sans', sans-serif;
|
||||||
margin: 0px;
|
margin: 0px;
|
||||||
|
@ -81,9 +85,11 @@ div.login-wrapper {
|
||||||
*/
|
*/
|
||||||
div.base-wrapper {
|
div.base-wrapper {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
div {
|
div {
|
||||||
margin: 3px;
|
padding: 3px;
|
||||||
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
|
@ -109,6 +115,9 @@ div.rooms-wrapper {
|
||||||
*/
|
*/
|
||||||
div.room-wrapper {
|
div.room-wrapper {
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
|
display: flex;
|
||||||
|
height: 100%;
|
||||||
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
@ -128,7 +137,12 @@ div.message-wrapper {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
table.events-wrapper {
|
div.events-wrapper {
|
||||||
|
overflow-y: scroll;
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.events-table {
|
||||||
td {
|
td {
|
||||||
padding-left: 5px;
|
padding-left: 5px;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
|
|
Loading…
Reference in New Issue
Block a user