bterkuile/fizzy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Display the verification code in the dev env

Browse Source 
This seems better and easier than the console log.
This commit is contained in:
Mike Dalessio
2025-12-06 13:43:48 -05:00
parent 529f5af5f6
commit 5865d79ed9
2 changed files with 11 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/assets/stylesheets/animation.css
+5
View File
@@ -44,6 +44,11 @@
to { transform: translateY(0); } to { transform: translateY(0); }
} }
@keyframes slide-up-fade-in {
from { transform: translateY(2rem); opacity: 0; }
to { transform: translateY(0); opacity: 1; }
}
@keyframes slide-down { @keyframes slide-down {
from { transform: translateY(0); } from { transform: translateY(0); }
to { transform: translateY(2rem); } to { transform: translateY(2rem); }
app/views/sessions/magic_links/show.html.erb
+6 -4
View File
@@ -16,10 +16,12 @@
<p class="txt-small">The code you receive will work for <%= distance_of_time_in_words(MagicLink::EXPIRATION_TIME) %>.</p> <p class="txt-small">The code you receive will work for <%= distance_of_time_in_words(MagicLink::EXPIRATION_TIME) %>.</p>
</div> </div>
<% if Rails.env.development? %> <% if Rails.env.development? && flash[:magic_link_code].present? %>
<%= javascript_tag do %> <div class="flex align-center justify-center gap fill-shade border-radius pad margin-block-start full-width position-relative" style="animation: slide-up-fade-in 400ms ease-out both; max-width: 42ch; overflow: hidden;">
console.log("Magic link code: <%= flash[:magic_link_code].presence || "not generated" %>"); <span class="txt-uppercase translucent txt-tight-lines">Psst, here's your code:</span>
<% end %> <code class="txt-large font-weight-black txt-tight-lines"><%= flash[:magic_link_code] %></code>
<span class="txt-xx-small txt-uppercase font-weight-black txt-align-center flex align-center justify-center" style="position: absolute; top: 0; bottom: 0; left: 0; background: var(--color-ink-lighter); padding: 0 0.5em; writing-mode: vertical-rl; transform: rotate(180deg); line-height: 1;">DEV</span>
</div>
<% end %> <% end %>
<% content_for :footer do %> <% content_for :footer do %>