Header styling

jemiluv8 · Apr 24, 2024 · d7c65d4 · d7c65d4
1 parent eb37b08
commit d7c65d4
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 11 deletions.
diff --git a/app/controllers/pages_controller.rb b/app/controllers/pages_controller.rb
@@ -3,20 +3,20 @@
 
 class PagesController < ApplicationController
   def index
-    @stargazers_count = Rails.cache.fetch("stargazers_count", expires_in: 24.hours) do
-      fetch_stargazers_count
+    @stars = Rails.cache.fetch("stargazers_count", expires_in: 24.hours) do
+      fetch_stars_count
     end
   end
 
   private
 
-  def fetch_stargazers_count
+  def fetch_stars_count
     url = URI("https://ungh.cc/repos/maybe-finance/maybe")
     response = Net::HTTP.get(url)
     json = JSON.parse(response)
     json["repo"]["stars"]
   rescue StandardError => e
-    Rails.logger.error "Failed to fetch stargazers count: #{e.message}"
+    Rails.logger.error "Failed to fetch stars count: #{e.message}"
     nil
   end
 end
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -22,16 +22,17 @@
 
   <body class="min-h-screen bg-gradient-to-b from-neutral-50 to-neutral-100">
     <header class="flex items-center justify-between py-5 px-7">
-      <div class="flex items-center">
+      <div class="flex items-center gap-x-3">
         <%= link_to image_tag('logo.svg', alt: 'Maybe Logo', class: 'h-6'), root_path %>
+        <span class="px-1.5 py-0.5 text-[0.1em] uppercase bg-white border rounded-full border-neutral-200/75 text-neutral-500">Early Access</span>
       </div>
-      <nav class="flex-1 text-sm text-center">
-        <a href="#" class="mx-4 text-neutral-800 hover:text-neutral-900">Articles</a>
-        <a href="#" class="mx-4 text-neutral-800 hover:text-neutral-900">Resources</a>
-        <a href="#" class="mx-4 text-neutral-800 hover:text-neutral-900">Contribute</a>
+      <nav class="flex-1 text-sm text-center gap-x-1">
+        <a href="#" class="px-3 py-1.5 text-neutral-800 hover:text-neutral-900 hover:bg-neutral-200/60 rounded-xl">Articles</a>
+        <a href="#" class="px-3 py-1.5 text-neutral-800 hover:text-neutral-900 hover:bg-neutral-200/60 rounded-xl">Glossary</a>
+        <a href="https://github.com/maybe-finance/maybe" class="px-3 py-1.5 text-neutral-800 hover:text-neutral-9000 hover:bg-neutral-200/60 rounded-xl">Contribute</a>
       </nav>
       <div class="flex gap-x-2">
-        <%= link_to 'https://github.com/maybe-finance/maybe', class: "px-3 py-[0.45rem] text-sm font-medium text-black bg-neutral-900 rounded-xl hover:bg-neutral-800 bg-transparent border border-neutral-300 hover:border-neutral-400 hover:bg-neutral-100 flex items-center gap-2" do %>
+        <%= link_to 'https://github.com/maybe-finance/maybe', class: "px-3 py-[0.45rem] text-sm font-medium text-black bg-neutral-900 rounded-xl hover:bg-neutral-200/50 bg-transparent border border-neutral-300 hover:border-neutral-300 flex items-center gap-2" do %>
           <%= image_tag('icon-github.svg', alt: 'GitHub icon', class: 'h-4 w-4') %> Self-Host
         <% end %>
         <%= link_to 'Join waitlist', '#', class: "px-3 py-[0.45rem] text-sm font-medium text-white bg-neutral-900 rounded-xl hover:bg-neutral-800 border border-neutral-900" %>

diff --git a/app/views/pages/index.html.erb b/app/views/pages/index.html.erb
@@ -5,7 +5,7 @@
       <%= link_to 'https://github.com/maybe-finance/maybe', class: "px-2 py-1.5 border-r shadow-[inset_0_-2px_5px_0_rgba(0,0,0,0.07)] bg-neutral-100 rounded-l-md border-neutral-200 flex items-center justify-center" do %>
         <%= image_tag('icon-github.svg', alt: 'GitHub icon', class: 'h-5 w-5') %>
       <% end %>
-      <span class="px-2 py-1.5 text-sm font-medium bg-white shadow-[inset_0_-2px_5px_0_rgba(0,0,0,0.07)] rounded-r-md"><%= number_to_human(@stargazers_count, format: "%n%u", units: { thousand: "k" }) %></span>
+      <span class="px-2 py-1.5 text-sm font-medium bg-white shadow-[inset_0_-2px_5px_0_rgba(0,0,0,0.07)] rounded-r-md"><%= number_to_human(@stars, format: "%n%u", units: { thousand: "k" }) %></span>
     </div> 
     OS for your personal finances <%= image_tag('icon-chart.svg', alt: 'Chart', class: 'inline') %> built by a small team <%= image_tag('icon-team.png', alt: 'Maybe Team', class: 'inline h-9') %> alongside an incredible community <%= image_tag('icon-discord.svg', alt: 'Discord', class: 'inline') %>
   </div>