feat: added donation page

frontend/src/Config/CardFormat.elm

@@ -128,6 +128,8 @@ cardTitleMaker title =
         [ text title ]
 
 
-fieldSpacer : Attribute msg
+fieldSpacer : List (Attribute msg)
 fieldSpacer =
-    spacing 8
+    [ spacing 8
+    , width fill
+    ]

frontend/src/Config/Identity.elm

@@ -87,6 +87,6 @@ servicesName =
     createPageName pageNames.pageServices
 
 
-supportName : String
+donateName : String
-supportName =
+donateName =
     createPageName pageNames.pageDonate

frontend/src/Config/StrengthBar.elm

@@ -37,3 +37,17 @@ barMaker getTooltip num =
             ++ [ tooltip (getTooltip num) ]
         )
         none
+
+
+barPadding : List (Element msg) -> Element msg
+barPadding =
+    column
+        [ E.width fill
+        , E.alignLeft
+        , paddingEach
+            { top = 0
+            , right = 0
+            , bottom = 0
+            , left = 10
+            }
+        ]

frontend/src/Cuckery/Helpers.elm

@@ -27,8 +27,7 @@ cuckMaker cuck =
             , cardFormatter
                 [ cardContentSpacing
                     [ column
-                        [ fieldSpacer
+                        fieldSpacer
-                        ]
                         [ socialMaker cuck
                         , dodgeTitle cuck
                         , dodgeMaker cuck

frontend/src/Debate/Helpers.elm

@@ -32,8 +32,7 @@ argumentMaker argument =
             , cardFormatter
                 [ cardContentSpacing
                     [ column
-                        [ fieldSpacer
+                        fieldSpacer
-                        ]
                         [ propositionMaker argument
                         , reductioMaker argument
                         , summaryMaker argument
@@ -182,7 +181,7 @@ strengthMaker argument =
             [ paragraph
                 (paragraphBoldFormat
                     ++ [ F.size 18
-                       , E.width <| px 100
+                       , E.width fill
                        ]
                 )
                 [ el
@@ -193,11 +192,7 @@ strengthMaker argument =
                     |> el [ F.color colourTheme.textLightOrange ]
                 ]
             ]
-        , column
+        , barPadding
-            [ E.width fill
-            , E.alignLeft
-            , centerY
-            ]
             [ barMaker getConfidenceTooltip argument.argumentCertainty ]
         ]
 

frontend/src/Donate/Helpers.elm

@@ -0,0 +1,245 @@
+module Donate.Helpers exposing (..)
+
+import Config.CardFormat exposing (..)
+import Config.Colour exposing (..)
+import Config.Format exposing (..)
+import Config.StrengthBar exposing (..)
+import Config.ToolTip exposing (..)
+import Donate.Types exposing (..)
+import Effect exposing (Effect)
+import Element as E exposing (..)
+import Element.Background as B exposing (..)
+import Element.Border as D
+import Element.Font as F
+import Html.Attributes as H exposing (style)
+import Layouts
+import Page exposing (Page)
+import Route exposing (Route)
+import Shared
+import View exposing (View)
+
+
+donateMaker : Donate -> Element msg
+donateMaker donate =
+    row
+        topLevelBox
+        [ cardImageMaker (donateImage donate)
+        , cardMaker
+            [ cardTitleMaker (donateTitle donate)
+            , cardFormatter
+                [ cardContentSpacing
+                    [ column
+                        fieldSpacer
+                        [ feeMaker donate
+                        , preferenceMaker donate
+                        , proTitleMaker donate
+                        , proMaker donate
+                        , conTitleMaker donate
+                        , conMaker donate
+                        ]
+                    ]
+                ]
+            ]
+        ]
+
+
+donateImage :
+    Donate
+    ->
+        { src : String
+        , description : String
+        }
+donateImage donate =
+    { src = "donate/" ++ donate.donateImage ++ ".png"
+    , description = donate.donateName
+    }
+
+
+donateTitle : Donate -> String
+donateTitle donate =
+    donate.donateName
+
+
+donateWidth =
+    width <| px 45
+
+
+feeMaker : Donate -> Element msg
+feeMaker donate =
+    row
+        (paragraphBoldFormat
+            ++ [ F.size 18
+               , E.width fill
+               ]
+        )
+        [ column
+            [ alignTop
+            , donateWidth
+            ]
+            [ text "Fees:"
+            ]
+        , column
+            [ E.width fill
+            , alignLeft
+            ]
+            [ paragraph [ F.regular ]
+                [ el [ F.color colourTheme.textLightOrange ] <|
+                    text donate.donateFees
+                ]
+            ]
+        ]
+
+
+proTitleMaker : Donate -> Element msg
+proTitleMaker donate =
+    row paragraphBoldFormat
+        [ column
+            [ alignTop
+            , width <| px 80
+            ]
+            [ text "Pros:"
+            ]
+        ]
+
+
+conTitleMaker : Donate -> Element msg
+conTitleMaker donate =
+    row paragraphBoldFormat
+        [ column
+            [ alignTop
+            , width <| px 80
+            ]
+            [ text "Cons:"
+            ]
+        ]
+
+
+proMaker : Donate -> Element msg
+proMaker donate =
+    column
+        [ spacing 8
+        , width fill
+        , paddingEach
+            { top = 0
+            , right = 0
+            , bottom = 0
+            , left = 35
+            }
+        ]
+    <|
+        List.map2 (\x y -> makePro x)
+            donate.donatePros
+            (List.range 1 (List.length donate.donatePros))
+
+
+makePro : Pros -> Element msg
+makePro pro =
+    column
+        (paragraphAlignLeft
+            ++ [ spacing 8
+               , width fill
+               ]
+        )
+        [ paragraph [ F.regular ]
+            [ text ("‣ " ++ pro.pro) ]
+        ]
+
+
+conMaker : Donate -> Element msg
+conMaker donate =
+    column
+        [ spacing 8
+        , width fill
+        , paddingEach
+            { top = 0
+            , right = 0
+            , bottom = 0
+            , left = 35
+            }
+        ]
+    <|
+        List.map2 (\x y -> makeCon x)
+            donate.donateCons
+            (List.range 1 (List.length donate.donateCons))
+
+
+makeCon : Cons -> Element msg
+makeCon con =
+    column
+        (paragraphAlignLeft
+            ++ [ spacing 8
+               , width fill
+               ]
+        )
+        [ paragraph [ F.regular ]
+            [ text ("‣ " ++ con.con) ]
+        ]
+
+
+preferenceMaker : Donate -> Element msg
+preferenceMaker donate =
+    row
+        [ width fill
+        , height fill
+        ]
+        [ column
+            [ E.alignTop
+            , E.alignLeft
+            ]
+            [ paragraph
+                (paragraphBoldFormat
+                    ++ [ F.size 18
+                       , alignLeft
+                       , E.width fill
+                       ]
+                )
+                [ el
+                    [ tooltip
+                        "This represents how pleasant it was to interact with the host(s)."
+                    ]
+                    (text "Preference:")
+                ]
+            ]
+        , barPadding
+            [ barMaker getPreferenceTooltip donate.donatePreference ]
+        ]
+
+
+getPreferenceTooltip : Int -> String
+getPreferenceTooltip num =
+    case num of
+        0 ->
+            "Disdain this platform."
+
+        1 ->
+            "Very negative towards this platform."
+
+        2 ->
+            "Strongly dislike this platform."
+
+        3 ->
+            "Dislike this platform."
+
+        4 ->
+            "Somewhat dislike this platform."
+
+        5 ->
+            "Neutral, no strong feelings."
+
+        6 ->
+            "Somewhat like this platform."
+
+        7 ->
+            "Like this platform."
+
+        8 ->
+            "Strongly like this platform."
+
+        9 ->
+            "Very positive towards this platform."
+
+        10 ->
+            "Absolutely love this platform!"
+
+        _ ->
+            "Preference is out of bounds."

frontend/src/Donate/Methods/Cardano.elm

@@ -0,0 +1,50 @@
+module Donate.Methods.Cardano exposing (..)
+
+import Donate.Types exposing (..)
+
+
+donateCardano : Donate
+donateCardano =
+    let
+        name : String
+        name =
+            "Cardano"
+    in
+    { donateImage = formatName name
+    , donateLink = "https://handle.me/thenutrivore"
+    , donateName = name
+    , donateFees = "0.17 ADA"
+    , donatePreference = 6
+    , donateFeatures =
+        [ { fees = Just True
+          , subscriptions = Just False
+          , openSource = Just True
+          , fastPayments = Just True
+          , userFriendly = Just False
+          , anonymous = Just True
+          , rewardTiers = Just False
+          }
+        ]
+    , donatePros =
+        [ { pro = "Blockchain-based peer-to-peer donations."
+          }
+        , { pro = "Open source, state-of-the-art cryptocurrency."
+          }
+        , { pro = "Extremely fast transactions."
+          }
+        , { pro = "Extremely minimal gas fees per transaction."
+          }
+        , { pro = "Decentralized cryptocurrency platform."
+          }
+        ]
+    , donateCons =
+        [ { con = "Less accessible for non-crypto users."
+          }
+        , { con = "Requires cryptocurrency knowledge."
+          }
+        , { con = "Volatile cryptocurrency market."
+          }
+        , { con = "Additional steps needed (wallet, exchange)."
+          }
+        ]
+    }

frontend/src/Donate/Methods/KoFi.elm

@@ -0,0 +1,42 @@
+module Donate.Methods.KoFi exposing (..)
+
+import Donate.Types exposing (..)
+
+
+donateKoFi : Donate
+donateKoFi =
+    let
+        name : String
+        name =
+            "Ko-Fi"
+    in
+    { donateImage = formatName name
+    , donateLink = "https://ko-fi.com/thenutrivore"
+    , donateName = name
+    , donateFees = "5%"
+    , donatePreference = 5
+    , donateFeatures =
+        [ { fees = Just True
+          , subscriptions = Just True
+          , openSource = Just False
+          , fastPayments = Just False
+          , userFriendly = Just True
+          , anonymous = Just True
+          , rewardTiers = Just False
+          }
+        ]
+    , donatePros =
+        [ { pro = "Supports one-time and monthly donations."
+          }
+        , { pro = "Allows digital downloads and commissions."
+          }
+        , { pro = "Relatively simple platform."
+          }
+        ]
+    , donateCons =
+        [ { con = "Less feature-rich compared to other services."
+          }
+        , { con = "Smaller user base compared to more established platforms."
+          }
+        ]
+    }

frontend/src/Donate/Methods/LiberaPay.elm

@@ -0,0 +1,46 @@
+module Donate.Methods.LiberaPay exposing (..)
+
+import Donate.Types exposing (..)
+
+
+donateLiberaPay : Donate
+donateLiberaPay =
+    let
+        name : String
+        name =
+            "LiberaPay"
+    in
+    { donateImage = formatName name
+    , donateLink = "https://liberapay.com/TheNutrivore"
+    , donateName = name
+    , donateFees = "0%"
+    , donatePreference = 10
+    , donateFeatures =
+        [ { fees = Just True
+          , subscriptions = Just True
+          , openSource = Just True
+          , fastPayments = Just False
+          , userFriendly = Just True
+          , anonymous = Just True
+          , rewardTiers = Just False
+          }
+        ]
+    , donatePros =
+        [ { pro = "Open-source platform."
+          }
+        , { pro = "Focuses on privacy and transparency."
+          }
+        , { pro = "Allows weekly recurring donations."
+          }
+        , { pro = "Creator-friendly with no platform charges."
+          }
+        ]
+    , donateCons =
+        [ { con = "Less mainstream compared to other platforms."
+          }
+        , { con = "Fewer features compared to more established platforms."
+          }
+        , { con = "Requires users to be comfortable with a less-known service."
+          }
+        ]
+    }

frontend/src/Donate/Methods/Merch.elm

@@ -0,0 +1,42 @@
+module Donate.Methods.Merch exposing (..)
+
+import Donate.Types exposing (..)
+
+
+donateMerch : Donate
+donateMerch =
+    let
+        name : String
+        name =
+            "Merch"
+    in
+    { donateImage = formatName name
+    , donateLink = "https://streamlabs.com/thenutrivore/merch"
+    , donateName = name
+    , donateFees = "~60%"
+    , donatePreference = 1
+    , donateFeatures =
+        [ { fees = Just True
+          , subscriptions = Just False
+          , openSource = Just False
+          , fastPayments = Just False
+          , userFriendly = Just True
+          , anonymous = Just False
+          , rewardTiers = Just False
+          }
+        ]
+    , donatePros =
+        [ { pro = "Allows supporters to get tangible goods."
+          }
+        , { pro = "Potential for creative design opportunities."
+          }
+        ]
+    , donateCons =
+        [ { con = "They gouge me pretty hard per sale."
+          }
+        , { con = "Potentially expensive for supporters."
+          }
+        , { con = "Limited design options through current provider."
+          }
+        ]
+    }

frontend/src/Donate/Methods/Patreon.elm

@@ -0,0 +1,46 @@
+module Donate.Methods.Patreon exposing (..)
+
+import Donate.Types exposing (..)
+
+
+donatePatreon : Donate
+donatePatreon =
+    let
+        name : String
+        name =
+            "Patreon"
+    in
+    { donateImage = formatName name
+    , donateLink = "https://www.patreon.com/thenutrivore"
+    , donateName = name
+    , donateFees = "5%"
+    , donatePreference = 6
+    , donateFeatures =
+        [ { fees = Just True
+          , subscriptions = Just True
+          , openSource = Just False
+          , fastPayments = Just False
+          , userFriendly = Just True
+          , anonymous = Just False
+          , rewardTiers = Just False
+          }
+        ]
+    , donatePros =
+        [ { pro = "Established platform for creator support."
+          }
+        , { pro = "Tools for managing patron relationships."
+          }
+        , { pro = "Enables exclusive content and perks."
+          }
+        , { pro = "Wide recognition among content creators and supporters."
+          }
+        ]
+    , donateCons =
+        [ { con = "Can be complex to set up and manage."
+          }
+        , { con = "Potential for high competition among creators."
+          }
+        , { con = "Platform takes a notable cut of creator earnings."
+          }
+        ]
+    }

frontend/src/Donate/Methods/PayPal.elm

@@ -0,0 +1,46 @@
+module Donate.Methods.PayPal exposing (..)
+
+import Donate.Types exposing (..)
+
+
+donatePayPal : Donate
+donatePayPal =
+    let
+        name : String
+        name =
+            "PayPal"
+    in
+    { donateImage = formatName name
+    , donateLink = "https://paypal.me/TheNutrivore"
+    , donateName = name
+    , donateFees = "1%"
+    , donatePreference = 8
+    , donateFeatures =
+        [ { fees = Just True
+          , subscriptions = Just False
+          , openSource = Just False
+          , fastPayments = Just True
+          , userFriendly = Just True
+          , anonymous = Just False
+          , rewardTiers = Just False
+          }
+        ]
+    , donatePros =
+        [ { pro = "Widely used and recognized globally"
+          }
+        , { pro = "Low 1% transaction fee"
+          }
+        , { pro = "Offers buyer and seller protections"
+          }
+        , { pro = "Easy to use for one-time and recurring donations"
+          }
+        , { pro = "Familiar to most internet users"
+          }
+        ]
+    , donateCons =
+        [ { con = "Can have complicated international transaction rules."
+          }
+        , { con = "Potential account limitations or freezes."
+          }
+        ]
+    }

frontend/src/Donate/Methods/Template.elm

@@ -0,0 +1,35 @@
+module Donate.Methods.Template exposing (..)
+
+import Donate.Types exposing (..)
+
+
+donateTemplate : Donate
+donateTemplate =
+    let
+        name : String
+        name =
+            ""
+    in
+    { donateImage = formatName name
+    , donateLink = ""
+    , donateName = name
+    , donateFees = ""
+    , donatePreference = 1
+    , donateFeatures =
+        [ { fees = Just True
+          , subscriptions = Just True
+          , openSource = Just True
+          , fastPayments = Just False
+          , userFriendly = Just True
+          , anonymous = Just True
+          , rewardTiers = Just False
+          }
+        ]
+    , donatePros =
+        [ { pro = ""
+          }
+        ]
+    , donateCons =
+        [ { con = "" }
+        ]
+    }

frontend/src/Donate/Methods/YouTube.elm

@@ -0,0 +1,48 @@
+module Donate.Methods.YouTube exposing (..)
+
+import Donate.Types exposing (..)
+
+
+donateYouTube : Donate
+donateYouTube =
+    let
+        name : String
+        name =
+            "YouTube"
+    in
+    { donateImage = formatName name
+    , donateLink = "https://www.youtube.com/@TheNutrivore/membership"
+    , donateName = name
+    , donateFees = "45%"
+    , donatePreference = 3
+    , donateFeatures =
+        [ { fees = Just True
+          , subscriptions = Just True
+          , openSource = Just False
+          , fastPayments = Just False
+          , userFriendly = Just True
+          , anonymous = Just True
+          , rewardTiers = Just True
+          }
+        ]
+    , donatePros =
+        [ { pro = "Extremely familiar platform that most people use anyway."
+          }
+        , { pro = "Built-in monetization through ad revenue sharing."
+          }
+        ]
+    , donateCons =
+        [ { con = "Extremely high platform cut (45% of ad revenue)."
+          }
+        , { con = "Content can be demonetized arbitrarily."
+          }
+        , { con = "Complicated and often changing monetization policies."
+          }
+        , { con = "High competition and algorithm dependency."
+          }
+        , { con = "Limited creator control over content visibility."
+          }
+        , { con = "Creators are easily censored."
+          }
+        ]
+    }

frontend/src/Donate/Types.elm

@@ -0,0 +1,40 @@
+module Donate.Types exposing (..)
+
+
+type alias Donate =
+    { donateImage : String
+    , donateLink : String
+    , donateName : String
+    , donateFees : String
+    , donatePreference : Int
+    , donatePros : List Pros
+    , donateCons : List Cons
+    , donateFeatures : List Features
+    }
+
+
+type alias Features =
+    { fees : Maybe Bool
+    , subscriptions : Maybe Bool
+    , openSource : Maybe Bool
+    , fastPayments : Maybe Bool
+    , userFriendly : Maybe Bool
+    , anonymous : Maybe Bool
+    , rewardTiers : Maybe Bool
+    }
+
+
+type alias Pros =
+    { pro : String
+    }
+type alias Cons =
+    { con : String
+    }
+
+
+formatName : String -> String
+formatName name =
+    name
+        |> String.toLower
+        |> String.replace " " ""
+        |> String.replace "-" ""

frontend/src/Interviews/Episodes/Template.elm

@@ -0,0 +1,30 @@
+module Interviews.Episodes.Template exposing (..)
+
+import Interviews.Types exposing (..)
+
+
+template : Interview
+template =
+    let
+        name : String
+        name =
+            ""
+    in
+    { interviewName = name
+    , interviewImage = formatInterviewName name
+    , interviewSocial = ""
+    , interviewAppearances =
+        [ { appearanceTitle = ""
+          , appearanceEpisode = ""
+          , appearanceLink = ""
+          , appearanceExperience = 1
+          , appearanceYear = ""
+          , appearanceSubjects =
+                [ { subject = "" }
+                , { subject = "" }
+                , { subject = "" }
+                , { subject = "" }
+                ]
+          }
+        ]
+    }

frontend/src/Interviews/Helpers.elm

@@ -30,9 +30,7 @@ interviewMaker interview =
             , cardFormatter
                 [ cardContentSpacing
                     [ column
-                        [ fieldSpacer
+                        fieldSpacer
-                        , width fill
-                        ]
                         [ socialMaker interview
                         , appearanceTitle interview
                         , appearanceMaker interview
@@ -160,7 +158,12 @@ experienceMaker appearanceEntry =
             [ E.alignTop
             , E.alignLeft
             ]
-            [ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 112 ])
+            [ paragraph
+                (paragraphBoldFormat
+                    ++ [ F.size 18
+                       , E.width fill
+                       ]
+                )
                 [ el
                     [ tooltip
                         "This represents how pleasant it was to interact with the host(s)."
@@ -168,12 +171,7 @@ experienceMaker appearanceEntry =
                     (text "Pleasantness:")
                 ]
             ]
-        , column
+        , barPadding
-            [ E.width fill
-            , E.alignLeft
-            , centerY
-            , height fill
-            ]
             [ barMaker getExperienceTooltip appearanceEntry.appearanceExperience ]
         ]
 

frontend/src/Pages/Arguments.elm

@@ -133,7 +133,7 @@ subscriptions model =
 
 view : Model -> View Msg
 view model =
-    { title = dodgersName
+    { title = debateName
     , attributes = []
     , element = debateContainer
     }

frontend/src/Pages/Donate.elm

@@ -0,0 +1,112 @@
+module Pages.Donate exposing (Model, Msg, page)
+
+import Config.Colour as T exposing (..)
+import Config.Format as O exposing (..)
+import Config.Identity as I exposing (..)
+import Donate.Helpers exposing (..)
+import Donate.Methods.Cardano exposing (donateCardano)
+import Donate.Methods.KoFi exposing (donateKoFi)
+import Donate.Methods.LiberaPay exposing (donateLiberaPay)
+import Donate.Methods.Merch exposing (donateMerch)
+import Donate.Methods.Patreon exposing (donatePatreon)
+import Donate.Methods.PayPal exposing (donatePayPal)
+import Donate.Methods.YouTube exposing (donateYouTube)
+import Effect exposing (Effect)
+import Element exposing (..)
+import Element.Font as F
+import Html.Attributes as H exposing (style)
+import Layouts
+import Page exposing (Page)
+import Route exposing (Route)
+import Shared exposing (..)
+import View exposing (View)
+
+
+page : Shared.Model -> Route () -> Page Model Msg
+page shared route =
+    Page.new
+        { init = init
+        , update = update
+        , subscriptions = subscriptions
+        , view = view
+        }
+        |> Page.withLayout toLayout
+
+
+toLayout : Model -> Layouts.Layout Msg
+toLayout model =
+    Layouts.Navbar {}
+
+
+
+-- INIT
+
+
+type alias Model =
+    {}
+
+
+init : () -> ( Model, Effect Msg )
+init () =
+    ( {}
+    , Effect.none
+    )
+
+
+
+-- UPDATE
+
+
+type Msg
+    = NoOp
+
+
+update : Msg -> Model -> ( Model, Effect Msg )
+update msg model =
+    case msg of
+        NoOp ->
+            ( model
+            , Effect.none
+            )
+
+
+
+-- SUBSCRIPTIONS
+
+
+subscriptions : Model -> Sub Msg
+subscriptions model =
+    Sub.none
+
+
+
+-- VIEW
+
+
+view : Model -> View Msg
+view model =
+    { title = donateName
+    , attributes = []
+    , element = donateContainer
+    }
+
+
+donateContainer : Element msg
+donateContainer =
+    topLevelContainer donateList
+
+
+donateList : Element msg
+donateList =
+    column
+        pageList
+    <|
+        List.map donateMaker
+            [ donateLiberaPay
+            , donatePayPal
+            , donatePatreon
+            , donateCardano
+            , donateKoFi
+            , donateYouTube
+            , donateMerch
+            ]

frontend/src/Pages/Interviews.elm

@@ -88,7 +88,7 @@ subscriptions model =
 
 view : Model -> View Msg
 view model =
-    { title = dodgersName
+    { title = interviewsName
     , attributes = []
     , element = interviewContainer
     }

frontend/src/Pages/Services.elm

@@ -11,11 +11,11 @@ import Layouts
 import Page exposing (Page)
 import Route exposing (Route)
 import Services.Helpers exposing (..)
-import Services.ServiceList.Coaching.DebateAnalysis exposing (..)
+import Services.Offerings.DebateAnalysis exposing (..)
-import Services.ServiceList.Coaching.DebateTutoring exposing (..)
+import Services.Offerings.DebateTutoring exposing (..)
-import Services.ServiceList.Coaching.NutritionScience exposing (..)
+import Services.Offerings.ElmBuilds exposing (..)
-import Services.ServiceList.Creative.ElmBuilds exposing (..)
+import Services.Offerings.NixBuilds exposing (..)
-import Services.ServiceList.Creative.NixBuilds exposing (..)
+import Services.Offerings.NutritionScience exposing (..)
 import Shared exposing (..)
 import View exposing (View)
 

frontend/src/Services/Helpers.elm

@@ -9,11 +9,9 @@ import Element.Background as B exposing (..)
 import Element.Border as D
 import Element.Font as F
 import Html.Attributes as H exposing (style)
-import Interviews.Helpers exposing (interviewImage)
 import Layouts
 import Page exposing (Page)
 import Route exposing (Route)
-import Services.ServiceList.Creative.ElmBuilds exposing (servicesElmBuilds)
 import Services.Types exposing (..)
 import Shared
 import View exposing (View)
@@ -29,8 +27,7 @@ serviceMaker service =
             , cardFormatter
                 [ cardContentSpacing
                     [ column
-                        [ fieldSpacer
+                        fieldSpacer
-                        ]
                         [ rateMaker service
                         , descriptionMaker service
                         , offeringMaker service

frontend/src/Services/Offerings/DebateAnalysis.elm

@@ -1,13 +1,18 @@
-module Services.ServiceList.Coaching.DebateAnalysis exposing (..)
+module Services.Offerings.DebateAnalysis exposing (..)
 
 import Services.Types exposing (..)
 
 
 servicesDebateAnalysis : Service
 servicesDebateAnalysis =
-    { serviceImage = "analysis"
+    let
+        name : String
+        name =
+            "Debate Analysis"
+    in
+    { serviceImage = formatName name
     , serviceLink = "https://the-nutrivore.social/"
-    , serviceName = "Debate Analysis"
+    , serviceName = name
     , serviceRate = "$80/hr"
     , serviceDescription =
         [ { point = "Participate in focused one-hour sessions wherein your own recorded debates are analyzed for constructive feedback and advice to help you improve as a debater. You may also participate in mock debates, staged debates, and other exercises to help you get more comfortable with debate and verbal confrontation." }

frontend/src/Services/Offerings/DebateTutoring.elm

@@ -1,13 +1,18 @@
-module Services.ServiceList.Coaching.DebateTutoring exposing (..)
+module Services.Offerings.DebateTutoring exposing (..)
 
 import Services.Types exposing (..)
 
 
 servicesDebateTutoring : Service
 servicesDebateTutoring =
-    { serviceImage = "debate"
+    let
+        name : String
+        name =
+            "Debate Coaching"
+    in
+    { serviceImage = formatName name
     , serviceLink = "https://the-nutrivore.social/"
-    , serviceName = "Debate Coaching"
+    , serviceName = name
     , serviceRate = "$60/hr"
     , serviceDescription =
         [ { point = "Participate in a structured course consisting of five one-hour modules, covering critical thinking, debate strategy, propositional logic, and more. Throughout the course you will receive both personalized and generalizable advice on how to improve your debate performance and critical thinking skills." }

frontend/src/Services/Offerings/ElmBuilds.elm

@@ -1,4 +1,4 @@
-module Services.ServiceList.Creative.ElmBuilds exposing (..)
+module Services.Offerings.ElmBuilds exposing (..)
 
 import Element as E exposing (..)
 import Services.Types exposing (..)
@@ -6,9 +6,14 @@ import Services.Types exposing (..)
 
 servicesElmBuilds : Service
 servicesElmBuilds =
-    { serviceImage = "elm"
+    let
+        name : String
+        name =
+            "Custom Elm Sites"
+    in
+    { serviceImage = formatName name
     , serviceLink = ""
-    , serviceName = "Custom Elm Sites"
+    , serviceName = name
     , serviceRate = "$20/hr"
     , serviceDescription =
         [ { point = "The site you're looking at right now was designed and written by me in Elm, using Elm-Land and Elm-UI. Elm is a purely functional programming language that compiles to JavaScript. It can also handle HTML and CSS in a purely functional paradigm, resulting in highly reproducible sites that require minimal maintenance." }

frontend/src/Services/Offerings/NixBuilds.elm

@@ -1,13 +1,18 @@
-module Services.ServiceList.Creative.NixBuilds exposing (..)
+module Services.Offerings.NixBuilds exposing (..)
 
 import Services.Types exposing (..)
 
 
 servicesNixBuilds : Service
 servicesNixBuilds =
-    { serviceImage = "nixos"
+    let
+        name : String
+        name =
+            "Custom Nix Configs"
+    in
+    { serviceImage = formatName name
     , serviceLink = "https://the-nutrivore.social/"
-    , serviceName = "Custom Nix Configs"
+    , serviceName = name
     , serviceRate = "$40/hr"
     , serviceDescription =
         [ { point = "NixOS has gained popularity in my community, with many switching from Windows, macOS, and other Linux distros. As a result, I often get requests for help with NixOS and the Nix programming language. To streamline the process and make things easier for both of us, I'm offering custom NixOS configurations for clients." }

frontend/src/Services/Offerings/NutritionScience.elm

@@ -1,13 +1,18 @@
-module Services.ServiceList.Coaching.NutritionScience exposing (..)
+module Services.Offerings.NutritionScience exposing (..)
 
 import Services.Types exposing (..)
 
 
 servicesNutritionScience : Service
 servicesNutritionScience =
-    { serviceImage = "nutrition"
+    let
+        name : String
+        name =
+            "Nutrition Science"
+    in
+    { serviceImage = formatName name
     , serviceLink = "https://the-nutrivore.social/"
-    , serviceName = "Nutrition Science"
+    , serviceName = name
     , serviceRate = "$50/hr"
     , serviceDescription =
         [ { point = "Participate in a one-hour Q&A session specifically to inquire about nutrition science. Ask questions about research design, methodology, epistemology, and study interpretation. Also, by participating you will also gain access to nutrition science interpretation cheat-sheets that will streamline and simplify the research appraisal process." }

frontend/src/Services/Types.elm

@@ -13,3 +13,11 @@ type alias Service =
 type alias Description =
     { point : String
     }
+
+
+formatName : String -> String
+formatName name =
+    name
+        |> String.toLower
+        |> String.replace " " ""
+