1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-08-10 16:05:22 +02:00

Implement dark mode (#2078)

* User theme settings

* Initial rough pass on colors

* More progress on dark mode
This commit is contained in:
Josh Pigford 2025-04-11 09:28:00 -05:00 committed by GitHub
parent 52d170e36c
commit 88a6373e84
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
98 changed files with 580 additions and 196 deletions

View file

@ -1,17 +1,17 @@
<div class="flex flex-col items-center justify-start h-full p-6 text-center">
<div class="border border-gray-200 rounded-lg p-4 bg-white">
<div class="w-16 h-16 bg-gray-100 rounded-full flex items-center justify-center mx-auto mb-4">
<div class="border border-gray-200 rounded-lg p-4 bg-container">
<div class="w-16 h-16 bg-surface-inset rounded-full flex items-center justify-center mx-auto mb-4">
<%= icon("sparkles") %>
</div>
<h3 class="text-lg font-medium text-gray-900 mb-2">Enable Personal Finance AI</h3>
<h3 class="text-lg font-medium text-primary mb-2">Enable Personal Finance AI</h3>
<p class="text-gray-600 mb-6 text-sm">
<% if Current.user.ai_available? %>
Our personal finance AI can help answer questions about your finances and provide insights based on your data.
To use this feature, you'll need to explicitly enable it.
<% else %>
To use the AI assistant, you need to set the <code class="bg-gray-100 px-1 py-0.5 rounded font-mono text-xs">OPENAI_ACCESS_TOKEN</code>
To use the AI assistant, you need to set the <code class="bg-surface-inset px-1 py-0.5 rounded font-mono text-xs">OPENAI_ACCESS_TOKEN</code>
environment variable in your self-hosted instance.
<% end %>
</p>

View file

@ -5,7 +5,7 @@
<p>Hey <%= Current.user&.first_name || "there" %>! I'm an AI built by Maybe to help with your finances. I have access to the web and your account data.</p>
<p>
You can use <span class="bg-white border border-gray-200 px-1.5 py-0.5 rounded font-mono text-xs">/</span> to access commands
You can use <span class="bg-container border border-gray-200 px-1.5 py-0.5 rounded font-mono text-xs">/</span> to access commands
</p>
<div class="space-y-3">

View file

@ -1,5 +1,5 @@
<%= turbo_frame_tag dom_id(@chat, :title), class: "block" do %>
<% bg_class = params[:ctx] == "chat" ? "bg-white" : "bg-container-inset" %>
<% bg_class = params[:ctx] == "chat" ? "bg-container" : "bg-container-inset" %>
<%= styled_form_with model: @chat,
class: class_names("p-1 rounded-md font-medium text-primary w-full", bg_class),
data: { controller: "auto-submit-form", auto_submit_form_trigger_event_value: "blur" } do |f| %>

View file

@ -15,11 +15,11 @@
<%= render @chats %>
</div>
<% else %>
<div class="text-center py-12 bg-white rounded-lg border border-gray-200">
<div class="w-16 h-16 bg-gray-100 rounded-full flex items-center justify-center mx-auto mb-4">
<div class="text-center py-12 bg-container rounded-lg border border-gray-200">
<div class="w-16 h-16 bg-surface-inset rounded-full flex items-center justify-center mx-auto mb-4">
<%= icon("message-square", size: "lg") %>
</div>
<h3 class="text-lg font-medium text-gray-900 mb-1">No chats yet</h3>
<h3 class="text-lg font-medium text-primary mb-1">No chats yet</h3>
<p class="text-gray-500 mb-4">Start a new conversation with the AI assistant</p>
<%= link_to "Start a chat", new_chat_path, class: "inline-flex items-center gap-2 py-2 px-4 bg-gray-800 text-white rounded-lg text-sm font-medium" %>
</div>