diff options
| author | Jan Tuomi <jan.tuomi@valuemotive.com> | 2021-11-04 16:39:54 +0200 |
|---|---|---|
| committer | Jan Tuomi <jan.tuomi@valuemotive.com> | 2021-11-04 16:39:54 +0200 |
| commit | 69d48eb332ac53104cf57b408059a103151071fb (patch) | |
| tree | a24b0ccbf03a31762e00b4adf5d9131cff7cc534 /src/Pages/Feed.elm | |
| parent | e329e6f3afeca8657ac8dbc8fb7f48a6f19d9522 (diff) | |
Add images to posts
Diffstat (limited to 'src/Pages/Feed.elm')
| -rw-r--r-- | src/Pages/Feed.elm | 37 |
1 files changed, 28 insertions, 9 deletions
diff --git a/src/Pages/Feed.elm b/src/Pages/Feed.elm index 73875a3..53f60a2 100644 --- a/src/Pages/Feed.elm +++ b/src/Pages/Feed.elm @@ -17,9 +17,7 @@ styles = css [ margin2 (px 10) auto ] , postList = css - [ overflow scroll - , maxHeight (vh 70) - , marginBottom (px 10) + [ marginBottom (px 10) ] , post = css @@ -27,6 +25,10 @@ styles = , backgroundColor (hex "#eee") , marginBottom (px 10) ] + , postImage = + css + [ marginBottom (px 20) + ] , postProfilePicture = css [ width (px 40) @@ -59,6 +61,15 @@ styles = postDiv : Time.Posix -> Post -> Html Msg postDiv now post = + let + imageElem = + case post.imageUrl of + Just url -> + img [ styles.postImage, src url ] [] + + Nothing -> + text "" + in div [ styles.post ] [ span [] @@ -70,8 +81,9 @@ postDiv now post = ] ] , p [] [ text post.content ] + , imageElem , span [] - [ button [ styles.postLikeButton, onClick (LikePost post) ] [ text "❤️ Like" ] + [ button [ styles.postLikeButton, onClick (LikePost post) ] [ text "👏 Clap" ] , text <| String.fromInt post.likes ] ] @@ -104,8 +116,15 @@ composeDiv model = [ input [ styles.composeInput , placeholder "Type a new post..." - , onInput ComposeInputChanged - , value model.composeInputValue + , onInput ComposeTextInputChanged + , value model.composeTextInputValue + ] + [] + , input + [ styles.composeInput + , placeholder "Image URL (optional)" + , onInput ComposeImageInputChanged + , value model.composeImageInputValue ] [] , button [ type_ "submit" ] [ text "➡️" ] @@ -115,15 +134,15 @@ composeDiv model = headerSection : Model -> Html msg headerSection _ = header [] - [ h1 [] [ text "Shoob book" ] + [ h1 [] [ text "😎 SOMEBOOK" ] ] mainSection : Model -> Html Msg mainSection model = main_ [] <| - [ postsDiv model - , composeDiv model + [ composeDiv model + , postsDiv model ] |