railsmaker-core 0.0.1

data/lib/railsmaker/generators/templates/ui/app/views/demo/support.html.erb

@@ -0,0 +1,147 @@
+<div class="container mx-auto px-4 py-8 mt-16 pb-24 md:pb-8">
+  <!-- Page Header -->
+  <div class="flex items-center gap-3 mb-8">
+    <div class="size-12 rounded-lg bg-primary/10 flex items-center justify-center">
+      <svg xmlns="http://www.w3.org/2000/svg" class="size-6 text-primary" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.228 9c.549-1.165 2.03-2 3.772-2 2.21 0 4 1.343 4 3 0 1.4-1.278 2.575-3.006 2.907-.542.104-.994.54-.994 1.093m0 3h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+      </svg>
+    </div>
+    <div>
+      <h2 class="text-2xl font-bold">Support</h2>
+      <p class="text-base-content/60">Get help with your application</p>
+    </div>
+  </div>
+
+  <!-- Main Content -->
+  <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
+    <div class="lg:col-span-2">
+      <div class="card bg-base-100 shadow-xl">
+        <div class="card-body">
+          <div class="space-y-4">
+            <div class="collapse collapse-plus bg-base-100">
+              <input type="radio" name="my-accordion-2" checked="checked" /> 
+              <div class="collapse-title text-xl font-medium">
+                How do I get started?
+              </div>
+              <div class="collapse-content prose"> 
+                <p>Getting started is easy! Follow these steps:</p>
+                <ol>
+                  <li>Sign up for an account</li>
+                  <li>Complete your profile setup</li>
+                  <li>Follow our quick setup guide</li>
+                  <li>Start building your first project</li>
+                </ol>
+              </div>
+            </div>
+            <div class="collapse collapse-plus bg-base-100">
+              <input type="radio" name="my-accordion-2" /> 
+              <div class="collapse-title text-xl font-medium">
+                What payment methods do you accept?
+              </div>
+              <div class="collapse-content prose"> 
+                <p>We accept all major payment methods including:</p>
+                <ul>
+                  <li>Credit/Debit Cards (Visa, Mastercard, Amex)</li>
+                  <li>PayPal</li>
+                  <li>Bank Transfers (ACH)</li>
+                  <li>Wire Transfers (for annual plans)</li>
+                </ul>
+              </div>
+            </div>
+            <div class="collapse collapse-plus bg-base-100">
+              <input type="radio" name="my-accordion-2" /> 
+              <div class="collapse-title text-xl font-medium">
+                Can I cancel my subscription?
+              </div>
+              <div class="collapse-content prose"> 
+                <p>Yes, you can cancel your subscription at any time. Here's what you need to know:</p>
+                <ul>
+                  <li>No long-term contracts required</li>
+                  <li>Cancel directly from your account settings</li>
+                  <li>Access continues until the end of your billing period</li>
+                  <li>Data export available after cancellation</li>
+                </ul>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Contact Form -->
+    <div class="lg:col-span-1">
+      <div class="card bg-base-100 shadow-xl">
+        <div class="card-body">
+          <div class="flex items-center gap-3 mb-6">
+            <div class="size-12 rounded-lg bg-primary/10 flex items-center justify-center">
+              <svg xmlns="http://www.w3.org/2000/svg" class="size-6 text-primary" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
+              </svg>
+            </div>
+            <div>
+              <h2 class="text-xl font-bold">Contact Support</h2>
+              <p class="text-sm text-base-content/60">Our team typically responds within 24 hours</p>
+            </div>
+          </div>
+
+          <form class="space-y-6">
+            <div class="form-control">
+              <label class="label">
+                <span class="label-text font-medium">Subject</span>
+              </label>
+              <select class="select select-bordered w-full">
+                <option disabled selected>Select a topic</option>
+                <option>Technical Issue</option>
+                <option>Billing Question</option>
+                <option>Feature Request</option>
+                <option>Other</option>
+              </select>
+            </div>
+            
+            <div class="form-control">
+              <label class="label">
+                <span class="label-text font-medium">Priority</span>
+              </label>
+              <div class="flex gap-4">
+                <label class="label cursor-pointer gap-2">
+                  <input type="radio" name="priority" class="radio radio-sm radio-primary" value="low" />
+                  <span class="label-text">Low</span>
+                </label>
+                <label class="label cursor-pointer gap-2">
+                  <input type="radio" name="priority" class="radio radio-sm radio-primary" value="medium" checked />
+                  <span class="label-text">Medium</span>
+                </label>
+                <label class="label cursor-pointer gap-2">
+                  <input type="radio" name="priority" class="radio radio-sm radio-primary" value="high" />
+                  <span class="label-text">High</span>
+                </label>
+              </div>
+            </div>
+            
+            <div class="form-control">
+              <label class="label">
+                <span class="label-text font-medium">Message</span>
+                <span class="label-text-alt text-base-content/60">Max 500 characters</span>
+              </label>
+              <textarea class="textarea textarea-lg textarea-bordered min-h-32" placeholder="Describe your issue in detail..."></textarea>
+            </div>
+
+            <div class="form-control">
+              <label class="label cursor-pointer justify-start gap-3">
+                <input type="checkbox" class="checkbox checkbox-primary" />
+                <span class="label-text">Send me a copy of this message</span>
+              </label>
+            </div>
+            
+            <button class="btn btn-disabled w-full">
+              Send Message
+              <svg xmlns="http://www.w3.org/2000/svg" class="size-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3" />
+              </svg>
+            </button>
+          </form>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

data/lib/railsmaker/generators/templates/ui/app/views/layouts/_navbar.html.erb

@@ -0,0 +1,193 @@
+<div class="navbar bg-base-100 fixed top-0 z-[1000]">
+  <div class="navbar-start">
+    <%= link_to demo_path, class: 'flex items-center gap-2 px-2 py-1 rounded-lg group' do %>
+      <div class="p-2 bg-primary rounded-lg transition-all duration-300 group-hover:shadow-[0_0_20px_rgba(var(--p),0.7)] group-hover:scale-110">
+        <svg xmlns="http://www.w3.org/2000/svg" class="size-6 text-base-100" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+          <path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path>
+          <path d="M3.3 7l8.7 5 8.7-5"></path>
+          <path d="M12 22V12"></path>
+        </svg>
+      </div>
+      <span class="font-bold">
+        Rails<span class="text-primary border-primary">Maker</span>
+      </span>
+    <% end %>
+  </div>
+
+  <div class="navbar-center hidden md:flex">
+    <ul class="menu menu-horizontal px-1 gap-2 z-50">
+      <li>
+        <%= link_to demo_path, 
+            class: "#{current_page?(demo_path) ? 'active bg-base-200 font-medium' : ''} flex gap-2 items-center #{!signed_in? ? 'pointer-events-none opacity-50' : ''} relative", 
+            data: { tooltip: signed_in? ? nil : "Please sign in first" } do %>
+          <svg xmlns="http://www.w3.org/2000/svg" class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg>
+          Dashboard
+        <% end %>
+      </li>
+      <li>
+        <%= link_to analytics_path, 
+            class: "#{current_page?(analytics_path) ? 'active bg-base-200 font-medium' : ''} flex gap-2 items-center #{!signed_in? ? 'pointer-events-none opacity-50' : ''}",
+            data: { tooltip: signed_in? ? nil : "Please sign in first" } do %>
+          <svg xmlns="http://www.w3.org/2000/svg" class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 12h-4l-3 9L9 3l-3 9H2"></path></svg>
+          Analytics
+          <div class="badge badge-sm badge-primary">New</div>
+        <% end %>
+      </li>
+      <li>
+        <%= link_to support_path, 
+            class: "#{current_page?(support_path) ? 'active bg-base-200 font-medium' : ''} flex gap-2 items-center #{!signed_in? ? 'pointer-events-none opacity-50' : ''}",
+            data: { tooltip: signed_in? ? nil : "Please sign in first" } do %>
+          <svg xmlns="http://www.w3.org/2000/svg" class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"></path></svg>
+          Support
+        <% end %>
+      </li>
+    </ul>
+  </div>
+
+  <div class="navbar-end">
+    <!-- Only show notifications if signed in -->
+    <% if signed_in? %>
+      <!-- Notifications Dropdown -->
+      <div class="dropdown dropdown-end hidden md:block">
+        <div tabindex="0" role="button" class="btn btn-ghost btn-circle">
+          <div class="indicator">
+            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" /></svg>
+            <span class="badge badge-xs badge-primary indicator-item"></span>
+          </div>
+        </div>
+        <ul tabindex="0" class="dropdown-content menu menu-sm z-[1] p-2 shadow-xl bg-base-100 rounded-box w-80 mt-4">
+          <li class="menu-title px-4 py-2">
+            <span class="font-medium">Notifications</span>
+          </li>
+          <div class="px-4">
+            <div class="divide-y">
+              <div class="py-4">
+                <div class="flex items-center gap-4">
+                  <div class="w-2 h-2 bg-primary rounded-full"></div>
+                  <div>
+                    <p class="font-medium">New feature available</p>
+                    <p class="text-sm opacity-70">Check out our latest analytics dashboard</p>
+                    <span class="text-xs opacity-50">2 hours ago</span>
+                  </div>
+                </div>
+              </div>
+              <div class="py-4">
+                <div class="flex items-center gap-4">
+                  <div class="w-2 h-2 bg-primary rounded-full"></div>
+                  <div>
+                    <p class="font-medium">System Update</p>
+                    <p class="text-sm opacity-70">Performance improvements and bug fixes</p>
+                    <span class="text-xs opacity-50">5 hours ago</span>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <button class="btn btn-disabled btn-sm w-full mt-4">View all notifications</button>
+          </div>
+        </ul>
+      </div>
+    <% end %>
+
+    <!-- Profile/Sign In Button -->
+    <div class="dropdown dropdown-end ml-2">
+      <div tabindex="0" role="button" class="btn btn-ghost btn-circle">
+        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
+        </svg>
+      </div>
+      <ul tabindex="0" class="dropdown-content menu menu-sm z-[1] p-2 shadow-xl bg-base-100 rounded-box w-52 mt-4">
+        <% if signed_in? %>
+          <li class="menu-title px-4 py-2">
+            <span class="font-medium">Account</span>
+          </li>
+          <li class="menu-disabled">
+            <a class="flex gap-2">
+              <svg xmlns="http://www.w3.org/2000/svg" class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <path d="M20 7h-3a2 2 0 0 1-2-2V2"></path>
+                <path d="M9 18a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h7l4 4v10a2 2 0 0 1-2 2H9z"></path>
+                <path d="M3 15h6"></path>
+                <path d="M4 18h6"></path>
+              </svg>
+              Settings
+            </a>
+          </li>
+          <div class="divider my-1"></div>
+          <li>
+            <%= link_to sign_out_path, class: "flex gap-2 text-error", data: { turbo_method: :delete } do %>
+              <svg xmlns="http://www.w3.org/2000/svg" class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path>
+                <polyline points="16 17 21 12 16 7"></polyline>
+                <line x1="21" y1="12" x2="9" y2="12"></line>
+              </svg>
+              Sign out
+            <% end %>
+          </li>
+        <% else %>
+          <li>
+            <%= link_to sign_in_path, class: "flex gap-2" do %>
+              <svg xmlns="http://www.w3.org/2000/svg" class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4"></path>
+                <polyline points="10 17 15 12 10 7"></polyline>
+                <line x1="15" y1="12" x2="3" y2="12"></line>
+              </svg>
+              Sign in
+            <% end %>
+          </li>
+        <% end %>
+      </ul>
+    </div>
+  </div>
+</div>
+
+<%# Mobile Bottom Dock Navigation - only shown on mobile %>
+<div class="md:hidden">
+  <div class="dock dock-md bg-base-100 fixed bottom-0 left-0 right-0 border-t border-gray-200 dark:border-gray-600 z-[1000]">
+    <%= link_to demo_path, 
+        class: "#{current_page?(demo_path) ? 'dock-active' : ''} relative", 
+        disabled: signed_in? ? nil : 'disabled',
+        data: { tooltip: signed_in? ? nil : "Please sign in first" } do %>
+      <svg class="size-[1.2em]" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+        <g fill="currentColor" stroke-linejoin="miter" stroke-linecap="butt">
+          <rect x="3" y="3" width="18" height="18" rx="2" ry="2" fill="none" stroke="currentColor" stroke-linecap="square" stroke-miterlimit="10" stroke-width="2"></rect>
+          <line x1="3" y1="9" x2="21" y2="9" stroke="currentColor" stroke-miterlimit="10" stroke-width="2"></line>
+        </g>
+      </svg>
+      <span class="dock-label">Dashboard</span>
+    <% end %>
+
+    <%= link_to analytics_path, 
+        class: "#{current_page?(analytics_path) ? 'dock-active' : ''}", 
+        disabled: signed_in? ? nil : 'disabled',
+        data: { tooltip: signed_in? ? nil : "Please sign in first" } do %>
+      <svg xmlns="http://www.w3.org/2000/svg" class="size-[1.2em]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 12h-4l-3 9L9 3l-3 9H2"></path></svg>
+      <span class="dock-label">Analytics</span>
+    <% end %>
+
+    <%= link_to support_path, 
+        class: "#{current_page?(support_path) ? 'dock-active' : ''}", 
+        disabled: signed_in? ? nil : 'disabled',
+        data: { tooltip: signed_in? ? nil : "Please sign in first" } do %>
+      <svg xmlns="http://www.w3.org/2000/svg" class="size-[1.2em]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"></path></svg>
+      <span class="dock-label">Support</span>
+    <% end %>
+
+    <% if signed_in? %>
+      <%= link_to sign_out_path, data: { turbo_method: :delete } do %>
+        <svg xmlns="http://www.w3.org/2000/svg" class="size-[1.2em]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+          <path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path>
+          <polyline points="16 17 21 12 16 7"></polyline>
+          <line x1="21" y1="12" x2="9" y2="12"></line>
+        </svg>
+        <span class="dock-label">Sign out</span>
+      <% end %>
+    <% else %>
+      <%= link_to sign_in_path do %>
+        <svg xmlns="http://www.w3.org/2000/svg" class="size-[1.2em]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+          <path d="M15 7h3a5 5 0 0 1 0 10h-3"></path>
+          <path d="M6 10a2 2 0 1 1-2-2V6a2 2 0 1 1 2-2h3a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2H6z"></path>
+        </svg>
+        <span class="dock-label">Sign in</span>
+      <% end %>
+    <% end %>
+  </div>
+</div>

data/lib/railsmaker/generators/templates/ui/app/views/layouts/application.html.erb

@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html data-theme="cupcake" lang="en">
+  <head>
+    <title><%%= meta_title %></title>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width,initial-scale=1">
+    <meta name="description" content="<%%= meta_description %>">
+    
+    <!-- Open Graph / Facebook -->
+    <meta property="og:type" content="<%%= meta_tags[:type] %>">
+    <meta property="og:url" content="<%%= meta_tags[:canonical] %>">
+    <meta property="og:title" content="<%%= meta_tags[:title] %>">
+    <meta property="og:description" content="<%%= meta_tags[:description] %>">
+    <meta property="og:image" content="<%%= meta_tags[:image] %>">
+
+    <!-- Twitter -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:url" content="<%%= meta_tags[:canonical] %>">
+    <meta name="twitter:title" content="<%%= meta_tags[:title] %>">
+    <meta name="twitter:description" content="<%%= meta_tags[:description] %>">
+    <meta name="twitter:image" content="<%%= meta_tags[:image] %>">
+
+    <!-- Additional SEO -->
+    <meta name="author" content="<%%= meta_tags[:author] %>">
+    <meta name="robots" content="<%%= meta_tags[:robots] %>">
+    <link rel="canonical" href="<%%= meta_tags[:canonical] %>">
+
+    <%%= csrf_meta_tags %>
+    <%%= csp_meta_tag %>
+
+    <%%= yield :head %>
+
+    <%# Enable PWA manifest for installable apps (make sure to enable in config/routes.rb too!) %>
+    <%#= tag.link rel: "manifest", href: pwa_manifest_path(format: :json) %>
+
+    <link rel="icon" href="/icon.png" type="image/png">
+    <link rel="icon" href="/icon.svg" type="image/svg+xml">
+    <link rel="apple-touch-icon" href="/icon.png">
+
+    <%# Includes all stylesheet files in app/assets/stylesheets %>
+    <%%= stylesheet_link_tag :app, "data-turbo-track": "reload" %>
+    <%%= javascript_include_tag "application", "data-turbo-track": "reload", type: "module" %>
+    <% if plausible_enabled %>
+      <%%# Plausible Analytics %>
+      <script defer data-domain="example.com" src="https://analytics.example.com/js/script.file-downloads.outbound-links.pageview-props.revenue.tagged-events.js"></script>
+      <script>window.plausible = window.plausible || function() { (window.plausible.q = window.plausible.q || []).push(arguments) }</script>
+    <% end %>
+    <% if sentry_enabled %>
+      <%%= Sentry.get_trace_propagation_meta.html_safe if defined?(Sentry) %>
+    <% end %>
+  </head>
+
+  <body class="min-h-screen bg-base-200 flex flex-col">
+    <%%= render "layouts/navbar" unless current_page?(root_path) %>
+    <main class="flex-1 flex flex-col">
+      <%%= render "shared/flash" %>
+      <%%= yield %>
+      <%%= render "shared/footer" %>
+    </main>
+    <%%= render 'shared/structured_data' %>
+  </body>
+</html>