restyle

lib/memex_web/components/topbar.ex

@@ -13,12 +13,12 @@ defmodule MemexWeb.Components.Topbar do
       %{results: [], title_content: nil, flash: nil, current_user: nil} |> Map.merge(assigns)
 
     ~H"""
-    <nav role="navigation" class="mb-8 px-8 py-4 w-full bg-primary-400">
+    <nav role="navigation" class="mb-8 px-8 py-4 w-full bg-primary-900 text-primary-400">
       <div class="flex flex-col sm:flex-row justify-between items-center">
         <div class="mb-4 sm:mb-0 sm:mr-8 flex flex-row justify-start items-center space-x-2">
-          <%= live_redirect("Memex",
+          <%= live_redirect("memex",
             to: Routes.live_path(Endpoint, HomeLive),
-            class: "mx-2 my-1 leading-5 text-xl text-white hover:underline"
+            class: "mx-2 my-1 leading-5 text-xl text-primary-400 hover:underline"
           ) %>
 
           <%= if @title_content do %>
@@ -32,8 +32,29 @@ defmodule MemexWeb.Components.Topbar do
         <hr class="mb-2 sm:hidden hr-light" />
 
         <ul class="flex flex-row flex-wrap justify-center items-center
-          text-lg text-white text-ellipsis">
+          text-lg text-primary-400 text-ellipsis">
           <%= if @current_user do %>
+            <li class="mx-2 my-1">
+              <%= live_redirect(gettext("Pipelines"),
+                to: Routes.pipeline_index_path(Endpoint, :index),
+                class: "text-primary-400 text-primary-400 hover:underline truncate"
+              ) %>
+            </li>
+
+            <li class="mx-2 my-1">
+              <%= live_redirect(gettext("Contexts"),
+                to: Routes.context_index_path(Endpoint, :index),
+                class: "text-primary-400 text-primary-400 hover:underline truncate"
+              ) %>
+            </li>
+
+            <li class="mx-2 my-1">
+              <%= live_redirect(gettext("Notes"),
+                to: Routes.note_index_path(Endpoint, :index),
+                class: "text-primary-400 text-primary-400 hover:underline truncate"
+              ) %>
+            </li>
+
             <form phx-change="suggest" phx-submit="search">
               <input
                 type="text"
@@ -51,20 +72,23 @@ defmodule MemexWeb.Components.Topbar do
                 <% end %>
               </datalist>
             </form>
+
             <%= if @current_user.role == :admin do %>
               <li class="mx-2 my-1">
                 <%= live_redirect(gettext("Invites"),
                   to: Routes.invite_index_path(Endpoint, :index),
-                  class: "text-white text-white hover:underline"
+                  class: "text-primary-400 text-primary-400 hover:underline"
                 ) %>
               </li>
             <% end %>
+
             <li class="mx-2 my-1">
               <%= live_redirect(@current_user.email,
                 to: Routes.user_settings_path(Endpoint, :edit),
-                class: "text-white text-white hover:underline truncate"
+                class: "text-primary-400 text-primary-400 hover:underline truncate"
               ) %>
             </li>
+
             <li class="mx-2 my-1">
               <%= link to: Routes.user_session_path(Endpoint, :delete),
                    method: :delete,
@@ -72,10 +96,11 @@ defmodule MemexWeb.Components.Topbar do
                 <i class="fas fa-sign-out-alt"></i>
               <% end %>
             </li>
+
             <%= if @current_user.role == :admin and function_exported?(Routes, :live_dashboard_path, 2) do %>
               <li class="mx-2 my-1">
                 <%= live_redirect to: Routes.live_dashboard_path(Endpoint, :home),
-                  class: "text-white text-white hover:underline" do %>
+                  class: "text-primary-400 text-primary-400 hover:underline" do %>
                   <i class="fas fa-gauge"></i>
                 <% end %>
               </li>
@@ -85,14 +110,15 @@ defmodule MemexWeb.Components.Topbar do
               <li class="mx-2 my-1">
                 <%= live_redirect(dgettext("actions", "Register"),
                   to: Routes.user_registration_path(Endpoint, :new),
-                  class: "text-white text-white hover:underline truncate"
+                  class: "text-primary-400 text-primary-400 hover:underline truncate"
                 ) %>
               </li>
             <% end %>
+
             <li class="mx-2 my-1">
               <%= live_redirect(dgettext("actions", "Log in"),
                 to: Routes.user_session_path(Endpoint, :new),
-                class: "text-white text-white hover:underline truncate"
+                class: "text-primary-400 text-primary-400 hover:underline truncate"
               ) %>
             </li>
           <% end %>

lib/memex_web/live/home_live.html.heex

@@ -1,9 +1,77 @@
 <div class="flex flex-col justify-center items-center text-center space-y-4">
-  <h1 class="title text-primary-500 text-2xl">
+  <h1 class="title text-primary-400 text-2xl">
     <%= gettext("memex") %>
   </h1>
 
-  <p class="title  text-primary-500 text-lg">
-    <%= gettext("filling this out later") %>
-  </p>
+  <hr class="hr" />
+
+  <ul class="flex flex-col space-y-4 text-center">
+    <li class="flex flex-col justify-center items-center
+      space-y-2">
+      <b class="whitespace-nowrap">
+        <%= gettext("Notes:") %>
+      </b>
+      <p>
+        <%= gettext("Document notes about individual items or concepts") %>
+      </p>
+    </li>
+
+    <li class="flex flex-col justify-center items-center
+      space-y-2">
+      <b class="whitespace-nowrap">
+        <%= gettext("Contexts:") %>
+      </b>
+      <p>
+        <%= gettext("Provide context around a single topic and hotlink to your notes") %>
+      </p>
+    </li>
+
+    <li class="flex flex-col justify-center items-center
+      space-y-2">
+      <b class="whitespace-nowrap">
+        <%= gettext("Pipelines:") %>
+      </b>
+      <p>
+        <%= gettext("Document your processes, attaching contexts to each step") %>
+      </p>
+    </li>
+  </ul>
+
+  <hr class="hr" />
+
+  <ul class="flex flex-col space-y-4 text-center">
+    <h2 class="title text-primary-400 text-lg">
+      <%= gettext("Features") %>
+    </h2>
+
+    <li class="flex flex-col justify-center items-center
+      space-y-2">
+      <b class="whitespace-nowrap">
+        <%= gettext("Multi-user:") %>
+      </b>
+      <p>
+        <%= gettext("Built with sharing and collaboration in mind") %>
+      </p>
+    </li>
+
+    <li class="flex flex-col justify-center items-center
+      space-y-2">
+      <b class="whitespace-nowrap">
+        <%= gettext("Privacy:") %>
+      </b>
+      <p>
+        <%= gettext("Privacy controls on a per-note, context or pipeline basis") %>
+      </p>
+    </li>
+
+    <li class="flex flex-col justify-center items-center
+      space-y-2">
+      <b class="whitespace-nowrap">
+        <%= gettext("Convenient:") %>
+      </b>
+      <p>
+        <%= gettext("Accessible from any internet-capable device") %>
+      </p>
+    </li>
+  </ul>
 </div>

lib/memex_web/live/invite_live/form_component.html.heex

@@ -1,5 +1,5 @@
 <div>
-  <h2 class="mb-8 text-center title text-xl text-primary-600">
+  <h2 class="mb-8 text-center title text-xl text-primary-400">
     <%= @title %>
   </h2>
   <.form
@@ -17,11 +17,11 @@
       </div>
     <% end %>
 
-    <%= label(f, :name, gettext("Name"), class: "title text-lg text-primary-600") %>
+    <%= label(f, :name, gettext("Name"), class: "title text-lg text-primary-400") %>
     <%= text_input(f, :name, class: "input input-primary col-span-2") %>
     <%= error_tag(f, :name, "col-span-3") %>
 
-    <%= label(f, :uses_left, gettext("Uses left"), class: "title text-lg text-primary-600") %>
+    <%= label(f, :uses_left, gettext("Uses left"), class: "title text-lg text-primary-400") %>
     <%= number_input(f, :uses_left, min: 0, class: "input input-primary col-span-2") %>
     <%= error_tag(f, :uses_left, "col-span-3") %>
 

lib/memex_web/live/invite_live/index.html.heex

@@ -4,7 +4,7 @@
   </h1>
 
   <%= if @invites |> Enum.empty?() do %>
-    <h1 class="title text-xl text-primary-600">
+    <h1 class="title text-xl text-primary-400">
       <%= gettext("No invites 😔") %>
     </h1>
 
@@ -34,13 +34,13 @@
           </form>
         </:code_actions>
         <%= live_patch to: Routes.invite_index_path(Endpoint, :edit, invite),
-                   class: "text-primary-600 link",
+                   class: "text-primary-400 link",
                    data: [qa: "edit-#{invite.id}"] do %>
           <i class="fa-fw fa-lg fas fa-edit"></i>
         <% end %>
 
         <%= link to: "#",
-             class: "text-primary-600 link",
+             class: "text-primary-400 link",
              phx_click: "delete_invite",
              phx_value_id: invite.id,
              data: [
@@ -85,7 +85,7 @@
   <%= unless @admins |> Enum.empty?() do %>
     <hr class="hr" />
 
-    <h1 class="title text-2xl text-primary-600">
+    <h1 class="title text-2xl text-primary-400">
       <%= gettext("Admins") %>
     </h1>
 
@@ -93,7 +93,7 @@
       <%= for admin <- @admins do %>
         <.user_card user={admin}>
           <%= link to: "#",
-               class: "text-primary-600 link",
+               class: "text-primary-400 link",
                phx_click: "delete_user",
                phx_value_id: admin.id,
                data: [
@@ -114,7 +114,7 @@
   <%= unless @users |> Enum.empty?() do %>
     <hr class="hr" />
 
-    <h1 class="title text-2xl text-primary-600">
+    <h1 class="title text-2xl text-primary-400">
       <%= gettext("Users") %>
     </h1>
 
@@ -122,7 +122,7 @@
       <%= for user <- @users do %>
         <.user_card user={user}>
           <%= link to: "#",
-               class: "text-primary-600 link",
+               class: "text-primary-400 link",
                phx_click: "delete_user",
                phx_value_id: user.id,
                data: [

lib/memex_web/router.ex

@@ -93,14 +93,18 @@ defmodule MemexWeb.Router do
     scope "/", MemexWeb do
       pipe_through [:browser, :require_authenticated_user, :require_admin]
 
-      live_dashboard "/dashboard", metrics: MemexWeb.Telemetry, ecto_repos: [Memex.Repo]
-
       live "/invites", InviteLive.Index, :index
       live "/invites/new", InviteLive.Index, :new
       live "/invites/:id/edit", InviteLive.Index, :edit
     end
   end
 
+  scope "/", MemexWeb do
+    pipe_through [:browser, :require_authenticated_user, :require_admin]
+
+    live_dashboard "/dashboard", metrics: MemexWeb.Telemetry, ecto_repos: [Memex.Repo]
+  end
+
   scope "/", MemexWeb do
     pipe_through [:browser]
 

lib/memex_web/templates/error/error.html.heex

@@ -18,13 +18,13 @@
 
     <div class="pb-8 w-full flex flex-col justify-center items-center text-center">
       <div class="p-8 sm:p-16 w-full flex flex-col justify-center items-center space-y-4 max-w-3xl">
-        <h1 class="title text-primary-600 text-3xl">
+        <h1 class="title text-primary-400 text-3xl">
           <%= @error_string %>
         </h1>
 
         <hr class="w-full hr" />
 
-        <a href={Routes.live_path(Endpoint, HomeLive)} class="link title text-primary-600 text-lg">
+        <a href={Routes.live_path(Endpoint, HomeLive)} class="link title text-primary-400 text-lg">
           <%= dgettext("errors", "Go back home") %>
         </a>
       </div>

lib/memex_web/templates/layout/live.html.heex

@@ -29,26 +29,26 @@
 
 <div
   id="loading"
-  class="fixed opacity-0 top-0 left-0 w-screen h-screen bg-white z-50
+  class="fixed opacity-0 top-0 left-0 w-screen h-screen bg-primary-900 z-50
   flex flex-col justify-center items-center space-y-4
   transition-opacity ease-in-out duration-500"
 >
-  <h1 class="title text-2xl title-primary-500 text-primary-500">
+  <h1 class="title text-2xl title-primary-500 text-primary-400">
     <%= gettext("Loading...") %>
   </h1>
 
-  <i class="fas fa-3x fa-spin fa-gear text-primary-500"></i>
+  <i class="fas fa-3x fa-spin fa-gear text-primary-400"></i>
 </div>
 
 <div
   id="disconnect"
-  class="fixed opacity-0 top-0 left-0 w-screen h-screen bg-white z-50
+  class="fixed opacity-0 top-0 left-0 w-screen h-screen bg-primary-900 z-50
   flex flex-col justify-center items-center space-y-4
   transition-opacity ease-in-out duration-500"
 >
-  <h1 class="title text-2xl title-primary-500 text-primary-500">
+  <h1 class="title text-2xl title-primary-500 text-primary-400">
     <%= gettext("Reconnecting...") %>
   </h1>
 
-  <i class="fas fa-3x fa-fade fa-satellite-dish text-primary-500"></i>
+  <i class="fas fa-3x fa-fade fa-satellite-dish text-primary-400"></i>
 </div>

lib/memex_web/templates/layout/root.html.heex

@@ -5,8 +5,8 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <%= csrf_meta_tag() %>
-    <%= if(assigns |> Map.has_key?(:page_title), do: @page_title, else: "Memex")
-    |> live_title_tag(suffix: " | Memex") %>
+    <%= if(assigns |> Map.has_key?(:page_title), do: @page_title, else: "memex")
+    |> live_title_tag(suffix: " | memex") %>
     <link phx-track-static rel="stylesheet" href={Routes.static_path(@conn, "/css/app.css")} />
     <script
       defer
@@ -17,7 +17,7 @@
     </script>
   </head>
 
-  <body class="m-0 p-0 w-full h-full">
+  <body class="m-0 p-0 w-full h-full bg-primary-800 text-primary-400 subpixel-antialiased">
     <%= @inner_content %>
   </body>
 </html>

lib/memex_web/templates/user_confirmation/new.html.heex

@@ -1,5 +1,5 @@
 <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center space-y-4">
-  <h1 class="title text-primary-600 text-xl">
+  <h1 class="title text-primary-400 text-xl">
     <%= dgettext("actions", "Resend confirmation instructions") %>
   </h1>
 
@@ -9,7 +9,7 @@
     action={Routes.user_confirmation_path(@conn, :create)}
     class="flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
   >
-    <%= label(f, :email, class: "title text-lg text-primary-600") %>
+    <%= label(f, :email, class: "title text-lg text-primary-400") %>
     <%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %>
 
     <%= submit(dgettext("actions", "Resend confirmation instructions"),

lib/memex_web/templates/user_registration/new.html.heex

@@ -1,5 +1,5 @@
 <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center space-y-4">
-  <h1 class="title text-primary-600 text-xl">
+  <h1 class="title text-primary-400 text-xl">
     <%= dgettext("actions", "Register") %>
   </h1>
 
@@ -21,15 +21,15 @@
       <%= hidden_input(f, :invite_token, value: @invite.token) %>
     <% end %>
 
-    <%= label(f, :email, class: "title text-lg text-primary-600") %>
+    <%= label(f, :email, class: "title text-lg text-primary-400") %>
     <%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %>
     <%= error_tag(f, :email, "col-span-3") %>
 
-    <%= label(f, :password, class: "title text-lg text-primary-600") %>
+    <%= label(f, :password, class: "title text-lg text-primary-400") %>
     <%= password_input(f, :password, required: true, class: "input input-primary col-span-2") %>
     <%= error_tag(f, :password, "col-span-3") %>
 
-    <%= label(f, :locale, gettext("Language"), class: "title text-lg text-primary-600") %>
+    <%= label(f, :locale, gettext("Language"), class: "title text-lg text-primary-400") %>
     <%= select(
       f,
       :locale,

lib/memex_web/templates/user_reset_password/edit.html.heex

@@ -1,5 +1,5 @@
 <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center space-y-4">
-  <h1 class="title text-primary-600 text-xl">
+  <h1 class="title text-primary-400 text-xl">
     <%= dgettext("actions", "Reset password") %>
   </h1>
 
@@ -17,12 +17,12 @@
       </div>
     <% end %>
 
-    <%= label(f, :password, "New password", class: "title text-lg text-primary-600") %>
+    <%= label(f, :password, "New password", class: "title text-lg text-primary-400") %>
     <%= password_input(f, :password, required: true, class: "input input-primary col-span-2") %>
     <%= error_tag(f, :password, "col-span-3") %>
 
     <%= label(f, :password_confirmation, "Confirm new password",
-      class: "title text-lg text-primary-600"
+      class: "title text-lg text-primary-400"
     ) %>
     <%= password_input(f, :password_confirmation,
       required: true,

lib/memex_web/templates/user_reset_password/new.html.heex

@@ -1,5 +1,5 @@
 <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center space-y-4">
-  <h1 class="title text-primary-600 text-xl">
+  <h1 class="title text-primary-400 text-xl">
     <%= dgettext("actions", "Forgot your password?") %>
   </h1>
 
@@ -9,7 +9,7 @@
     action={Routes.user_reset_password_path(@conn, :create)}
     class="flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
   >
-    <%= label(f, :email, class: "title text-lg text-primary-600") %>
+    <%= label(f, :email, class: "title text-lg text-primary-400") %>
     <%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %>
 
     <%= submit(dgettext("actions", "Send instructions to reset password"),

lib/memex_web/templates/user_session/new.html.heex

@@ -1,5 +1,5 @@
 <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center space-y-4">
-  <h1 class="title text-primary-600 text-xl">
+  <h1 class="title text-primary-400 text-xl">
     <%= dgettext("actions", "Log in") %>
   </h1>
 
@@ -18,14 +18,14 @@
       </div>
     <% end %>
 
-    <%= label(f, :email, class: "title text-lg text-primary-600") %>
+    <%= label(f, :email, class: "title text-lg text-primary-400") %>
     <%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %>
 
-    <%= label(f, :password, class: "title text-lg text-primary-600") %>
+    <%= label(f, :password, class: "title text-lg text-primary-400") %>
     <%= password_input(f, :password, required: true, class: "input input-primary col-span-2") %>
 
     <%= label(f, :remember_me, gettext("Keep me logged in for 60 days"),
-      class: "title text-lg text-primary-600"
+      class: "title text-lg text-primary-400"
     ) %>
     <%= checkbox(f, :remember_me, class: "checkbox col-span-2") %>
 

lib/memex_web/templates/user_settings/edit.html.heex

@@ -1,5 +1,5 @@
 <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center text-center space-y-4">
-  <h1 class="pb-4 title text-primary-600 text-xl">
+  <h1 class="pb-4 title text-primary-400 text-xl">
     <%= gettext("Settings") %>
   </h1>
 
@@ -11,7 +11,7 @@
     action={Routes.user_settings_path(@conn, :update)}
     class="flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
   >
-    <h3 class="title text-primary-600 text-lg col-span-3">
+    <h3 class="title text-primary-400 text-lg col-span-3">
       <%= dgettext("actions", "Change email") %>
     </h3>
 
@@ -25,13 +25,13 @@
 
     <%= hidden_input(f, :action, name: "action", value: "update_email") %>
 
-    <%= label(f, :email, class: "title text-lg text-primary-600") %>
+    <%= label(f, :email, class: "title text-lg text-primary-400") %>
     <%= email_input(f, :email, required: true, class: "mx-2 my-1 input input-primary col-span-2") %>
     <%= error_tag(f, :email, "col-span-3") %>
 
     <%= label(f, :current_password, gettext("Current password"),
       for: "current_password_for_email",
-      class: "mx-2 my-1 title text-lg text-primary-600"
+      class: "mx-2 my-1 title text-lg text-primary-400"
     ) %>
     <%= password_input(f, :current_password,
       required: true,
@@ -54,7 +54,7 @@
     action={Routes.user_settings_path(@conn, :update)}
     class="flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
   >
-    <h3 class="title text-primary-600 text-lg col-span-3">
+    <h3 class="title text-primary-400 text-lg col-span-3">
       <%= dgettext("actions", "Change password") %>
     </h3>
 
@@ -68,7 +68,7 @@
 
     <%= hidden_input(f, :action, name: "action", value: "update_password") %>
 
-    <%= label(f, :password, gettext("New password"), class: "title text-lg text-primary-600") %>
+    <%= label(f, :password, gettext("New password"), class: "title text-lg text-primary-400") %>
     <%= password_input(f, :password,
       required: true,
       class: "mx-2 my-1 input input-primary col-span-2"
@@ -76,7 +76,7 @@
     <%= error_tag(f, :password, "col-span-3") %>
 
     <%= label(f, :password_confirmation, gettext("Confirm new password"),
-      class: "title text-lg text-primary-600"
+      class: "title text-lg text-primary-400"
     ) %>
     <%= password_input(f, :password_confirmation,
       required: true,
@@ -86,7 +86,7 @@
 
     <%= label(f, :current_password, gettext("Current password"),
       for: "current_password_for_password",
-      class: "title text-lg text-primary-600"
+      class: "title text-lg text-primary-400"
     ) %>
     <%= password_input(f, :current_password,
       required: true,
@@ -109,7 +109,7 @@
     action={Routes.user_settings_path(@conn, :update)}
     class="flex flex-col space-y-4 justify-center items-center"
   >
-    <h3 class="title text-primary-600 text-lg">
+    <h3 class="title text-primary-400 text-lg">
       <%= dgettext("actions", "Change Language") %>
     </h3>