Allow to set item notes below or above the files

modules/webapp/src/main/elm/Comp/ItemDetail/View.elm

@@ -65,11 +65,20 @@ view inav settings model =
                 ]
               <|
                 List.concat
-                    [ [ renderAttachmentsTabMenu model
+                    [ if settings.itemDetailNotesPosition == Data.UiSettings.Top then
+                        [ renderNotes model ]
+
+                      else
+                        []
+                    , [ renderAttachmentsTabMenu model
                       ]
                     , renderAttachmentsTabBody settings model
-                    , [ renderNotes model ]
                     , renderIdInfo model
+                    , if settings.itemDetailNotesPosition == Data.UiSettings.Bottom then
+                        [ renderNotes model ]
+
+                      else
+                        []
                     ]
             ]
         ]
@@ -166,15 +175,22 @@ actionInputDatePicker =
 
 renderIdInfo : Model -> List (Html msg)
 renderIdInfo model =
-    [ div [ class "ui center aligned container" ]
-        [ span [ class "small-info" ]
-            [ text model.item.id
-            , text " • "
-            , text "Created: "
-            , Util.Time.formatDateTime model.item.created |> text
-            , text " • "
-            , text "Updated: "
-            , Util.Time.formatDateTime model.item.updated |> text
+    [ div [ class "ui bottom attached segment" ]
+        [ div [ class "ui center aligned container" ]
+            [ div [ class "ui bulleted mini horizontal list small-info" ]
+                [ div [ class "item" ]
+                    [ i [ class "bullseye icon" ] []
+                    , text model.item.id
+                    ]
+                , div [ class "item" ]
+                    [ i [ class "sun outline icon" ] []
+                    , Util.Time.formatDateTime model.item.created |> text
+                    ]
+                , div [ class "item" ]
+                    [ i [ class "pencil alternate icon" ] []
+                    , Util.Time.formatDateTime model.item.updated |> text
+                    ]
+                ]
             ]
         ]
     ]
@@ -224,7 +240,7 @@ renderNotes model =
                                 [ text "Notes"
                                 ]
                             ]
-                        , div [ class "twelve wide center aligned column" ]
+                        , div [ class "eleven wide center aligned column" ]
                             [ div [ class "ui horizontal bulleted link list" ]
                                 [ Html.map NotesEditMsg
                                     (Comp.MarkdownInput.viewEditLink classes mm)
@@ -234,16 +250,9 @@ renderNotes model =
                                     (Comp.MarkdownInput.viewSplitLink classes mm)
                                 ]
                             ]
-                        , div [ class "right aligned two wide column" ]
-                            [ a
-                                [ classList
-                                    [ ( "ui basic icon link", True )
-                                    , ( "invisible hidden", Util.String.isNothingOrBlank model.item.notes )
-                                    ]
-                                , onClick ToggleEditNotes
-                                , href "#"
-                                ]
-                                [ i [ class "cancel icon" ] []
+                        , div [ class "right aligned three wide column" ]
+                            [ div [ class "ui horizontal link list" ]
+                                [ Comp.MarkdownInput.viewCheatLink "item" mm
                                 ]
                             ]
                         ]
@@ -675,14 +684,16 @@ renderTags settings model =
 
 renderEditMenu : UiSettings -> Model -> List (Html Msg)
 renderEditMenu settings model =
-    [ renderEditButtons model
-    , renderEditForm settings model
+    [ div [ class "ui segments" ]
+        [ renderEditButtons model
+        , renderEditForm settings model
+        ]
     ]
 
 
 renderEditButtons : Model -> Html Msg
 renderEditButtons model =
-    div [ class "ui top attached segment" ]
+    div [ class "ui segment" ]
         [ button
             [ classList
                 [ ( "ui primary button", True )
@@ -723,7 +734,7 @@ renderEditForm settings model =
                 [ i [ class "grey plus link icon" ] []
                 ]
     in
-    div [ class "ui attached segment" ]
+    div [ class "ui segment" ]
         [ div [ class "ui form warning" ]
             [ div [ class "field" ]
                 [ label []

modules/webapp/src/main/elm/Comp/UiSettingsForm.elm

@@ -12,7 +12,7 @@ import Comp.ColorTagger
 import Comp.IntField
 import Data.Color exposing (Color)
 import Data.Flags exposing (Flags)
-import Data.UiSettings exposing (UiSettings)
+import Data.UiSettings exposing (Pos(..), UiSettings)
 import Dict exposing (Dict)
 import Html exposing (..)
 import Html.Attributes exposing (..)
@@ -29,6 +29,7 @@ type alias Model =
     , nativePdfPreview : Bool
     , itemSearchNoteLength : Maybe Int
     , searchNoteLengthModel : Comp.IntField.Model
+    , itemDetailNotesPosition : Pos
     }
 
 
@@ -54,6 +55,7 @@ init flags settings =
                 (Just flags.config.maxNoteLength)
                 False
                 "Max. Note Length"
+      , itemDetailNotesPosition = settings.itemDetailNotesPosition
       }
     , Api.getTags flags "" GetTagsResp
     )
@@ -65,6 +67,7 @@ type Msg
     | GetTagsResp (Result Http.Error TagList)
     | TogglePdfPreview
     | NoteLengthMsg Comp.IntField.Msg
+    | SetNotesPosition Pos
 
 
 
@@ -106,6 +109,17 @@ update sett msg model =
             in
             ( model_, nextSettings )
 
+        SetNotesPosition pos ->
+            let
+                model_ =
+                    { model | itemDetailNotesPosition = pos }
+            in
+            if model_.itemDetailNotesPosition == sett.itemDetailNotesPosition then
+                ( model_, Nothing )
+
+            else
+                ( model_, Just { sett | itemDetailNotesPosition = model_.itemDetailNotesPosition } )
+
         TagColorMsg lm ->
             let
                 ( m_, d_ ) =
@@ -207,6 +221,31 @@ view flags _ model =
                     ]
                 ]
             ]
+        , div [ class "grouped fields" ]
+            [ label [] [ text "Position of item notes" ]
+            , div [ class "field" ]
+                [ div [ class "ui radio checkbox" ]
+                    [ input
+                        [ type_ "radio"
+                        , checked (model.itemDetailNotesPosition == Top)
+                        , onCheck (\_ -> SetNotesPosition Top)
+                        ]
+                        []
+                    , label [] [ text "Top" ]
+                    ]
+                ]
+            , div [ class "field" ]
+                [ div [ class "ui radio checkbox" ]
+                    [ input
+                        [ type_ "radio"
+                        , checked (model.itemDetailNotesPosition == Bottom)
+                        , onCheck (\_ -> SetNotesPosition Bottom)
+                        ]
+                        []
+                    , label [] [ text "Bottom" ]
+                    ]
+                ]
+            ]
         , div [ class "ui dividing header" ]
             [ text "Tag Category Colors"
             ]

modules/webapp/src/main/elm/Data/UiSettings.elm

@@ -1,9 +1,12 @@
 module Data.UiSettings exposing
-    ( StoredUiSettings
+    ( Pos(..)
+    , StoredUiSettings
     , UiSettings
     , defaults
     , merge
     , mergeDefaults
+    , posFromString
+    , posToString
     , tagColor
     , tagColorString
     , toStoredUiSettings
@@ -27,6 +30,7 @@ type alias StoredUiSettings =
     , tagCategoryColors : List ( String, String )
     , nativePdfPreview : Bool
     , itemSearchNoteLength : Maybe Int
+    , itemDetailNotesPosition : Maybe String
     }
 
 
@@ -42,15 +46,45 @@ type alias UiSettings =
     , tagCategoryColors : Dict String Color
     , nativePdfPreview : Bool
     , itemSearchNoteLength : Int
+    , itemDetailNotesPosition : Pos
     }
 
 
+type Pos
+    = Top
+    | Bottom
+
+
+posToString : Pos -> String
+posToString pos =
+    case pos of
+        Top ->
+            "top"
+
+        Bottom ->
+            "bottom"
+
+
+posFromString : String -> Maybe Pos
+posFromString str =
+    case str of
+        "top" ->
+            Just Top
+
+        "bottom" ->
+            Just Bottom
+
+        _ ->
+            Nothing
+
+
 defaults : UiSettings
 defaults =
     { itemSearchPageSize = 60
     , tagCategoryColors = Dict.empty
     , nativePdfPreview = False
     , itemSearchNoteLength = 0
+    , itemDetailNotesPosition = Top
     }
 
 
@@ -69,6 +103,9 @@ merge given fallback =
     , nativePdfPreview = given.nativePdfPreview
     , itemSearchNoteLength =
         choose given.itemSearchNoteLength fallback.itemSearchNoteLength
+    , itemDetailNotesPosition =
+        choose (Maybe.andThen posFromString given.itemDetailNotesPosition)
+            fallback.itemDetailNotesPosition
     }
 
 
@@ -85,6 +122,7 @@ toStoredUiSettings settings =
             |> Dict.toList
     , nativePdfPreview = settings.nativePdfPreview
     , itemSearchNoteLength = Just settings.itemSearchNoteLength
+    , itemDetailNotesPosition = Just (posToString settings.itemDetailNotesPosition)
     }
 
 

modules/webapp/src/main/webjar/docspell.css

@@ -122,7 +122,7 @@ textarea.markdown-editor {
     max-height: 300px;
     width: 100%;
     border: 0;
-    min-height: 10em;
+    min-height: 5em;
 }
 
 .default-layout .job-log {