railsui 3.1.0

data/lib/generators/railsui/install/templates/themes/shepherd/views/rui/pages/new_booking.html.erb

@@ -0,0 +1,137 @@
+<div class="max-w-2xl mx-auto px-4 md:py-16 py-6">
+  <nav class="font-heading text-sm mb-6 text-zinc-700 dark:text-zinc-200">
+    <ul class="flex items-center gap-3">
+      <li class="after:content-['/'] after:relative after:text-zinc-300 after:left-1 dark:after:text-zinc-500">
+        <%= link_to "Bookings", rui_bookings_path, class: "text-primary-600 hover:text-primary-700 dark:text-primary-500 dark:hover:text-primary-600" %>
+      </li>
+      <li>
+        <p>New Booking</p>
+      </li>
+    </ul>
+  </nav>
+
+  <h1 class="mb-6 text-4xl font-semibold font-heading text-zinc-900 dark:text-zinc-100 tracking-tight">New Booking</h1>
+
+  <form action="#">
+    <!-- Property -->
+    <div class="form-group">
+      <label for="booking[property]" class="form-label form-label-required">Property</label>
+      <select name="booking[property]" id="booking[property]" class="form-select">
+        <option value="">Select a property</option>
+        <option value="1">Nature's Nook</option>
+        <option value="2">The Haven</option>
+        <option value="3">The Mountain Majesty</option>
+      </select>
+    </div>
+
+    <h3 class="mb-6 pt-10 text-2xl font-semibold font-heading text-zinc-900 dark:text-zinc-100 tracking-tight">Contact Information</h3>
+
+    <div class="prose prose-zinc mb-6 dark:prose-invert">
+      <p>Enter the contact information for the primary guest reserving the property. We recommend collecting both and email and phone number if possible.</p>
+    </div>
+
+    <div class="grid grid-cols-1 sm:grid-cols-2 gap-6 form-group">
+      <!-- Guest name -->
+      <div>
+        <label for="booking[name]" class="form-label form-label-required">Guest name</label>
+        <input type="text" id="booking[name]" class="form-input w-full" placeholder="Andy Leverenz" />
+      </div>
+      <!-- Guest email -->
+      <div>
+        <label for="booking[email]" class="form-label form-label-required">Guest email</label>
+        <input type="email" id="booking[email]" class="form-input w-full" placeholder="andy@railsui.com" />
+      </div>
+    </div>
+
+    <!-- Check-in/Checkout -->
+    <div class="form-group">
+      <label for="booking[checkin_checkout]" class="form-label form-label-required">Check-in/Check-out</label>
+      <a role="button" data-controller="railsui-date-range-picker" class="btn btn-white gap-3 inline-flex items-center">
+        <%= icon "calendar-days", class: "size-5 text-zinc-500 dark:text-zinc-300 shrink-0" %>
+        <span data-railsui-date-range-picker-target="label">Select a date range</span>
+        <input type="hidden" data-railsui-date-range-picker-target="input">
+      </a>
+    </div>
+
+    <div class="grid grid-cols-1 sm:grid-cols-2 gap-6 mb-6">
+      <div>
+        <!-- Mobile number -->
+        <label for="booking[mobile_phone]" class="form-label">Mobile number</label>
+        <div class="relative">
+          <input id="booking[mobile_phone]" type="tel" class="form-input w-full peer pl-14">
+          <span
+            class="w-12 h-[40px] bg-white rounded-l-full flex items-center justify-center absolute left-px top-px border-r border-zinc-300 peer-focus:border-zinc-500 text-zinc-500 peer-focus:text-primary-600 dark:bg-zinc-800 dark:text-zinc-400 dark:border-zinc-500/80">
+            <%= icon "device-phone-mobile", class: "size-5" %>
+          </span>
+        </div>
+        <p class="text-xs text-zinc-500 mt-2 dark:text-zinc-400">Eg. +12015502123</p>
+      </div>
+      <div>
+        <!-- Language -->
+        <label for="booking[language]" class="form-label form-label-required">Language</label>
+        <select name="booking[language]" id="booking[language]" class="form-select">
+          <option value="english" selected>English</option>
+          <option value="spanish">Spanish</option>
+          <option value="french">French</option>
+          <option value="german">German</option>
+          <option value="italian">Italian</option>
+          <option value="chinese">Chinese</option>
+          <option value="japanese">Japanese</option>
+          <option value="korean">Korean</option>
+          <option value="arabic">Arabic</option>
+          <option value="russian">Russian</option>
+        </select>
+      </div>
+    </div>
+
+    <div class="form-group">
+      <label for="booking[notes]" class="form-label">Note</label>
+      <textarea name="booking[notes]" id="booking[notes]" resize class="form-textarea w-full" placeholder="Add a note"></textarea>
+    </div>
+
+    <h3 class="mb-6 pt-10 text-2xl font-semibold font-heading text-zinc-900 dark:text-zinc-100 tracking-tight">Guests</h3>
+
+    <div class="prose prose-zinc mb-6 dark:prose-invert">
+      <p>At least one guest is required to create a new booking. Add additional guests based on the selected property's criteria.</p>
+    </div>
+
+    <div class="grid grid-cols-2 sm:grid-cols-4 gap-6 form-group">
+      <div>
+        <label for="booking[adults]" class="form-label">Adults</label>
+        <input type="number" class="form-input w-full" id="booking[adults]" value="2" min="0" max="25" placeholder="2">
+      </div>
+      <div>
+        <label for="booking[children]" class="form-label">Children</label>
+        <input type="number" class="form-input w-full" id="booking[children]" min="0" max="25" placeholder="0">
+      </div>
+      <div>
+        <label for="booking[infants]" class="form-label">Infants</label>
+        <input type="number" class="form-input w-full" id="booking[infants]" min="0" max="25" placeholder="0">
+      </div>
+      <div>
+        <label for="booking[pets]" class="form-label">Pets</label>
+        <input type="number" class="form-input w-full" id="booking[pets]" min="0" max="5" placeholder="0">
+      </div>
+    </div>
+
+    <h3 class="mb-6 pt-10 text-2xl font-semibold font-heading text-zinc-900 dark:text-zinc-100 tracking-tight">Pricing</h3>
+
+    <div class="prose prose-zinc mb-6 dark:prose-invert">
+      <p>The pricing entered below should include all fees, taxes, and services rendered. It's up to you to communicate the breakdown of such fees to your guest.</p>
+    </div>
+
+    <div class="form-group">
+      <label for="booking[total]" class="form-label">Total</label>
+      <div class="relative">
+        <span
+          class="w-12 h-[40px] bg-white rounded-l-full flex items-center justify-center absolute left-px top-px border-r border-zinc-300 peer-focus:border-zinc-500 text-zinc-500 peer-focus:text-primary-600 font-medium dark:bg-zinc-800 dark:text-zinc-400 dark:border-zinc-500/80">$</span>
+        <input type="number" class="form-input w-full pl-16" placeholder="0.00" min="0" step=".01">
+      </div>
+    </div>
+
+    <div class="grid grid-cols-2 gap-6 pt-10">
+      <%= link_to "Go Back", rui_bookings_path, class: "btn btn-white text-center" %>
+      <input type="submit" value="Create booking" class="btn btn-primary w-full">
+    </div>
+  </form>
+</div>

data/lib/generators/railsui/install/templates/themes/shepherd/views/rui/pages/pricing.html.erb

@@ -0,0 +1,273 @@
+<% content_for :header do %>
+  <div class="absolute bg-gradient-to-br from-primary-500/20 to-secondary-500/20 via-violet/50 blur-3xl w-full h-[500px] z-0 opacity-40"></div>
+
+  <div class="bg-cover h-auto lg:pb-10 pb-0 z-50 relative">
+    <header class="py-4 container mx-auto px-4 text-[15px] lg:flex items-center justify-between" data-controller="railsui-dropdown">
+      <div class="lg:w-auto w-full flex items-center justify-between lg:space-x-3">
+        <%= link_to root_path, class: "group" do %>
+          <svg
+          class="group-hover:brightness-105 group-hover:scale-95 transform ease-in-out duration-200 transition-transform group-hover:-rotate-2 text-zinc-900 fill-current w-10 h-10 dark:text-zinc-100"
+          width="49" height="49" viewBox="0 0 49 49" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path fill-rule="evenodd" clip-rule="evenodd"
+            d="M6 49C2.68629 49 4.04954e-06 46.3137 4.33923e-06 43L7.57388e-06 6C7.86357e-06 2.68629 2.6863 -2.34175e-07 6.00001 5.55182e-08L43 3.29016e-06C46.3137 3.57985e-06 49 2.68629 49 6L49 43C49 46.3137 46.3137 49 43 49L6 49ZM27.0487 7.19884C26.7537 7.15423 26.5152 7.4441 26.5152 7.74239L26.5152 14.1001C26.5152 17.1779 29.847 19.1015 32.5124 17.5626C33.4762 17.0062 34.7087 17.3364 35.2652 18.3002C35.8216 19.2641 35.4914 20.4965 34.5276 21.053C31.8332 22.6085 31.8332 26.4974 34.5276 28.053C35.4914 28.6095 35.8216 29.8419 35.2652 30.8057C34.7087 31.7696 33.4762 32.0998 32.5124 31.5433C29.847 30.0044 26.5151 31.9281 26.5151 35.0059L26.5151 36.5643C26.5151 39.5009 29.1413 41.8187 31.8044 40.5812C37.8253 37.7836 42 31.6824 42 24.6061C42 15.7849 35.5127 8.4789 27.0487 7.19884ZM6.78789 24.6061C6.78789 15.7175 13.3747 8.3674 21.9335 7.17056C22.2405 7.12763 22.4848 7.43239 22.4848 7.74239L22.4848 14.218C22.4848 17.2767 19.1737 19.1884 16.5247 17.6591C15.5609 17.1026 14.3284 17.4328 13.772 18.3967C13.2155 19.3605 13.5457 20.5929 14.5096 21.1494C17.1297 22.6621 17.1297 26.4439 14.5096 27.9566C13.5457 28.513 13.2155 29.7455 13.772 30.7093C14.3284 31.6732 15.5609 32.0034 16.5247 31.4469C19.1737 29.9175 22.4848 31.8293 22.4848 34.888L22.4848 36.5904C22.4848 39.5379 19.8674 41.8799 17.1792 40.6708C11.0533 37.9153 6.78789 31.7588 6.78789 24.6061Z" />
+          </svg>
+        <% end %>
+
+        <button class="lg:hidden block btn btn-white hover:bg-white px-3 dark:hover:bg-zinc-800" role="Mobile navigation toggle" data-action="click->railsui-dropdown#toggle click@window->railsui-dropdown#hide">
+          <%= icon "bars-3-center-left", class: "stroke-current w-8 h-8 text-zinc-600 group-focus:text-primary-500 dark:text-zinc-200" %>
+        </button>
+      </div>
+      <div class="lg:flex hidden justify-between items-center w-full" data-railsui-dropdown-target="menu"
+      data-transition-enter-active="transition ease-out duration-100"
+      data-transition-enter-from="transform opacity-0 scale-95" data-transition-enter-to="transform opacity-100 scale-100"
+      data-transition-leave-active="transition ease-in duration-100"
+      data-transition-leave-from="transform opacity-100 scale-100"
+      data-transition-leave-to="transform opacity-0 scale-95">
+        <nav class="flex-1" role="Primary navigation">
+          <ul
+          class="lg:flex items-center lg:space-x-3 lg:pl-8 lg:mt-0 mt-4 font-heading text-zinc-800 lg:text-[15px] text-lg">
+            <li>
+              <%= nav_link_to "Features", "#", inactive_class: "lg:px-3 py-2 lg:inline-block block hover:bg-opacity-50 rounded hover:text-primary-600 focus:ring-4 focus:ring-zinc-50 font-normal dark:text-zinc-100 dark:hover:text-primary-500 dark:focus:ring-zinc-800", active_class: "lg:px-3 py-2 lg:inline-block block hover:bg-opacity-50 rounded hover:text-primary-600 focus:ring-4 focus:ring-zinc-50 font-normal text-primary-600 dark:text-primary-500 dark:focus:ring-zinc-800" %>
+            </li>
+            <li>
+              <%= nav_link_to "Testimonials", "#", inactive_class: "lg:px-3 py-2 lg:inline-block block hover:bg-opacity-50 rounded hover:text-primary-600 focus:ring-4 focus:ring-zinc-50 font-normal dark:text-zinc-100 dark:hover:text-primary-500 dark:focus:ring-zinc-800", active_class: "lg:px-3 py-2 lg:inline-block block hover:bg-opacity-50 rounded hover:text-primary-600 focus:ring-4 focus:ring-zinc-50 font-normal text-primary-600 dark:text-primary-500 dark:focus:ring-zinc-800" %>
+            </li>
+            <li>
+              <%= nav_link_to "Pricing", rui_pricing_path, inactive_class: "lg:px-3 py-2 lg:inline-block block hover:bg-opacity-50 rounded hover:text-primary-600 focus:ring-4 focus:ring-zinc-50 font-normal dark:text-zinc-100 dark:hover:text-primary-500 dark:focus:ring-zinc-800", active_class: "lg:px-3 py-2 lg:inline-block block hover:bg-opacity-50 rounded hover:text-primary-600 focus:ring-4 focus:ring-zinc-50 font-normal text-primary-600 dark:text-primary-500 dark:focus:ring-zinc-800" %>
+            </li>
+            <li>
+              <%= nav_link_to "About", rui_about_path, inactive_class: "lg:px-3 py-2 lg:inline-block block hover:bg-opacity-50 rounded hover:text-primary-600 focus:ring-4 focus:ring-zinc-50 font-normal dark:text-zinc-100 dark:hover:text-primary-500 dark:focus:ring-zinc-800", active_class: "lg:px-3 py-2 lg:inline-block block hover:bg-opacity-50 rounded hover:text-primary-600 focus:ring-4 focus:ring-zinc-50 font-normal text-primary-600 dark:text-primary-500 dark:focus:ring-zinc-800" %>
+            </li>
+          </ul>
+        </nav>
+
+        <nav>
+          <ul
+          class="flex lg:justify-start justify-between items-center space-x-3 lg:pt-0 pt-6 border-t lg:border-t-0 lg:mt-0 mt-6 text-zinc-700 dark:border-zinc-600/80">
+            <li class="lg:w-auto w-1/2">
+              <%= link_to "Sign in", "#", class: "lg:px-3 lg:py-2 py-[8px] lg:inline-block block hover:bg-opacity-50 hover:text-primary-500 focus:ring-4 focus:ring-zinc-50 lg:w-auto w-full text-center lg:border-0 border lg:rounded-none rounded-full font-heading dark:text-zinc-100 dark:focus:ring-zinc-800" %>
+            </li>
+            <li class="lg:w-auto w-1/2">
+              <%= link_to "Get started", "#", class: "btn btn-primary lg:w-auto w-full flex justify-center" %>
+            </li>
+          </ul>
+        </nav>
+      </div>
+    </header>
+
+    <div class="container mx-auto px-4 lg:pt-24 lg:pb-10 py-14">
+      <h1 class="md:text-5xl text-3xl tracking-tighter font-semibold font-heading text-zinc-900 dark:text-white text-center">No nonsense pricing</h1>
+      <div class="prose sm:prose-lg prose-zinc text-center mx-auto my-6 dark:prose-invert">
+        <p>Transparent and hassle-free pricing that aligns with your real estate investment goals. No hidden fees, just clarity and value.</p>
+      </div>
+
+      <div class="flex justify-center mt-6 group mx-auto max-w-5xl flex-wrap">
+        <div class="inline-flex items-center justify-center rounded-full bg-white p-1 border border-zinc-200 dark:bg-zinc-800 dark:border-zinc-600/80">
+          <button class="btn btn-primary" data-action="click->pricing#toggle"
+            data-pricing-target="intervalBtn">Monthly</button>
+          <button class="btn btn-transparent" data-action="click->pricing#toggle"
+            data-pricing-target="intervalBtn">Annual</button>
+        </div>
+        <div class="w-full pt-6 hidden" data-pricing-target="promotion">
+          <div class="flex justify-center">
+            <span class="rounded-full bg-primary-50 px-3 py-1 text-sm text-primary-600 dark:bg-primary-500/10 dark:text-primary-400">Get <span class="font-semibold">2 months free</span> with annual plans!</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+<% end %>
+
+<div class="max-w-6xl mx-auto px-4 flex flex-wrap justify-between items-start">
+  <div class="lg:w-1/3 w-full lg:pr-6 lg:mb-0 mb-10">
+    <div class="rounded-3xl bg-white border-zinc-300 dark:bg-zinc-800 dark:border-zinc-600/80 border p-6 shadow">
+      <h3 class="h5 text-secondary-500 mt-3">Freelancer</h3>
+      <p class="font-extrabold text-4xl tracking my-2 tight">
+        <span data-pricing-target="price" data-month="$29" data-year="$290" class="dark:text-white">$29</span>
+        <span class="font-normal text-sm text-zinc-600 tracking-normal dark:text-zinc-200"
+            data-pricing-target="interval">/month</span>
+      </p>
+
+      <div class="prose prose-zinc dark:prose-invert">
+        <p>The essentials to get you started.</p>
+      </div>
+      <ul class="mt-6 text-zinc-800 dark:text-zinc-100">
+        <% [
+            { item: "Advanced revenue management" },
+            { item: "Multi-property portfolio management" },
+            { item: "Dedicated account manager" },
+            { item: "Custom integrations and API access" },
+            { item: "Priority customer support" }
+            ].each do |pricing| %>
+          <li class="flex items-center py-3 gap-2">
+            <%= icon "check", class: "size-5 text-secondary-500 shrink-0", variant: :solid %>
+            <p class="leading-tight"><%= pricing[:item] %></p>
+          </li>
+        <% end %>
+      </ul>
+
+      <%= link_to "Get Started", "#", class: "btn btn-secondary w-full mt-6 text-center" %>
+    </div>
+  </div>
+  <div class="lg:w-1/3 lg:px-3 w-full lg:mb-0 mb-10">
+    <div
+        class="rounded-3xl bg-white border-zinc-300 dark:bg-zinc-800 dark:border-zinc-600/80 border p-6 shadow relative">
+      <div class="bg-primary-500 rounded-full px-3 py-1 text-white absolute -top-4 text-sm font-semibold left-4">Most
+        popular</div>
+      <h3 class="h5 text-primary-500 mt-3">Professional</h3>
+      <p class="font-extrabold text-4xl tracking my-2 tight">
+        <span data-pricing-target="price" data-month="$99" data-year="$990" class="dark:text-white">$99</span>
+        <span class="font-normal text-sm text-zinc-600 tracking-normal dark:text-zinc-200"
+            data-pricing-target="interval">/month</span>
+      </p>
+      <div class="prose prose-zinc dark:prose-invert">
+        <p>The plan that packs a punch without breaking the bank.</p>
+      </div>
+      <ul class="mt-6 text-zinc-800 dark:text-zinc-100">
+        <% [
+            { item: "AI-powered pricing optimization" },
+            { item: "Real-time market analysis" },
+            { item: "Automated booking management" },
+            { item: "Customizable property listings" },
+            { item: "Guest communication tools" },
+            { item: "Performance analytics dashboard" }
+            ].each do |pricing| %>
+          <li class="flex items-center gap-2 py-3">
+            <%= icon "check", class: "size-5 text-primary-500 shrink-0", variant: :solid %>
+
+            <p class="leading-tight"><%= pricing[:item] %></p>
+          </li>
+        <% end %>
+      </ul>
+
+      <%= link_to "Get Started", "#", class: "btn btn-primary w-full mt-6 text-center" %>
+    </div>
+  </div>
+  <div class="lg:w-1/3 w-full lg:pl-6 lg:mb-0 mb-10">
+    <div class="bg-white rounded-3xl border-zinc-300 border p-6 shadow-xs dark:bg-zinc-800 dark:border-zinc-600/80 relative">
+      <h3 class="h5 text-zinc-800 my-3 dark:text-zinc-200">Enterprise</h3>
+      <div class="prose prose-zinc dark:prose-invert">
+        <p>A tailored plan for more control.</p>
+      </div>
+      <ul class="mt-6 text-zinc-800 dark:text-zinc-100">
+        <% [
+            { item: "AI-powered pricing optimization" },
+            { item: "Real-time market analysis" },
+            { item: "Automated booking management" },
+            { item: "Customizable property listings" },
+            { item: "Guest communication tools" },
+            { item: "Performance analytics dashboard" },
+            { item: "Revenue forecasting" },
+            { item: "Seasonal demand predictions" },
+            { item: "Integration with major booking platforms" },
+            ].each do |pricing| %>
+          <li class="flex items-center gap-2 py-3">
+            <%= icon "check", class: "size-5 text-zinc-700 dark:text-zinc-500 shrink-0", variant: :solid %>
+
+            <p class="leading-tight"><%= pricing[:item] %></p>
+          </li>
+        <% end %>
+      </ul>
+
+      <%= link_to "Get Started", "#", class: "btn btn-dark dark:bg-zinc-900 dark:hover:bg-zinc-950 w-full mt-6 text-center" %>
+    </div>
+  </div>
+</div>
+
+<div class="bg-primary-500 dark:bg-zinc-800 min-h-[300px] relative mt-20 flex justify-center items-center px-4">
+  <div class="bg-cover inset-0 absolute w-full h-full z-10 mix-blend-multiply bg-no-repeat" style="background-image: url(<%= asset_url('railsui/faq.png') %>);"></div>
+  <div class="relative z-50 text-center">
+    <h3 class="md:h2 h3 !text-white">Frequently Asked Questions</h3>
+    <p class="prose prose-zinc dark:prose-invert text-white mt-6">Looking to get answers faster? Explore our comprehensive list of frequently asked questions to find quick solutions and insights about Shepherd.</p>
+  </div>
+</div>
+
+<div class="divide-y divide-zinc-100 dark:divide-zinc-700 max-w-3xl mx-auto mt-10 px-4">
+  <% [
+      {
+        q: "What does Shepherd do?",
+        a: "Shepherd leverages AI to empower real estate investors, helping them maximize income from vacation rentals."
+      },
+      {
+        q: "How does Shepherd use AI in real estate investment?",
+        a: "Our AI-driven solutions optimize vacation rental performance, ensuring that investors get the most out of their properties."
+      },
+      {
+        q: "Why is optimization important for vacation rentals?",
+        a: "With vacation rentals, money is oftet left on the table if not optimized. Shepherd ensures that investors don't miss out on potential income."
+      },
+      {
+        q: "What makes Shepherd's solutions unique?",
+        a: "We provide investors with greater control over their earnings. Our products offer insights and tools that allow investors to actively shape their financial outcomes."
+      },
+      {
+        q: "How can Shepherd benefit real estate investors?",
+        a: "By leveraging AI, Shepherd helps investors make data-driven decisions, enhance property performance, and ultimately increase their income."
+      },
+      {
+        q: "What types of products does Shepherd offer?",
+        a: "Shepherd offers a range of solutions designed to optimize vacation rental income. From performance analytics to predictive modeling, our products empower investors to make informed choices."
+      },
+      {
+        q: "Can Shepherd work with different property types?",
+        a: "Yes, Shepherd's AI-driven solutions are versatile and can be applied to various types of properties, ensuring benefits for a wide range of real estate investors."
+      },
+      {
+        q: "Is Shepherd suitable for both new and experienced investors?",
+        a: "Absolutely! Whether you're a seasoned investor or just starting, Shepherd's user-friendly tools and insights cater to investors at every level of experience."
+      },
+      {
+        q: "How do I get started with Shepherd?",
+        a: "Getting started is easy. Simply sign up on our platform, and our team will guide you through the setup process to unleash the full potential of your vacation rental investments."
+      },
+      {
+        q: "What kind of support does Shepherd provide?",
+        a: "Shepherd offers dedicated customer support to assist you at every step. From onboarding to ongoing assistance, our team is committed to helping you achieve the best results with our AI-powered solutions."
+      }
+    ].each do |faq| %>
+    <details class="group py-4 marker:content-['']">
+      <summary class="flex w-full cursor-pointer select-none justify-between text-left text-base font-medium leading-7 text-zinc-900 group-open:text-primary-600 dark:group-open:text-primary-500 [&::-webkit-details-marker]:hidden font-heading dark:text-zinc-100">
+        <%= faq[:q] %>
+
+        <svg class="ml-4 mt-0.5 h-6 w-6 flex-none stroke-zinc-700 dark:stroke-zinc-300 group-open:stroke-primary-500"
+          fill="none" xmlns="http://www.w3.org/2000/svg" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+          <path d="M18 12H6"></path>
+          <path class="group-open:hidden" d="M12 6v12"></path>
+        </svg>
+      </summary>
+      <div class="pb-6 pt-6">
+        <div
+          class="prose prose-zinc dark:prose-invert max-w-none prose-a:font-semibold prose-a:text-primary-600 hover:prose-a:text-primary-500">
+          <p><%= faq[:a] %></p>
+        </div>
+      </div>
+    </details>
+  <% end %>
+</div>
+
+<div class="bg-zinc-100 lg:py-36 py-12 lg:mt-32 dark:bg-zinc-900">
+  <div class="max-w-6xl mx-auto px-4 grid grid-cols-1 lg:grid-cols-5 relative">
+    <div class="col-span-2 lg:pr-10 lg:order-1 order-2">
+      <%= icon "newspaper", class: "text-primary-500 size-8 shrink-0" %>
+
+      <h3 class="md:h4 h5 mt-6">Want to read more about what <br class="lg:block hidden" />
+        we're up to every week?</h3>
+
+      <div class="prose prose-zinc dark:prose-invert mt-4">
+        <p>Dive into our weekly newsletter for exclusive insights on the latest in real estate, AI-driven investments, and Shepherd's innovative solutions.</p>
+      </div>
+
+      <form action="#" class="relative mt-6 flex items-center">
+        <input type="text" class="form-input w-full py-3" placeholder="Enter email address">
+        <button class="btn btn-primary border-primary-600 border py-[8px] absolute right-1.5 inset-y-auto">Subscribe</button>
+      </form>
+    </div>
+    <div class="lg:absolute right-0 lg:-top-48 lg:order-2 order-1">
+      <%= image_tag "railsui/read-more-photo.png", alt: "Read more", class: "lg:max-w-2xl max-w-full h-auto" %>
+    </div>
+  </div>
+</div>
+
+<div class="pt-10">
+  <%= render "rui/shared/footer" %>
+</div>

data/lib/generators/railsui/install/templates/themes/shepherd/views/rui/pages/privacy_policy.html.erb

@@ -0,0 +1,74 @@
+<div class="container mx-auto px-4 md:py-16 py-6 mb-24">
+  <article
+    class="prose prose-zinc font-heading mx-auto prose-headings:font-semibold prose-p:font-light prose-ul:font-light prose-ol:font-light font-light dark:prose-invert">
+    <h1>Privacy Policy</h1>
+
+    <p>Welcome to Shepherd, where we guard your data like a faithful sheepdog guards its flock. This Privacy Policy
+      explains how we handle your information. Please remember, this is just a temporary placeholder until our real
+      policy is ready, but we couldn't resist making it doggone fun!</p>
+
+    <h3>1. Sniffing Out Your Data</h3>
+
+    <p>Just like a dog's nose, we're super good at sniffing out information. We collect data to improve our web app, but
+      we
+      promise not to chew on it. The info we gather may include:</p>
+
+    <ul>
+      <li>Your email (we'll guard it like a bone)</li>
+      <li>Usage data (what you click and wag your tail at)</li>
+      <li>Cookies (not the chocolate chip kind)</li>
+    </ul>
+
+    <h3>2. Pawsitive Use of Your Data</h3>
+
+    <p>We use your data to make Shepherd pawsitively amazing! We won't sell it to the mailman, promise. Here's how:</p>
+
+    <ul>
+      <li>To improve our web app (fetching upgrades)</li>
+      <li>To send you important pup-dates</li>
+      <li>To protect against fleas (aka fraud)</li>
+    </ul>
+
+    <h3>3. Bark-tastic Security</h3>
+
+    <p>We'll guard your data like it's a treasure buried in the yard. Our web app is built with Ruby on Rails, a
+      rock-solid fence against unauthorized access. We'll keep the cat burglars away!</p>
+
+    <h3>4. Howlin' Good Cookies</h3>
+
+    <p>Our cookies are as friendly as a Golden Retriever. They help make your Shepherd experience tail-waggingly smooth.
+      You can always fetch them from your browser if you want.</p>
+
+    <h3>5. Your Choices</h3>
+
+    <p>You have the power to roll over or sit whenever you want. You can:</p>
+
+    <ul>
+      <li>Update your info (like a new collar)</li>
+      <li>Unsubscribe from our emails (but we'll miss you)</li>
+      <li>Delete your account</li>
+    </ul>
+
+    <h3>6. Questions?</h3>
+
+    <p>If you have questions, feedback, or just want to woof at us, reach out to our support team. We're here to help,
+      tail-wagging and all!</p>
+
+    <ul>
+      <li>
+        Email: <a href="mailto:support@railsui.com">support@railsui.com</a>
+      </li>
+    </ul>
+
+    <h3>7. End of the Leash</h3>
+
+    <p>That's the tail end of our Privacy Policy for now. Remember, this is just a placeholder until the real deal is
+      ready. Rest assured, we'll keep your data safe and sound.</p>
+
+    <p>Keep an eye out for updates! We promise the real policy will be just as fun and informative as this one.</p>
+
+    <p>Stay pawsitive and enjoy using Shepherd!</p>
+  </article>
+</div>
+
+<%= render "rui/shared/footer" %>