mirror of
https://github.com/Freika/dawarich.git
synced 2026-01-10 17:21:38 -05:00
94 lines
4.3 KiB
Text
94 lines
4.3 KiB
Text
<% if user_signed_in? %>
|
|
<div data-controller="onboarding-modal"
|
|
data-onboarding-modal-showable-value="true">
|
|
<dialog id="getting_started" class="modal" data-onboarding-modal-target="modal">
|
|
<div class="modal-box max-w-2xl bg-base-200">
|
|
<!-- Header -->
|
|
<div class="text-center mb-6">
|
|
<h3 class="text-2xl font-bold text-primary mb-2 flex items-center justify-center gap-2">
|
|
<%= icon 'goal' %> Start Tracking Your Location!</h3>
|
|
<p class="text-base-content/70">
|
|
Welcome to Dawarich! Let's get you set up to start tracking and visualizing your location data.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Steps -->
|
|
<div class="space-y-6">
|
|
<!-- Step 1: Download App -->
|
|
<div class="card bg-base-100 shadow-sm">
|
|
<div class="card-body p-4">
|
|
<div class="flex items-center gap-3 mb-3">
|
|
<div class="badge badge-primary badge-lg">1</div>
|
|
<h4 class="text-lg font-semibold">Download the Official App</h4>
|
|
</div>
|
|
<p class="text-sm text-base-content/80 mb-4">
|
|
Get the official Dawarich app from the App Store to start tracking your location.
|
|
</p>
|
|
<div class="flex justify-center">
|
|
<%= link_to 'https://apps.apple.com/de/app/dawarich/id6739544999?itscg=30200&itsct=apps_box_badge&mttnsubad=6739544999',
|
|
class: 'inline-block rounded-lg border-2 border-transparent hover:border-primary hover:shadow-lg hover:shadow-primary/20 transition-all duration-300 ease-in-out transform hover:scale-105' do %>
|
|
<%= image_tag 'Download_on_the_App_Store_Badge_US-UK_RGB_blk_092917.svg',
|
|
class: 'h-12 transition-opacity duration-300' %>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-body p-4">
|
|
<div class="flex items-center gap-3 mb-3">
|
|
<div class="badge badge-primary badge-lg">2</div>
|
|
<h4 class="text-lg font-semibold">Scan QR Code to Connect</h4>
|
|
</div>
|
|
<p class="text-sm text-base-content/80 mb-4">
|
|
Scan this QR code with the Dawarich app to automatically configure your connection.
|
|
</p>
|
|
<div class="flex justify-center">
|
|
<div class="bg-white p-3 rounded-lg shadow-inner">
|
|
<%= api_key_qr_code(current_user, size: 3) %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-body p-4">
|
|
<div class="flex items-center gap-3 mb-3">
|
|
<div class="badge badge-secondary badge-lg">3</div>
|
|
<h4 class="text-lg font-semibold">Manual Setup (Alternative)</h4>
|
|
</div>
|
|
<p class="text-sm text-base-content/80">
|
|
Alternatively, you can manually grab your API key from
|
|
<%= link_to 'Settings', settings_path, class: 'link link-primary font-medium' %>
|
|
and follow the setup instructions in our
|
|
<%= link_to 'documentation', 'https://dawarich.app/docs/tutorials/track-your-location?utm_source=app&utm_medium=referral&utm_campaign=onboarding',
|
|
class: 'link link-primary font-medium', target: '_blank', rel: 'noopener' %>.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<div class="modal-action mt-8">
|
|
<div class="text-center flex-1">
|
|
<p class="text-xs text-base-content/60 mb-4">
|
|
Need help? Check out our
|
|
<%= link_to 'documentation', 'https://dawarich.app/docs/category/tutorials?utm_source=app&utm_medium=referral&utm_campaign=onboarding',
|
|
class: 'link link-primary text-xs', target: '_blank', rel: 'noopener' %>
|
|
for more guidance.
|
|
</p>
|
|
</div>
|
|
<form method="dialog">
|
|
<button class="btn btn-primary btn-wide">
|
|
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
Got it, let's start!
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modal backdrop -->
|
|
<form method="dialog" class="modal-backdrop">
|
|
<button>close</button>
|
|
</form>
|
|
</dialog>
|
|
</div>
|
|
<% end %>
|