diff --git a/assets/css/app.css b/assets/css/app.css index 378c8f9..6ef5b6b 100644 --- a/assets/css/app.css +++ b/assets/css/app.css @@ -1,5 +1,6 @@ @import "tailwindcss/base"; @import "tailwindcss/components"; @import "tailwindcss/utilities"; - +@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400&display=swap" rel="stylesheet'); +@import url('https://fonts.googleapis.com/css2?family=Racing+Sans+One&display=swap" rel="stylesheet'); /* This file is for your main application CSS */ diff --git a/assets/tailwind.config.js b/assets/tailwind.config.js index 1174033..579ed78 100644 --- a/assets/tailwind.config.js +++ b/assets/tailwind.config.js @@ -13,8 +13,12 @@ module.exports = { ], theme: { extend: { + fontFamily: { + 'racing-sans-one': ['Racing Sans One', 'sans-serif'], + 'ibm-plex-sans': ['IBM Plex Sans', 'sans-serif'], + }, colors: { - brand: "#FD4F00", + brand: "#000000", } }, }, diff --git a/lib/leadfoot_web/components/core_components.ex b/lib/leadfoot_web/components/core_components.ex index 6a8ec61..5371aa5 100644 --- a/lib/leadfoot_web/components/core_components.ex +++ b/lib/leadfoot_web/components/core_components.ex @@ -184,7 +184,7 @@ defmodule LeadfootWeb.CoreComponents do def simple_form(assigns) do ~H""" <.form :let={f} for={@for} as={@as} {@rest}> -
+
<%= render_slot(@inner_block, f) %>
<%= render_slot(action, f) %> diff --git a/lib/leadfoot_web/components/layouts/app.html.heex b/lib/leadfoot_web/components/layouts/app.html.heex index e23bfc8..46445a4 100644 --- a/lib/leadfoot_web/components/layouts/app.html.heex +++ b/lib/leadfoot_web/components/layouts/app.html.heex @@ -1,30 +1,5 @@ -
-
-
- - - -

- v<%= Application.spec(:phoenix, :vsn) %> -

-
- -
-
-
+
+
<.flash_group flash={@flash} /> <%= @inner_content %> diff --git a/lib/leadfoot_web/components/layouts/root.html.heex b/lib/leadfoot_web/components/layouts/root.html.heex index 35f7aa9..21c5877 100644 --- a/lib/leadfoot_web/components/layouts/root.html.heex +++ b/lib/leadfoot_web/components/layouts/root.html.heex @@ -11,48 +11,50 @@ - -
    - <%= if @current_user do %> -
  • - <%= @current_user.email %> -
  • -
  • - <.link - href={~p"/users/settings"} - class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700" - > - Settings - -
  • -
  • - <.link - href={~p"/users/log_out"} - method="delete" - class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700" - > - Log out - -
  • - <% else %> -
  • - <.link - href={~p"/users/register"} - class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700" - > - Register - -
  • -
  • - <.link - href={~p"/users/log_in"} - class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700" - > - Log in - -
  • - <% end %> -
+ +
+
    + <%= if @current_user do %> +
  • + <%= @current_user.email %> +
  • +
  • + <.link + href={~p"/users/settings"} + class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700" + > + Settings + +
  • +
  • + <.link + href={~p"/users/log_out"} + method="delete" + class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700" + > + Log out + +
  • + <% else %> +
  • + <.link + href={~p"/users/register"} + class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700" + > + Register + +
  • +
  • + <.link + href={~p"/users/log_in"} + class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700" + > + Log in + +
  • + <% end %> +
+
<%= @inner_content %> diff --git a/lib/leadfoot_web/live/suspension_calculator_live/view.html.heex b/lib/leadfoot_web/live/suspension_calculator_live/view.html.heex index 65f1352..02e423e 100644 --- a/lib/leadfoot_web/live/suspension_calculator_live/view.html.heex +++ b/lib/leadfoot_web/live/suspension_calculator_live/view.html.heex @@ -1,81 +1,114 @@ -
-
+
+
+

LEADFOOT

+

+ Suspension Calculator +

+
+
+ + + + +
+
+
+
<.simple_form for={@form} id="form" phx-change="validate" phx-submit="save"> -
- <.input class="w-full" field={@form[:mass]} label="Mass" inputmode="numeric" /> - <.input - class="w-full" - field={@form[:front_distribution]} - type="text" - label="Front Distribution" - inputmode="numeric" - /> - -
-
- <.input - class="w-full" - field={@form[:front_spring_rate]} - type="text" - label="Front Spring Rate" - inputmode="numeric" - /> -
- -
- <.input - class="w-full" - field={@form[:rear_spring_rate]} - type="text" - label="Rear Spring Rate" - inputmode="numeric" - /> -
+
+
+ <.input class="w-full" field={@form[:mass]} label="Mass" inputmode="numeric" />
- -
-
- <.input - class="w-full" - field={@form[:front_downforce]} - type="text" - label="Front Downforce" - inputmode="numeric" - /> -
- -
- <.input - class="w-full" - field={@form[:rear_downforce]} - type="text" - label="Rear Downforce" - inputmode="numeric" - /> -
+
+ <.input + class="w-full" + field={@form[:front_distribution]} + type="text" + label="Front Distribution" + inputmode="numeric" + /> +
+
+
+
+ <.input + class="w-full" + field={@form[:front_spring_rate]} + type="text" + label="Front Spring Rate" + inputmode="numeric" + />
+
+ <.input + class="w-full" + field={@form[:rear_spring_rate]} + type="text" + label="Rear Spring Rate" + inputmode="numeric" + /> +
+
+
+
+ <.input + class="w-full" + field={@form[:front_downforce]} + type="text" + label="Front Downforce" + inputmode="numeric" + /> +
+
+ <.input + class="w-full" + field={@form[:rear_downforce]} + type="text" + label="Rear Downforce" + inputmode="numeric" + /> +
+
+
<.button type="submit">Calculate
- -
front: <%= Float.round(@front_frequency, 2) %> Hz
-
rear: <%= Float.round(@rear_frequency, 2) %> Hz
-
ratio: <%= Float.round(@ratio, 2) %>
- -
with downforce
- -
front: <%= Float.round(@front_with_downforce, 2) %> Hz
-
rear: <%= Float.round(@rear_with_downforce, 2) %> Hz
-
ratio: <%= Float.round(@ratio_with_downforce, 2) %>
-
-

All units are metric.

-

- Suspension frequencies are a good starting point but the best spring rate will not come from a calculator. -

-

A faster spring frequency means the car will be more responsive.

-

Usually, the front frequency should be the same or lower than the rear frequency.

-

To start, try 2.0 Hz in front and 2.2 Hz in rear.

+
+
+
+
Without Downforce
+
Front: <%= Float.round(@front_frequency, 2) %> Hz
+
Rear: <%= Float.round(@rear_frequency, 2) %> Hz
+
Ratio: <%= Float.round(@ratio, 2) %>
+
With Downforce
+
Front: <%= Float.round(@front_with_downforce, 2) %> Hz
+
Rear: <%= Float.round(@rear_with_downforce, 2) %> Hz
+
Ratio: <%= Float.round(@ratio_with_downforce, 2) %>