Browse Source

add trix as editor

main
Inhji Y. 10 months ago
parent
commit
ad72758199
  1. 21
      assets/css/app.scss
  2. 1
      assets/js/app.js
  3. 5
      assets/package-lock.json
  4. 3
      assets/package.json
  5. 14
      lib/mirage_web/templates/layout/_header.html.eex
  6. 10
      lib/mirage_web/templates/layout/app.html.eex
  7. 18
      lib/mirage_web/templates/layout/live.html.leex
  8. 4
      lib/mirage_web/templates/note/form.html.eex
  9. 2
      lib/mirage_web/templates/note/index.html.eex
  10. 2
      lib/mirage_web/templates/note/show.html.eex
  11. 2
      priv/repo/migrations/20210108235219_create_notes.exs

21
assets/css/app.scss

@ -1,11 +1,30 @@
/* This file is for your main application css. */
@import "~nprogress/nprogress.css";
@import "~milligram/dist/milligram.css";
@import "~trix/dist/trix.css";
@import "./phoenix";
body {
margin: 0;
padding: 0;
background: #ddd;
font-family: monospace;
font-size: 1rem;
}
header .container,
main .container {
background: white;
padding: 1rem;
}
.right {
text-align: right;
}
nav > ul { margin-bottom: 0; }
input[readonly] {
background: #ddd;
color: #777;
}

1
assets/js/app.js

@ -12,6 +12,7 @@ import "../css/app.scss"
// import {Socket} from "phoenix"
// import socket from "./socket"
//
import "trix"
import "phoenix_html"
import {Socket} from "phoenix"
import NProgress from "nprogress"

5
assets/package-lock.json

@ -7423,6 +7423,11 @@
"integrity": "sha1-WIeWa7WCpFA6QetST301ARgVphM=",
"dev": true
},
"trix": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/trix/-/trix-1.3.1.tgz",
"integrity": "sha512-BbH6mb6gk+AV4f2as38mP6Ucc1LE3OD6XxkZnAgPIduWXYtvg2mI3cZhIZSLqmMh9OITEpOBCCk88IVmyjU7bA=="
},
"true-case-path": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/true-case-path/-/true-case-path-1.0.3.tgz",

3
assets/package.json

@ -11,7 +11,8 @@
"nprogress": "^0.2.0",
"phoenix": "file:../deps/phoenix",
"phoenix_html": "file:../deps/phoenix_html",
"phoenix_live_view": "file:../deps/phoenix_live_view"
"phoenix_live_view": "file:../deps/phoenix_live_view",
"trix": "^1.3.1"
},
"devDependencies": {
"@babel/core": "^7.0.0",

14
lib/mirage_web/templates/layout/_header.html.eex

@ -1,20 +1,20 @@
<header>
<section class="container">
<nav role="navigation" class="row">
<div class="column">
<ul class="row">
<li class="column">
<nav role="navigation">
<div>
<ul>
<li>
<a href="/">Home</a>
</li>
<li class="column">
<li>
<a href="/notes">Notes</a>
</li>
<li class="column">
<li>
<a href="/wiki">Wiki</a>
</li>
</ul>
</div>
<div class="column">
<div>
<%= render "_user_menu.html", assigns %>
</div>
</nav>

10
lib/mirage_web/templates/layout/app.html.eex

@ -1,5 +1,7 @@
<main role="main" class="container">
<p class="alert alert-info" role="alert"><%= get_flash(@conn, :info) %></p>
<p class="alert alert-danger" role="alert"><%= get_flash(@conn, :error) %></p>
<%= @inner_content %>
<main role="main">
<div class="container">
<p class="alert alert-info" role="alert"><%= get_flash(@conn, :info) %></p>
<p class="alert alert-danger" role="alert"><%= get_flash(@conn, :error) %></p>
<%= @inner_content %>
</div>
</main>

18
lib/mirage_web/templates/layout/live.html.leex

@ -1,11 +1,13 @@
<main role="main" class="container">
<p class="alert alert-info" role="alert"
phx-click="lv:clear-flash"
phx-value-key="info"><%= live_flash(@flash, :info) %></p>
<main role="main">
<div class="container">
<p class="alert alert-info" role="alert"
phx-click="lv:clear-flash"
phx-value-key="info"><%= live_flash(@flash, :info) %></p>
<p class="alert alert-danger" role="alert"
phx-click="lv:clear-flash"
phx-value-key="error"><%= live_flash(@flash, :error) %></p>
<p class="alert alert-danger" role="alert"
phx-click="lv:clear-flash"
phx-value-key="error"><%= live_flash(@flash, :error) %></p>
<%= @inner_content %>
<%= @inner_content %>
</div>
</main>

4
lib/mirage_web/templates/note/form.html.eex

@ -5,8 +5,8 @@
</div>
<% end %>
<%= label f, :content %>
<%= text_input f, :content %>
<%= hidden_input f, :content %>
<trix-editor input="note_content"></trix-editor>
<%= error_tag f, :content %>
<div>

2
lib/mirage_web/templates/note/index.html.eex

@ -2,7 +2,7 @@
<%= for note <- @notes do %>
<article>
<p><%= note.content %></p>
<p><%= raw note.content %></p>
<%= render "_note_meta.html", conn: @conn, note: note %>
</article>

2
lib/mirage_web/templates/note/show.html.eex

@ -1,7 +1,7 @@
<h1>Show Note</h1>
<article>
<p><%= @note.content %></p>
<p><%= raw @note.content %></p>
<%= render "_note_meta.html", conn: @conn, note: @note %>
</article>

2
priv/repo/migrations/20210108235219_create_notes.exs

@ -3,7 +3,7 @@ defmodule Mirage.Repo.Migrations.CreateNotes do
def change do
create table(:notes) do
add :content, :string
add :content, :text
timestamps()
end

Loading…
Cancel
Save