analytics/lib/plausible_web/templates/billing/change_plan.html.eex

<div class="max-w-md w-full mx-auto bg-white shadow-md rounded px-8 py-6 mb-4 mt-8">
  <h2 class="text-xl font-black">Change subscription plan</h2>

  <div class="py-4">
    If you choose to change your plan, your current subscription will
    be prorated.
  </div>

  <div class="w-full flex justify-between items-center py-4 border-t">
    <span><b>10,000</b> / mo</span>
    <b class="bg-orange-200 text-orange-900 p-1 rounded-sm">$6 / mo</b>
    <%= if Plausible.Billing.Plans.is?(@subscription, :personal) do %>
      <div>
        <svg class="feather text-green-500"><use xlink:href="#feather-check-circle" /></svg>
        Selected
      </div>
    <% else %>
      <%= button("Select", class: "button button-sm", method: :post, to: "/billing/change-plan/personal") %>
    <% end %>
  </div>
  <div class="w-full flex justify-between items-center py-4 border-t">
    <span><b>100,000</b> / mo</span>
    <b class="bg-orange-200 text-orange-900 p-1 rounded-sm">$12 / mo</b>
    <%= if Plausible.Billing.Plans.is?(@subscription, :startup) do %>
      <div>
        <svg class="feather text-green-500"><use xlink:href="#feather-check-circle" /></svg>
        Selected
      </div>
    <% else %>
      <%= button("Select", class: "button button-sm", method: :post, to: "/billing/change-plan/startup") %>
    <% end %>
  </div>
  <div class="w-full flex justify-between items-center py-4 border-t">
    <span><b>1,000,000</b> / mo</span>
    <b class="bg-orange-200 text-orange-900 p-1 rounded-sm">$36 / mo</b>
    <%= if Plausible.Billing.Plans.is?(@subscription, :business) do %>
      <div>
        <svg class="feather text-green-500"><use xlink:href="#feather-check-circle" /></svg>
        Selected
      </div>
    <% else %>
      <%= button("Select", class: "button button-sm", method: :post, to: "/billing/change-plan/business") %>
    <% end %>
  </div>

  <script type="text/javascript" src="https://cdn.paddle.com/paddle/paddle.js"></script>
  <script type="text/javascript" src="<%= Routes.static_path(@conn, "/js/checkout.js") %>"></script>
  <script type="text/javascript" src="<%= Routes.static_path(@conn, "/js/app.js") %>"></script>
  <script>
    window.Checkout.init(
      <%= @conn.assigns[:current_user].id %>,
      '<%= @conn.assigns[:current_user].email %>'
    )
  </script>

</div>