mirror of
https://github.com/plausible/analytics.git
synced 2024-12-19 07:31:50 +03:00
85 lines
4.0 KiB
Elixir
85 lines
4.0 KiB
Elixir
<div class="max-w-md mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-orange-lighter px-8 pt-6 pb-8 mt-24">
|
||
<h2 class="font-black">Subscription Plan</h2>
|
||
|
||
<div class="mt-4 border-b border-grey-light"></div>
|
||
|
||
<div class="flex flex-col items-center sm:flex-row sm:items-start justify-between mt-8">
|
||
<div class="text-center bg-grey-lighter py-8 px-6 rounded h-32 my-4" style="width: 11.75rem;">
|
||
<h4 class="font-black">Current plan</h4>
|
||
<%= if @subscription do %>
|
||
<div class="text-xl py-2 font-medium"><%= subscription_name(@subscription) %></div>
|
||
<%= link("Change plan", to: "/billing/change-plan", class: "text-sm text-indigo font-medium") %>
|
||
<% else %>
|
||
<div class="text-xl py-2 font-medium">Free trial</div>
|
||
<%= link("Upgrade", to: "/billing/upgrade", class: "text-sm text-indigo font-medium") %>
|
||
<% end %>
|
||
</div>
|
||
<div class="text-center bg-grey-lighter py-8 px-6 rounded h-32 my-4" style="width: 11.75rem;">
|
||
<h4 class="font-black">Next bill amount</h4>
|
||
<%= if @subscription do %>
|
||
<div class="text-xl py-2 font-medium">$<%= @subscription.next_bill_amount %></div>
|
||
<%= if @subscription.update_url do %>
|
||
<%= link("Update billing info", to: @subscription.update_url, class: "text-sm text-indigo font-medium") %>
|
||
<% end %>
|
||
<% else %>
|
||
<div class="text-xl py-2 font-medium">$0</div>
|
||
<% end %>
|
||
</div>
|
||
<div class="text-center bg-grey-lighter py-8 px-6 rounded h-32 my-4" style="width: 11.75rem;">
|
||
<h4 class="font-black">Next bill date</h4>
|
||
|
||
<%= if @subscription && @subscription.next_bill_date do %>
|
||
<div class="text-xl py-2 font-medium"><%= Timex.format!(@subscription.next_bill_date, "{Mshort} {D}, {YYYY}") %></div>
|
||
<% else %>
|
||
<div class="text-xl py-2 font-medium">–</div>
|
||
<% end %>
|
||
</div>
|
||
</div>
|
||
|
||
<h3 class="mt-8">Your usage</h3>
|
||
|
||
<div class="py-2">
|
||
<b><%= delimit_integer(Plausible.Billing.usage(@conn.assigns[:current_user])) %></b>
|
||
pageviews in the last 30 days
|
||
</div>
|
||
|
||
<%= if @subscription && @subscription.cancel_url do %>
|
||
<div class="mt-8">
|
||
<%= link("Cancel my subscription", to: @subscription.cancel_url, class: "text-indigo text-sm") %>
|
||
</div>
|
||
<% end %>
|
||
</div>
|
||
|
||
<div class="max-w-md mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-indigo-lightest px-8 pt-6 pb-8 mt-16">
|
||
<div class="flex items-center justify-between">
|
||
<h2 class="font-black">Account settings</h2>
|
||
</div>
|
||
|
||
<div class="my-4 border-b border-grey-light"></div>
|
||
|
||
<%= form_for @changeset, "/settings", [class: "max-w-xs"], fn f -> %>
|
||
<div class="my-4">
|
||
<%= label f, :name, class: "block text-grey-darker text-sm font-bold mb-2" %>
|
||
<%= text_input f, :name, class: "transition bg-grey-lighter appearance-none border border-transparent rounded w-full p-2 text-grey-darker leading-normal appearance-none focus:outline-none focus:border-grey-light" %>
|
||
<%= error_tag f, :name %>
|
||
</div>
|
||
<div class="my-4">
|
||
<%= label f, :email, class: "block text-grey-darker text-sm font-bold mb-2" %>
|
||
<%= email_input f, :email, class: "transition bg-grey-lighter appearance-none border border-transparent rounded w-full p-2 text-grey-darker leading-normal appearance-none focus:outline-none focus:border-grey-light" %>
|
||
<%= error_tag f, :email %>
|
||
</div>
|
||
<%= submit "Save changes", class: "button mt-4" %>
|
||
<% end %>
|
||
</div>
|
||
|
||
<div class="max-w-md mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-red-dark px-8 pt-6 pb-8 mt-16 mb-24">
|
||
<div class="flex items-center justify-between">
|
||
<h2 class="font-black">Delete account</h2>
|
||
</div>
|
||
|
||
<div class="my-4 border-b border-grey-light"></div>
|
||
|
||
<p class="text-lg">Deleting your account removes all sites and stats you've collected</p>
|
||
<%= link "Delete my account ", to: "/me", method: :delete, class: "button bg-red-dark mt-4", data: [confirm: "Deleting your account cannot be reversed. Are you sure?"] %>
|
||
</div>
|