From 82135a872418c4506788ca1ce186980ae30e582b Mon Sep 17 00:00:00 2001 From: Josh Brown Date: Mon, 29 Apr 2024 16:12:05 +0100 Subject: [PATCH] Create reusable newsletter signup component --- app/controllers/signups_controller.rb | 7 +++++++ app/helpers/signups_helper.rb | 7 +++++++ app/views/pages/index.html.erb | 3 ++- app/views/signups/_form.html.erb | 13 ++++++++++++ app/views/signups/create.html.erb | 3 +++ app/views/signups/new.html.erb | 3 +++ config/routes.rb | 1 + config/tailwind.config.js | 23 +++++++++++++++++++++ test/controllers/signups_controller_test.rb | 7 +++++++ 9 files changed, 66 insertions(+), 1 deletion(-) create mode 100644 app/controllers/signups_controller.rb create mode 100644 app/helpers/signups_helper.rb create mode 100644 app/views/signups/_form.html.erb create mode 100644 app/views/signups/create.html.erb create mode 100644 app/views/signups/new.html.erb create mode 100644 test/controllers/signups_controller_test.rb diff --git a/app/controllers/signups_controller.rb b/app/controllers/signups_controller.rb new file mode 100644 index 00000000..3b401eb1 --- /dev/null +++ b/app/controllers/signups_controller.rb @@ -0,0 +1,7 @@ +class SignupsController < ApplicationController + def new + end + + def create + end +end diff --git a/app/helpers/signups_helper.rb b/app/helpers/signups_helper.rb new file mode 100644 index 00000000..5eea6a0f --- /dev/null +++ b/app/helpers/signups_helper.rb @@ -0,0 +1,7 @@ +module SignupsHelper + def render_signup_form + turbo_frame_tag "signup_form" do + render "signups/form" + end + end +end diff --git a/app/views/pages/index.html.erb b/app/views/pages/index.html.erb index 7949e372..11474034 100644 --- a/app/views/pages/index.html.erb +++ b/app/views/pages/index.html.erb @@ -1,5 +1,5 @@
-
+
Maybe <%= image_tag("icon-maybe-color.svg", alt: "Maybe Logo", class: "inline") %> is a fully* *your finances are secure open-source
<%= 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 %> @@ -9,4 +9,5 @@
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") %>
+ <%= render_signup_form %>
diff --git a/app/views/signups/_form.html.erb b/app/views/signups/_form.html.erb new file mode 100644 index 00000000..09cb0e53 --- /dev/null +++ b/app/views/signups/_form.html.erb @@ -0,0 +1,13 @@ +<%= + form_with( + url: signups_path, + ) do |f| +%> +
+ <%= f.email_field :email, placeholder: "Enter your email address", class: "flex-1 border-0 px-2 focus:ring-0 text-sm" %> + <%= f.submit "Join waitlist", class: "py-2 px-3 font-medium text-white bg-neutral-900 rounded-lg hover:bg-neutral-800 border border-neutral-900 text-sm" %> +
+ +

This waitlist is for a hosted version of the app. Don't want to wait? Self-host an early version of Maybe.

+<% end %> + diff --git a/app/views/signups/create.html.erb b/app/views/signups/create.html.erb new file mode 100644 index 00000000..9bc3dfb5 --- /dev/null +++ b/app/views/signups/create.html.erb @@ -0,0 +1,3 @@ + +

Success! You're on the waitlist.

+ diff --git a/app/views/signups/new.html.erb b/app/views/signups/new.html.erb new file mode 100644 index 00000000..9fbc5ac5 --- /dev/null +++ b/app/views/signups/new.html.erb @@ -0,0 +1,3 @@ + + <%= render "form" %> + diff --git a/config/routes.rb b/config/routes.rb index 94a4378e..0b6efede 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -1,5 +1,6 @@ Rails.application.routes.draw do # Define your application routes per the DSL in https://guides.rubyonrails.org/routing.html + resources :signups, only: [:new, :create] # Reveal health status on /up that returns 200 if the app boots with no exceptions, otherwise 500. # Can be used by load balancers and uptime monitors to verify that the app is live. diff --git a/config/tailwind.config.js b/config/tailwind.config.js index 39364deb..f41d6b34 100644 --- a/config/tailwind.config.js +++ b/config/tailwind.config.js @@ -8,6 +8,29 @@ module.exports = { './app/views/**/*.{erb,haml,html,slim}' ], theme: { + boxShadow: { + none: "0 0 #0000", + inner: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)", + xs: "0px 1px 2px 0px rgba(11, 11, 11, 0.05)", + sm: "0px 1px 2px 0px rgba(11, 11, 11, 0.06), 0px 1px 3px 0px rgba(11, 11, 11, 0.10)", + md: "0px 2px 4px -2px rgba(11, 11, 11, 0.06), 0px 4px 8px -2px rgba(11, 11, 11, 0.10)", + lg: "0px 4px 6px -2px rgba(11, 11, 11, 0.03), 0px 12px 16px -4px rgba(11, 11, 11, 0.08)", + xl: "0px 8px 8px -4px rgba(11, 11, 11, 0.03), 0px 20px 24px -4px rgba(11, 11, 11, 0.08)", + "2xl": "0px 24px 48px -12px rgba(11, 11, 11, 0.12)", + "3xl": "0px 32px 64px -12px rgba(11, 11, 11, 0.14)", + }, + borderRadius: { + none: "0", + full: "9999px", + xs: "2px", + sm: "4px", + md: "8px", + DEFAULT: "8px", + lg: "10px", + xl: "12px", + "2xl": "16px", + "3xl": "24px", + }, extend: { fontFamily: { sans: ['Inter var', ...defaultTheme.fontFamily.sans], diff --git a/test/controllers/signups_controller_test.rb b/test/controllers/signups_controller_test.rb new file mode 100644 index 00000000..90fb96d7 --- /dev/null +++ b/test/controllers/signups_controller_test.rb @@ -0,0 +1,7 @@ +require "test_helper" + +class SignupsControllerTest < ActionDispatch::IntegrationTest + # test "the truth" do + # assert true + # end +end