aaron_nad/cannery
1
0
Fork 0
forked from shibao/cannery
Code Pull Requests Activity

fix layout

Browse Source
This commit is contained in:
shibao 2022-02-25 21:39:22 -05:00 committed by oliviasculley
parent 95a339fe02
commit c3f5744ad6
13 changed files with 436 additions and 231 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
assets/css/app.scss
View File

@ -10,6 +10,30 @@ $fa-font-path: "@fortawesome/fontawesome-free/webfonts";
@import "components"; @import "components";
/* fix firefox scrollbars */
* {
scrollbar-width: auto;
scrollbar-color: rgba(161, 161, 170, var(--tw-bg-opacity)) white;
}
.fa-fade {
animation: pulse 1s ease-in-out 0s infinite alternate;
}
@keyframes pulse {
0% { scale: 0.95; opacity: 0.5; }
100% { scale: 1.0; opacity: 1; }
}
.phx-connected > #disconnect, #loading {
opacity: 0 !important;
pointer-events: none;
}
.phx-loading:not(.phx-error) > #loading, .phx-error > #disconnect {
opacity: 0.95 !important;
}
/* Alerts and form errors used by phx.new */ /* Alerts and form errors used by phx.new */
.alert { .alert {
padding: 15px; padding: 15px;

22
assets/css/components.scss
View File

@ -1,6 +1,6 @@
@layer components { @layer components {
.input { .input {
@apply rounded-lg px-4 py-2 border; @apply rounded-lg px-4 py-2 border focus:outline-none;
@apply shadow-sm focus:shadow-lg; @apply shadow-sm focus:shadow-lg;
@apply transition-all duration-300 ease-in-out; @apply transition-all duration-300 ease-in-out;
} }
@ -17,6 +17,7 @@
-o-transform: scale(1.5); -o-transform: scale(1.5);
transform: scale(1.5); transform: scale(1.5);
padding: 10px; padding: 10px;
margin: 1em auto;
} }
.title { .title {
@ -31,11 +32,26 @@
.btn-primary { .btn-primary {
@apply bg-primary-500 focus:bg-primary-600 active:bg-primary-600; @apply bg-primary-500 focus:bg-primary-600 active:bg-primary-600;
@apply bg-primary-500 focus:bg-primary-600 active:bg-primary-600; @apply border-primary-500 focus:border-primary-600 active:border-primary-600;
@apply text-white;
}
.btn-alert {
@apply bg-red-600 focus:bg-red-700 active:bg-red-800;
@apply border-red-600 focus:border-red-700 active:border-red-800;
@apply text-white; @apply text-white;
} }
.hr { .hr {
@apply border border-primary-500 w-full max-w-2xl; @apply border border-primary-300 w-full max-w-2xl;
}
.hr-light {
@apply border border-white w-full max-w-2xl;
}
.link {
@apply hover:underline;
@apply transition-colors duration-500 ease-in-out;
} }
} }

34
lib/lokal_web/templates/error/error.html.heex Normal file
View File

@ -0,0 +1,34 @@
<!DOCTYPE html>
<html lang="en" class="m-0 p-0 w-full h-full">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>
<%= dgettext("errors", "Error") %>| Lokal
</title>
<link rel="stylesheet" href="/css/app.css" />
<script defer type="text/javascript" src="/js/app.js"></script>
</head>
<body class="pb-8 m-0 p-0 w-full h-full">
<header>
<.topbar current_user={assigns[:current_user]}></.topbar>
</header>
<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">
<%= @error_string %>
</h1>
<hr class="w-full hr" />
<a href={Routes.live_path(Endpoint, PageLive)} class="link title text-primary-600 text-lg">
<%= dgettext("errors", "Go back home") %>
</a>
</div>
</div>
</body>
</html>

11
lib/lokal_web/templates/layout/app.html.heex
View File

@ -1,7 +1,8 @@
<main class="m-0 p-0 w-full h-full"> <main role="main" class="min-h-full min-w-full">
<header> <header>
<.topbar current_user={assigns[:current_user]}> <.topbar current_user={assigns[:current_user]}></.topbar>
</.topbar>
<div class="mx-8 my-2 flex flex-col space-y-4 text-center">
<%= if get_flash(@conn, :info) do %> <%= if get_flash(@conn, :info) do %>
<p class="alert alert-info" role="alert"> <p class="alert alert-info" role="alert">
<%= get_flash(@conn, :info) %> <%= get_flash(@conn, :info) %>
@ -12,6 +13,10 @@
<%= get_flash(@conn, :error) %> <%= get_flash(@conn, :error) %>
</p> </p>
<% end %> <% end %>
</div>
</header> </header>
<div class="mx-4 sm:mx-8 md:mx-16">
<%= @inner_content %> <%= @inner_content %>
</div>
</main> </main>

53
lib/lokal_web/templates/layout/live.html.heex
View File

@ -1,17 +1,54 @@
<main class="m-0 p-0 w-full h-full"> <main class="mb-8 min-w-full">
<header> <header>
<.topbar current_user={assigns[:current_user]}> <.topbar current_user={assigns[:current_user]}></.topbar>
</.topbar>
<%= if @flash && @flash |> Map.has_key?(:info) do %> <div class="mx-8 my-2 flex flex-col space-y-4 text-center">
<%= if @flash && @flash |> Map.has_key?("info") do %>
<p class="alert alert-info" role="alert" phx-click="lv:clear-flash" phx-value-key="info"> <p class="alert alert-info" role="alert" phx-click="lv:clear-flash" phx-value-key="info">
<%= live_flash(@flash, :info) %> <%= live_flash(@flash, "info") %>
</p> </p>
<% end %> <% end %>
<%= if @flash && @flash |> Map.has_key?(:error) do %>
<p class="alert alert-danger" role="alert" phx-click="lv:clear-flash" phx-value-key="error"> <%= if @flash && @flash |> Map.has_key?("error") do %>
<%= live_flash(@flash, :error) %> <p
class="alert alert-danger"
role="alert"
phx-click="lv:clear-flash"
phx-value-key="error"
>
<%= live_flash(@flash, "error") %>
</p> </p>
<% end %> <% end %>
</div>
</header> </header>
<div class="mx-4 sm:mx-8 md:mx-16">
<%= @inner_content %> <%= @inner_content %>
</div>
</main> </main>
<div
id="loading"
class="fixed opacity-0 top-0 left-0 w-screen h-screen bg-white 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">
<%= gettext("Loading...") %>
</h1>
<i class="fas fa-3x fa-spin fa-cog"></i>
</div>
<div
id="disconnect"
class="fixed opacity-0 top-0 left-0 w-screen h-screen bg-white 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">
<%= gettext("Reconnecting...") %>
</h1>
<i class="fas fa-3x fa-fade fa-satellite-dish"></i>
</div>

4
lib/lokal_web/templates/layout/root.html.heex
View File

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

33
lib/lokal_web/templates/user_confirmation/new.html.heex
View File

@ -1,26 +1,35 @@
<div class="flex flex-col justify-center items-center space-y-4"> <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center space-y-4">
<h1 class="title text-primary-500 text-xl"> <h1 class="title text-primary-600 text-xl">
Resend confirmation instructions <%= dgettext("actions", "Resend confirmation instructions") %>
</h1> </h1>
<%= form_for :user, <%= form_for :user,
Routes.user_confirmation_path(@conn, :create), Routes.user_confirmation_path(@conn, :create),
[class: "flex flex-col justify-center items-center space-y-4"], [
class:
"flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
],
fn f -> %> fn f -> %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4"> <%= label(f, :email, class: "title text-lg text-primary-600") %>
<%= label(f, :email, class: "title text-lg text-primary-500") %>
<%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %> <%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %>
</div>
<%= submit("Resend confirmation instructions", class: "btn btn-primary") %> <%= submit(dgettext("actions", "Resend confirmation instructions"),
<hr class="hr"> class: "mx-auto btn btn-primary col-span-3"
) %>
<% end %>
<hr class="hr" />
<div class="flex flex-row justify-center items-center space-x-4"> <div class="flex flex-row justify-center items-center space-x-4">
<%= link("Register", <%= if Accounts.allow_registration?() do %>
<%= link(dgettext("actions", "Register"),
to: Routes.user_registration_path(@conn, :new), to: Routes.user_registration_path(@conn, :new),
class: "btn btn-primary" class: "btn btn-primary"
) %> ) %>
<%= link("Log in", <% end %>
<%= link(dgettext("actions", "Log in"),
to: Routes.user_session_path(@conn, :new), to: Routes.user_session_path(@conn, :new),
class: "btn btn-primary" class: "btn btn-primary"
) %> ) %>
</div> </div>
<% end %>
</div> </div>

49
lib/lokal_web/templates/user_registration/new.html.heex
View File

@ -1,37 +1,48 @@
<div class="flex flex-col justify-center items-center space-y-4"> <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center space-y-4">
<h1 class="title text-primary-500 text-xl"> <h1 class="title text-primary-600 text-xl">
Register <%= dgettext("actions", "Register") %>
</h1> </h1>
<%= form_for @changeset, <%= form_for @changeset,
Routes.user_registration_path(@conn, :create), Routes.user_registration_path(@conn, :create),
[class: "flex flex-col justify-center items-center space-y-4"], [
class:
"flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
],
fn f -> %> fn f -> %>
<%= if @changeset.action && not @changeset.valid? do %> <%= if @changeset.action && not @changeset.valid? do %>
<div class="alert alert-danger"> <div class="alert alert-danger col-span-3">
<p>Oops, something went wrong! Please check the errors below.</p> <p>
<%= dgettext("errors", "Oops, something went wrong! Please check the errors below.") %>
</p>
</div> </div>
<% end %> <% end %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4">
<%= label(f, :email, class: "title text-lg text-primary-500") %> <%= if @invite do %>
<%= hidden_input(f, :invite_token, value: @invite.token) %>
<% end %>
<%= label(f, :email, class: "title text-lg text-primary-600") %>
<%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %> <%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %>
</div> <%= error_tag(f, :email, "col-span-3") %>
<%= error_tag(f, :email) %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4"> <%= label(f, :password, class: "title text-lg text-primary-600") %>
<%= label(f, :password, class: "title text-lg text-primary-500") %>
<%= password_input(f, :password, required: true, class: "input input-primary col-span-2") %> <%= password_input(f, :password, required: true, class: "input input-primary col-span-2") %>
</div> <%= error_tag(f, :password, "col-span-3") %>
<%= error_tag(f, :password) %>
<%= submit("Register", class: "btn btn-primary") %> <%= submit(dgettext("actions", "Register"), class: "mx-auto btn btn-primary col-span-3") %>
<hr class="hr"> <% end %>
<hr class="hr" />
<div class="flex flex-row justify-center items-center space-x-4"> <div class="flex flex-row justify-center items-center space-x-4">
<%= link("Log in", <%= link(dgettext("actions", "Log in"),
to: Routes.user_session_path(@conn, :new), to: Routes.user_session_path(@conn, :new),
class: "btn btn-primary" class: "btn btn-primary"
) %> ) %>
<%= link("Forgot your password?", <%= link(dgettext("actions", "Forgot your password?"),
to: Routes.user_reset_password_path(@conn, :new), to: Routes.user_reset_password_path(@conn, :new),
class: "btn btn-primary" class: "btn btn-primary"
) %> ) %>
</div> </div>
<% end %>
</div> </div>

56
lib/lokal_web/templates/user_reset_password/edit.html.heex
View File

@ -1,37 +1,53 @@
<div class="flex flex-col justify-center items-center space-y-4"> <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center space-y-4">
<h1 class="title text-primary-500 text-xl"> <h1 class="title text-primary-600 text-xl">
Reset password <%= dgettext("actions", "Reset password") %>
</h1> </h1>
<%= form_for @changeset, <%= form_for @changeset,
Routes.user_reset_password_path(@conn, :update, @token), Routes.user_reset_password_path(@conn, :update, @token),
[class: "flex flex-col justify-center items-center space-y-4"], [
class:
"flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
],
fn f -> %> fn f -> %>
<%= if @changeset.action && not @changeset.valid? do %> <%= if @changeset.action && not @changeset.valid? do %>
<div class="alert alert-danger"> <div class="alert alert-danger col-span-3">
<p>Oops, something went wrong! Please check the errors below.</p> <p>
<%= dgettext("errors", "Oops, something went wrong! Please check the errors below.") %>
</p>
</div> </div>
<% end %> <% end %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4">
<%= label(f, :password, "New password", class: "title text-lg text-primary-500") %> <%= label(f, :password, "New password", class: "title text-lg text-primary-600") %>
<%= password_input(f, :password, required: true, class: "input input-primary col-span-2") %> <%= password_input(f, :password, required: true, class: "input input-primary col-span-2") %>
</div> <%= error_tag(f, :password, "col-span-3") %>
<%= error_tag(f, :password) %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4"> <%= label(f, :password_confirmation, "Confirm new password",
<%= label(f, :password_confirmation, "Confirm new password", class: "title text-lg text-primary-500") %> class: "title text-lg text-primary-600"
<%= password_input(f, :password_confirmation, required: true, class: "input input-primary col-span-2") %> ) %>
</div> <%= password_input(f, :password_confirmation,
<%= error_tag(f, :password_confirmation) %> required: true,
<%= submit("Reset password", class: "btn btn-primary") %> class: "input input-primary col-span-2"
<hr class="hr"> ) %>
<%= error_tag(f, :password_confirmation, "col-span-3") %>
<%= submit(dgettext("actions", "Reset password"),
class: "mx-auto btn btn-primary col-span-3"
) %>
<% end %>
<hr class="hr" />
<div class="flex flex-row justify-center items-center space-x-4"> <div class="flex flex-row justify-center items-center space-x-4">
<%= link("Register", <%= if Accounts.allow_registration?() do %>
<%= link(dgettext("actions", "Register"),
to: Routes.user_registration_path(@conn, :new), to: Routes.user_registration_path(@conn, :new),
class: "btn btn-primary" class: "btn btn-primary"
) %> ) %>
<%= link("Log in", <% end %>
<%= link(dgettext("actions", "Log in"),
to: Routes.user_session_path(@conn, :new), to: Routes.user_session_path(@conn, :new),
class: "btn btn-primary" class: "btn btn-primary"
) %> ) %>
</div> </div>
<% end %>
</div> </div>

33
lib/lokal_web/templates/user_reset_password/new.html.heex
View File

@ -1,26 +1,35 @@
<div class="flex flex-col justify-center items-center space-y-4"> <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center space-y-4">
<h1 class="title text-primary-500 text-xl"> <h1 class="title text-primary-600 text-xl">
Forgot your password? <%= dgettext("actions", "Forgot your password?") %>
</h1> </h1>
<%= form_for :user, <%= form_for :user,
Routes.user_reset_password_path(@conn, :create), Routes.user_reset_password_path(@conn, :create),
[class: "flex flex-col justify-center items-center space-y-4"], [
class:
"flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
],
fn f -> %> fn f -> %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4"> <%= label(f, :email, class: "title text-lg text-primary-600") %>
<%= label(f, :email, class: "title text-lg text-primary-500") %>
<%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %> <%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %>
</div>
<%= submit("Send instructions to reset password", class: "btn btn-primary") %> <%= submit(dgettext("actions", "Send instructions to reset password"),
<hr class="hr"> class: "mx-auto btn btn-primary col-span-3"
) %>
<% end %>
<hr class="hr" />
<div class="flex flex-row justify-center items-center space-x-4"> <div class="flex flex-row justify-center items-center space-x-4">
<%= link("Register", <%= if Accounts.allow_registration?() do %>
<%= link(dgettext("actions", "Register"),
to: Routes.user_registration_path(@conn, :new), to: Routes.user_registration_path(@conn, :new),
class: "btn btn-primary" class: "btn btn-primary"
) %> ) %>
<%= link("Log in", <% end %>
<%= link(dgettext("actions", "Log in"),
to: Routes.user_session_path(@conn, :new), to: Routes.user_session_path(@conn, :new),
class: "btn btn-primary" class: "btn btn-primary"
) %> ) %>
</div> </div>
<% end %>
</div> </div>

49
lib/lokal_web/templates/user_session/new.html.heex
View File

@ -1,41 +1,50 @@
<div class="flex flex-col justify-center items-center space-y-4"> <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center space-y-4">
<h1 class="title text-primary-500 text-xl"> <h1 class="title text-primary-600 text-xl">
Log in <%= dgettext("actions", "Log in") %>
</h1> </h1>
<%= form_for @conn, <%= form_for @conn,
Routes.user_session_path(@conn, :create), Routes.user_session_path(@conn, :create),
[as: :user, class: "flex flex-col justify-center items-center space-y-4"], [
as: :user,
class:
"flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
],
fn f -> %> fn f -> %>
<%= if @error_message do %> <%= if @error_message do %>
<div class="alert alert-danger"> <div class="alert alert-danger col-span-3">
<p> <p>
<%= @error_message %> <%= @error_message %>
</p> </p>
</div> </div>
<% end %> <% end %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4">
<%= label(f, :email, class: "title text-lg text-primary-500") %> <%= label(f, :email, class: "title text-lg text-primary-600") %>
<%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %> <%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %>
</div>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4"> <%= label(f, :password, class: "title text-lg text-primary-600") %>
<%= label(f, :password, class: "title text-lg text-primary-500") %>
<%= password_input(f, :password, required: true, class: "input input-primary col-span-2") %> <%= password_input(f, :password, required: true, class: "input input-primary col-span-2") %>
</div>
<div class="flex flex-row justify-center items-center text-center space-x-4"> <%= label(f, :remember_me, gettext("Keep me logged in for 60 days"),
<%= label(f, :remember_me, "Keep me logged in for 60 days", class: "title text-lg text-primary-500") %> class: "title text-lg text-primary-600"
<%= checkbox(f, :remember_me, class: "checkbox") %> ) %>
</div> <%= checkbox(f, :remember_me, class: "checkbox col-span-2") %>
<%= submit("Log in", class: "btn btn-primary") %>
<hr class="hr"> <%= submit(dgettext("actions", "Log in"), class: "mx-auto btn btn-primary col-span-3") %>
<% end %>
<hr class="hr" />
<div class="flex flex-row justify-center items-center space-x-4"> <div class="flex flex-row justify-center items-center space-x-4">
<%= link("Register", <%= if Accounts.allow_registration?() do %>
<%= link(dgettext("actions", "Register"),
to: Routes.user_registration_path(@conn, :new), to: Routes.user_registration_path(@conn, :new),
class: "btn btn-primary" class: "btn btn-primary"
) %> ) %>
<%= link("Forgot your password?", <% end %>
<%= link(dgettext("actions", "Forgot your password?"),
to: Routes.user_reset_password_path(@conn, :new), to: Routes.user_reset_password_path(@conn, :new),
class: "btn btn-primary" class: "btn btn-primary"
) %> ) %>
</div> </div>
<% end %>
</div> </div>

126
lib/lokal_web/templates/user_settings/edit.html.heex
View File

@ -1,82 +1,114 @@
<div class="flex flex-col justify-center items-center space-y-4"> <div class="mx-auto mb-8 max-w-2xl flex flex-col justify-center items-center space-y-4">
<h1 class="title text-primary-500 text-xl"> <h1 class="pb-4 title text-primary-600 text-xl">
Settings <%= gettext("Settings") %>
</h1> </h1>
<h3 class="title text-primary-500 text-lg">
Change email <hr class="hr" />
</h3>
<%= form_for @email_changeset, <%= form_for @email_changeset,
Routes.user_settings_path(@conn, :update), Routes.user_settings_path(@conn, :update),
[class: "flex flex-col justify-center items-center space-y-4"], [
class:
"flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
],
fn f -> %> fn f -> %>
<%= if @email_changeset.action do %> <h3 class="title text-primary-600 text-lg col-span-3">
<div class="alert alert-danger"> <%= dgettext("actions", "Change email") %>
<p>Oops, something went wrong! Please check the errors below.</p> </h3>
<%= if @email_changeset.action && not @email_changeset.valid? do %>
<div class="alert alert-danger col-span-3">
<p>
<%= dgettext("errors", "Oops, something went wrong! Please check the errors below.") %>
</p>
</div> </div>
<% end %> <% end %>
<%= hidden_input(f, :action, name: "action", value: "update_email") %> <%= hidden_input(f, :action, name: "action", value: "update_email") %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4">
<%= label(f, :email, class: "title text-lg text-primary-500") %> <%= label(f, :email, class: "title text-lg text-primary-600") %>
<%= email_input(f, :email, required: true, class: "input input-primary col-span-2") %> <%= email_input(f, :email, required: true, class: "mx-2 my-1 input input-primary col-span-2") %>
</div> <%= error_tag(f, :email, "col-span-3") %>
<%= error_tag(f, :email) %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4"> <%= label(f, :current_password, gettext("Current password"),
<%= label(f, :current_password,
for: "current_password_for_email", for: "current_password_for_email",
class: "title text-lg text-primary-500" class: "mx-2 my-1 title text-lg text-primary-600"
) %> ) %>
<%= password_input(f, :current_password, <%= password_input(f, :current_password,
required: true, required: true,
name: "current_password", name: "current_password",
id: "current_password_for_email", id: "current_password_for_email",
class: "input input-primary col-span-2" class: "mx-2 my-1 input input-primary col-span-2"
) %>
<%= error_tag(f, :current_password, "col-span-3") %>
<%= submit(dgettext("actions", "Change email"),
class: "mx-auto btn btn-primary col-span-3"
) %> ) %>
</div>
<%= error_tag(f, :current_password) %>
<%= submit("Change email", class: "btn btn-primary") %>
<% end %> <% end %>
<h3 class="title text-primary-500 text-lg">
Change password <hr class="hr" />
</h3>
<%= form_for @password_changeset, <%= form_for @password_changeset,
Routes.user_settings_path(@conn, :update), Routes.user_settings_path(@conn, :update),
[class: "flex flex-col justify-center items-center space-y-4"], [
class:
"flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
],
fn f -> %> fn f -> %>
<%= if @password_changeset.action do %> <h3 class="title text-primary-600 text-lg col-span-3">
<div class="alert alert-danger"> <%= dgettext("actions", "Change password") %>
<p>Oops, something went wrong! Please check the errors below.</p> </h3>
<%= if @password_changeset.action && not @password_changeset.valid? do %>
<div class="alert alert-danger col-span-3">
<p>
<%= dgettext("errors", "Oops, something went wrong! Please check the errors below.") %>
</p>
</div> </div>
<% end %> <% end %>
<%= hidden_input(f, :action, name: "action", value: "update_password") %> <%= hidden_input(f, :action, name: "action", value: "update_password") %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4">
<%= label(f, :password, "New password", class: "title text-lg text-primary-500") %> <%= label(f, :password, gettext("New password"), class: "title text-lg text-primary-600") %>
<%= password_input(f, :password, <%= password_input(f, :password,
required: true, required: true,
class: "input input-primary col-span-2" class: "mx-2 my-1 input input-primary col-span-2"
) %>
<%= error_tag(f, :password, "col-span-3") %>
<%= label(f, :password_confirmation, gettext("Confirm new password"),
class: "title text-lg text-primary-600"
) %> ) %>
</div>
<%= error_tag(f, :password) %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4">
<%= label(f, :password_confirmation, "Confirm new password", class: "title text-lg text-primary-500") %>
<%= password_input(f, :password_confirmation, <%= password_input(f, :password_confirmation,
required: true, required: true,
class: "input input-primary col-span-2" class: "mx-2 my-1 input input-primary col-span-2"
) %> ) %>
</div> <%= error_tag(f, :password_confirmation, "col-span-3") %>
<%= error_tag(f, :password_confirmation) %>
<div class="grid grid-cols-3 justify-center items-center text-center space-x-4"> <%= label(f, :current_password, gettext("Current password"),
<%= label(f, :current_password,
for: "current_password_for_password", for: "current_password_for_password",
class: "title text-lg text-primary-500" class: "title text-lg text-primary-600"
) %> ) %>
<%= password_input(f, :current_password, <%= password_input(f, :current_password,
required: true, required: true,
name: "current_password", name: "current_password",
id: "current_password_for_password", id: "current_password_for_password",
class: "input input-primary col-span-2" class: "mx-2 my-1 input input-primary col-span-2"
) %>
<%= error_tag(f, :current_password, "col-span-3") %>
<%= submit(dgettext("actions", "Change password"),
class: "mx-auto btn btn-primary col-span-3"
) %>
<% end %>
<hr class="hr" />
<%= link(dgettext("actions", "Delete User"),
to: Routes.user_settings_path(@conn, :delete, @current_user),
method: :delete,
class: "btn btn-alert",
data: [confirm: dgettext("prompts", "Are you sure you want to delete your account?")]
) %> ) %>
</div> </div>
<%= error_tag(f, :current_password) %>
<%= submit("Change password", class: "btn btn-primary") %>
<% end %>
</div>

1
lib/lokal_web/views/layout_view.ex
View File

@ -1,6 +1,7 @@
defmodule LokalWeb.LayoutView do defmodule LokalWeb.LayoutView do
use LokalWeb, :view use LokalWeb, :view
import LokalWeb.Components.Topbar import LokalWeb.Components.Topbar
alias LokalWeb.{Endpoint, PageLive}
# Phoenix LiveDashboard is available only in development by default, # Phoenix LiveDashboard is available only in development by default,
# so we instruct Elixir to not warn if the dashboard route is missing. # so we instruct Elixir to not warn if the dashboard route is missing.