home page has links on it

.devcontainer/devcontainer.json

@@ -35,8 +35,8 @@
   // "postCreateCommand": "bundle install && rake db:setup",
   "postCreateCommand": ".devcontainer/post-create.sh",
   "forwardPorts": [
-    3000, // rails development
+    3000, // rails
-    3001, // rails staging
+    3001, // thrust
     9394, // prometheus exporter
     "pgadmin:8080", // pgadmin
     "grafana:3100", // grafana

Gemfile

@@ -144,11 +144,11 @@ gem "attr_json"
 
 group :production, :staging do
   gem "rails_semantic_logger", "~> 4.17"
+  gem "cloudflare-rails"
 end
 
 group :production do
   gem "sd_notify"
-  gem "cloudflare-rails"
 end
 
 gem "rack", "~> 2.2"

Procfile.staging

@@ -1,4 +1,4 @@
-rails: RAILS_ENV=staging HTTP_PORT=3001 TARGET_PORT=3002 bundle exec thrust ./bin/rails server -p 3002
+rails: RAILS_ENV=staging HTTP_PORT=3001 bundle exec thrust ./bin/rails server
 wp-client: RAILS_ENV=development HMR=true ./bin/webpacker-dev-server
 wp-server: RAILS_ENV=development HMR=true SERVER_BUNDLE_ONLY=yes ./bin/webpacker --watch
 css: RAILS_ENV=development yarn "build:css[debug]" --watch

app/views/domain/posts/index.html.erb

@@ -20,20 +20,6 @@
 <div class="w-full max-w-2xl mx-auto mt-4 text-center sm:mt-6">
   <% index_type_header_partial = "domain/posts/index_type_headers/#{@posts_index_view_config.index_type_header}" %>
   <%= render partial: index_type_header_partial, locals: { user: @user, params: params, posts: @posts } %>
-  <div class="mt-4 flex justify-center gap-4">
-    <% if params[:view] == "table" %>
-      <%= link_to domain_posts_path(view: "gallery"), class: "text-blue-600 hover:text-blue-800" do %>
-        <i class="fas fa-th-large"></i> Gallery View
-      <% end %>
-    <% else %>
-      <%= link_to domain_posts_path(view: "table"), class: "text-blue-600 hover:text-blue-800" do %>
-        <i class="fas fa-table"></i> Table View
-      <% end %>
-    <% end %>
-    <%= link_to visual_search_domain_posts_path, class: "text-blue-600 hover:text-blue-800" do %>
-      <i class="fas fa-search"></i> Visual Search
-    <% end %>
-  </div>
 </div>
 <% if @posts_index_view_config.show_domain_filters %>
   <%= render partial: "domain_filter_controls" %>

app/views/pages/root.html.erb

@@ -1,32 +1,57 @@
-<% content_for :head do %>
-  <%# <%= javascript_pack_tag "application-bundle" %>
-<% end %>
 <div class="mt-2 sm:m-2 sm:p-4">
-  <%= react_component("UserSearchBar", props: {}, prerender: true, strict_mode: true) %>
+  <!-- Primary Action: User Search -->
-  <div
+  <div class="mx-auto max-w-2xl">
-    class="mx-auto mt-2 w-full border-y border-slate-300 bg-slate-50 p-2 shadow-lg sm:max-w-md sm:rounded-xl sm:border"
+    <%= react_component("UserSearchBar", props: {}, prerender: true, strict_mode: true) %>
-  >
+  </div>
-    <div class="space-y-4 p-1">
+  <!-- Navigation Section -->
-      <div class="border-b border-slate-200 pb-3">
+  <div class="mx-auto mt-8 max-w-2xl">
-        <h2 class="font-medium text-slate-700">Questions? Comments? Suggestions?</h2>
+    <div class="rounded-lg border border-slate-200 bg-white p-6 shadow-sm">
-        <div class="mt-2 text-sm text-slate-600">
+      <div class="grid gap-4 sm:grid-cols-2">
-          Contact @DeltaNoises on:
+        <%= link_to domain_posts_path, class: "group flex items-center justify-center gap-3 rounded-lg bg-slate-50 border border-slate-200 p-4 hover:bg-blue-50 hover:border-blue-200 transition-all" do %>
-          <div class="mt-1 flex items-center gap-3">
+          <div class="flex h-8 w-8 items-center justify-center rounded-lg bg-blue-50 group-hover:bg-blue-100">
-            <%= link_to "https://t.me/DeltaNoises", target: "_blank", class: "blue-link inline-flex items-center gap-1" do %>
+            <i class="fas fa-images text-blue-600 group-hover:text-blue-700"></i>
-              <i class="fab fa-telegram"></i> Telegram
-            <% end %>
-            <%= link_to "https://bsky.app/profile/delta.refurrer.com", target: "_blank", class: "blue-link inline-flex items-center gap-1" do %>
-              <i class="fas fa-cloud"></i> BlueSky
-            <% end %>
           </div>
-        </div>
+          <span class="text-sm font-medium text-slate-700 group-hover:text-slate-800">View All Posts</span>
+          <i class="fas fa-arrow-right ml-auto text-xs text-slate-400 group-hover:text-blue-500"></i>
+        <% end %>
+        <%= link_to visual_search_domain_posts_path, class: "group flex items-center justify-center gap-3 rounded-lg bg-slate-50 border border-slate-200 p-4 hover:bg-emerald-50 hover:border-emerald-200 transition-all" do %>
+          <div class="flex h-8 w-8 items-center justify-center rounded-lg bg-emerald-50 group-hover:bg-emerald-100">
+            <i class="fas fa-search text-emerald-600 group-hover:text-emerald-700"></i>
+          </div>
+          <span class="text-sm font-medium text-slate-700 group-hover:text-slate-800">Search by Image</span>
+          <i class="fas fa-upload ml-auto text-xs text-slate-400 group-hover:text-emerald-500"></i>
+        <% end %>
       </div>
-      <div class="text-sm">
+    </div>
-        <span class="rounded-full bg-blue-100 px-2 py-0.5 text-xs font-medium text-blue-700">New</span>
+  </div>
-        <div class="mt-1">
+  <!-- Feature announcement -->
-          Try the <%= link_to "FurAffinity User Recommender",
+  <div class="mx-auto mt-6 max-w-2xl rounded-lg border border-blue-100 bg-blue-50/50 p-4">
-                           furecs_user_script_path,
+    <div class="flex items-start gap-3">
-                           class: "blue-link" %> user script to discover similar artists and users!
+      <span class="rounded-full bg-blue-100 px-2 py-0.5 text-xs font-medium text-blue-800">New</span>
+      <div class="flex-1 text-sm text-slate-700">
+        Try the <%= link_to "FurAffinity User Recommender",
+                         furecs_user_script_path,
+                         class: "text-blue-700 underline decoration-blue-300 underline-offset-2 hover:decoration-blue-500 font-medium" %> user script to discover similar artists and users!
+      </div>
+    </div>
+  </div>
+  <!-- Contact Section -->
+  <div class="mx-auto max-w-2xl">
+    <div class="border-t border-slate-200 pt-8">
+      <div class="text-center">
+        <div class="mb-4">
+          <p class="text-sm text-slate-600">Have questions, suggestions, or found a bug?</p>
+          <p class="text-xs text-slate-500 mt-1">Get in touch with @DeltaNoises</p>
+        </div>
+        <div class="flex flex-col gap-3 sm:flex-row sm:justify-center sm:gap-6">
+          <%= link_to "https://t.me/DeltaNoises", target: "_blank", class: "group inline-flex items-center justify-center gap-2 px-4 py-2 text-sm font-medium text-slate-600 bg-slate-50 border border-slate-200 rounded-lg hover:bg-slate-100 hover:text-slate-700 transition-all" do %>
+            <i class="fab fa-telegram text-blue-500 group-hover:text-blue-600"></i>
+            <span>Message on Telegram</span>
+          <% end %>
+          <%= link_to "https://bsky.app/profile/delta.refurrer.com", target: "_blank", class: "group inline-flex items-center justify-center gap-2 px-4 py-2 text-sm font-medium text-slate-600 bg-slate-50 border border-slate-200 rounded-lg hover:bg-slate-100 hover:text-slate-700 transition-all" do %>
+            <i class="fas fa-cloud text-sky-500 group-hover:text-sky-600"></i>
+            <span>Follow on BlueSky</span>
+          <% end %>
         </div>
       </div>
     </div>