mirror of
https://github.com/ClaperCo/Claper.git
synced 2025-12-15 19:37:53 +01:00
70 lines
4.0 KiB
Plaintext
70 lines
4.0 KiB
Plaintext
<style>
|
|
body {
|
|
background: linear-gradient(-45deg, #2C033A, #21033A, #053138, #053138);
|
|
background-size: 400% 400%;
|
|
animation: gradient 15s ease infinite;
|
|
}
|
|
</style>
|
|
|
|
<div class="lg:overflow-hidden">
|
|
|
|
<div x-data="{open: false}" class="w-full h-24 py-4 text-right md:px-5 relative z-20" phx-update="ignore">
|
|
<div x-show="open" x-transition class="absolute h-24 bg-white w-full top-0 md:hidden px-5 py-3 flex flex-col items-center justify-center space-y-2" @click.away="open = false">
|
|
<a href="https://get.claper.co/" class="text-sm font-semibold text-black"><%= gettext("About") %></a>
|
|
<%= if @current_user do %>
|
|
<%= live_patch gettext("Dashboard"), to: Routes.event_index_path(@socket, :index), class: "relative inline-flex items-center px-4 py-1 text-base font-sm rounded-md text-white bg-gradient-to-tl from-primary-500 to-secondary-500 bg-size-200 bg-pos-0 hover:bg-pos-100 transition-all duration-500" %>
|
|
<% else %>
|
|
<%= live_patch gettext("Login"), to: Routes.user_session_path(@socket, :new), class: "relative inline-flex items-center px-4 py-1 text-base font-sm rounded-md text-white bg-gradient-to-tl from-primary-500 to-secondary-500 bg-size-200 bg-pos-0 hover:bg-pos-100 transition-all duration-500" %>
|
|
<% end %>
|
|
</div>
|
|
<button @click="open = true" class="md:hidden">
|
|
<img src="/images/icons/menu-outline.svg" class="h-9" />
|
|
</button>
|
|
<div class="hidden md:block">
|
|
<a href="https://get.claper.co/" class="text-sm text-white font-semibold mr-3"><%= gettext("About") %></a>
|
|
<%= if @current_user do %>
|
|
<%= live_patch gettext("Dashboard"), to: Routes.event_index_path(@socket, :index), class: "relative inline-flex items-center px-4 py-1 text-base font-sm rounded-md text-white bg-gradient-to-tl from-primary-500 to-secondary-500 bg-size-200 bg-pos-0 hover:bg-pos-100 transition-all duration-500" %>
|
|
<% else %>
|
|
<%= live_patch gettext("Login"), to: Routes.user_session_path(@socket, :new), class: "relative inline-flex items-center px-4 py-1 text-base font-sm rounded-md text-white bg-gradient-to-tl from-primary-500 to-secondary-500 bg-size-200 bg-pos-0 hover:bg-pos-100 transition-all duration-500" %>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="px-5 lg:w-1/3 lg:mx-auto">
|
|
|
|
<div class="mt-10 ">
|
|
<img src="/images/logo.svg" class="h-12 mx-auto mb-16" />
|
|
</div>
|
|
|
|
<%= if @last_event do %>
|
|
<%= live_patch to: Routes.event_show_path(@socket, :show, @last_event.code) do %>
|
|
<div class="rounded-md bg-gray-600 p-4 mb-8">
|
|
<div class="flex justify-center items-center">
|
|
<p class="text-sm text-white">
|
|
<%= gettext "Return to your last presentation" %> (#<span class="uppercase"><%= @last_event.code %></span>)
|
|
</p>
|
|
<p class="text-base ml-3 mt-1">
|
|
<a href="#" class="whitespace-nowrap font-medium text-white"><span aria-hidden="true">→</span></a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
<% end %>
|
|
|
|
<%= form_for :event, Routes.event_join_path(@socket, :join), ["phx-submit": "join", "phx-hook": "JoinEvent", id: "form"], fn f -> %>
|
|
<div class="relative">
|
|
<%= text_input f, :code, required: true, autofocus: true, id: "input", class: "transition-all bg-transparent tracking-widest w-full uppercase text-white text-2xl px-3 border-b border-gray-200 focus:border-b-2 pt-5 pl-12 pb-3 outline-none" %>
|
|
<img class="icon absolute top-5 left-2 transition-all duration-100" src="/images/icons/hashtag-white.svg" alt="code">
|
|
</div>
|
|
|
|
<div class="mt-10">
|
|
<button type="submit" id="submit" class="w-full flex justify-center text-white p-4 rounded-full tracking-wide font-bold outline-none focus:shadow-outline shadow-lg bg-gradient-to-tl from-primary-500 to-secondary-500 bg-size-200 bg-pos-0 hover:bg-pos-100 transition-all duration-500">
|
|
<%= gettext "Join" %>
|
|
</button>
|
|
<img src="/images/loading.gif" id="loading" class="hidden h-12 mx-auto" />
|
|
</div>
|
|
|
|
<% end %>
|
|
|
|
</div>
|
|
</div> |