/-  tp=trill-post
/+  ui=trill-ui
/+  kaji
|_  [notes=(list post:tp) =bowl:gall]

++  css  ^~  %-  trip
'''
*{
  box-sizing: border-box;
}
#list{
  width: 20%;
  border-right: 1px solid black;
  & .entry{
    padding: 1rem;
    cursor: pointer;
  }
}
#composer{
  width: 80%;
  & form{
    height: 100%;
    padding: 2rem;
    #inputs{
      height: 100%;
      & input,textarea{
        display: block;
        width: 100%;
        outline: none;
      }
      #top{
        display: flex;
        input[type=text]{
          font-size: 2rem;
          font-weight: 700;
          height: 2rem;
          border: none;
          margin-bottom: 1rem;
          flex-grow: 1;
        }
        input[type=submit]{
          height: 2rem;
          width: fit-content;
        }
      }
      & textarea{
        height: 90%;
        resize: none;
        border: none;
      }
    }
  }
}
'''
++  $
;div
  ;style: {css}
  ;div#list.scroll
    =kaji  "scry"
    =targ  "#inputs"
    ;*  %+  turn  notes  note-preview
  ==
  ;div#composer
    ;form
      =kaji  "poke"
      =action  "save-note"
      ;div#inputs
        ;div#top
          ;input(type "text", value "Title");
          ;input(type "submit", value "Save");
        ==
        ;textarea(name "text")
         ; This is a Markdown note
        ==
      ==
    ==
  ==
==
++  note-preview
|=  n=post:tp
=/  id  (enc:kaji [author.n id.n])
;div.entry
  =path  "/cal/f/note/{id}"
 ; {(trip title.n)}
==
++  note
|=  n=post:tp  ^-  manx
=/  pid-string  (enc:kaji [author.n id.n])
=/  post-text   (content-to-md:ui contents.n)
;div
  ;div#top
    ;input(type "hidden", name "pid", value pid-string);
    ;input(type "text", value (trip title.n));
    ;input(type "submit", value "Save");
  ==
  ;textarea(name "text")
   ; {post-text}
  ==
==
--