src/Scylla/Views.elm

@@ -12,9 +12,9 @@ import Svg
 import Svg.Attributes
 import Url.Builder
 import Json.Decode as Decode
-import Html exposing (Html, Attribute, div, input, text, button, div, span, a, h2, table, td, tr, img, textarea)
+import Html exposing (Html, Attribute, div, input, text, button, div, span, a, h2, table, td, tr, img)
-import Html.Attributes exposing (type_, value, href, class, style, src, id, rows)
+import Html.Attributes exposing (type_, value, href, class, style, src, id)
-import Html.Events exposing (onInput, onClick, preventDefaultOn)
+import Html.Events exposing (onInput, onClick, on)
 import Dict
 
 contentRepositoryDownloadUrl : ApiUrl -> String -> String
@@ -125,8 +125,8 @@ joinedRoomView m roomId jr =
             _ -> " are typing..."
         typingWrapper = div [ class "typing-wrapper" ] [ text <| typingText ++ typingSuffix ] 
         messageInput = div [ class "message-wrapper" ]
-            [ textarea
+            [ input
-                [ rows 1
+                [ type_ "text"
                 , onInput <| ChangeRoomText roomId
                 , onEnterKey <| SendRoomText roomId
                 , value <| Maybe.withDefault "" <| Dict.get roomId m.roomText
@@ -146,12 +146,9 @@ joinedRoomView m roomId jr =
 onEnterKey : Msg -> Attribute Msg
 onEnterKey msg =
     let
-        eventDecoder = Decode.map2 (\l r -> (l, r)) (Decode.field "keyCode" Decode.int) (Decode.field "shiftKey" Decode.bool)
+        isEnter code = if code == 13 then Decode.succeed msg else Decode.fail "Not ENTER"
-        msgFor (code, shift) = if code == 13 && not shift then Decode.succeed msg else Decode.fail "Not ENTER"
-        pairTrue v = (v, True)
-        decoder = Decode.map pairTrue <| Decode.andThen msgFor <| eventDecoder
     in
-        preventDefaultOn "keydown" decoder
+        on "keydown" (Decode.andThen isEnter <| Decode.field "keyCode" Decode.int)
 
 iconView : String -> Html Msg
 iconView name =

static/js/markdown.js

@@ -1,4 +1,4 @@
-function setupMarkdownPorts(app) {
+function setupNotificationPorts(app) {
     app.ports.requestMarkdownPort.subscribe(function(data) {
         app.ports.receiveMarkdownPort.send({
             "roomId" : data.roomId,

static/scss/style.scss

@@ -1,4 +1,4 @@
-@import url('https://fonts.googleapis.com/css?family=Open+Sans|Source+Code+Pro');
+@import url('https://fonts.googleapis.com/css?family=Open+Sans');
 $primary-color: #53C0FA;
 $primary-color-highlight: #4298C7;
 $primary-color-light: #9FDBFB;
@@ -28,11 +28,9 @@ body {
     outline: none;
 
     transition: background-color $transition-duration;
-    font-family: inherit;
-    font-size: inherit;
 }
 
-input, textarea {
+input {
     @include input-common();
     background-color: $inactive-input-color;
     color: black;
@@ -127,8 +125,6 @@ div.room-wrapper {
 
 div.typing-wrapper {
     padding: 5px;
-    height: 12px;
-    flex-shrink: 0;
 }
 
 /*
@@ -138,7 +134,7 @@ div.message-wrapper {
     display: flex;
     flex-shrink: 0;
 
-    input, textarea {
+    input {
         flex-grow: 12;   
         margin: 3px;
     }
@@ -192,31 +188,10 @@ div.markdown-wrapper {
     p {
         margin: 0px;
     }
-
-    blockquote {
-        margin: 0px 0px 0px 0px;
-        padding-left: 5px;
-        border-left: 4px solid $primary-color;
-    }
-
-    code {
-        font-family: Iosevka, "Source Code Pro", monospace, 
-    }
-
-    pre code {
-        width: 100%;
-        overflow: auto;
-        display: block;
-        box-sizing: border-box;
-        padding: 10px;
-        background-color: $background-color;
-        border-radius: 3px;
-        box-shadow: inset 0px 0px 5px rgba(0, 0, 0, .15);
-    }
 }
 
 span.sender-wrapper {
-    border-radius: 3px;
+    border-radius: 2px;
     padding-left: 5px;
     padding-right: 5px;
     display: inline-block;