feat: so very close

frontend/src/Config/Helpers/Cards/Inner/Helpers.elm

@@ -26,7 +26,7 @@ import Element.Font as F
 
 detailSpacing : Attribute msg
 detailSpacing =
-    spacing 3
+    spacing 5
 
 
 detailFormat : (List (Attribute msg) -> List (Element msg) -> Element msg) -> List (Element msg) -> Element msg
@@ -123,24 +123,29 @@ detailBodyMaker colour item =
 
 listMaker : (a -> Element msg) -> List a -> Element msg
 listMaker makeItem itemInfo =
-    column
-        [ spacing 5
-        , width fill
-        ]
-    <|
+    detailFormat column <|
         List.map2 (\x y -> makeItem x)
             itemInfo
             (List.range 1 (List.length itemInfo))
 
 
-listItem : String -> Attribute msg -> Element msg
-listItem item colour =
+listMaker2 : (a -> Int -> Element msg) -> List a -> Element msg
+listMaker2 makeItem itemInfo =
+    detailFormat column <|
+        List.map2
+            (\x y -> makeItem x y)
+            itemInfo
+            (List.range 1 (List.length itemInfo))
+
+
+listItem : ThemeColor -> String -> Element msg
+listItem colour item =
     el
         [ paragraphFontSize
         , F.bold
         , alignLeft
         , width fill
-        , colour
+        , F.color (getThemeColor colour)
         ]
     <|
         paragraph [ F.regular ]

frontend/src/Config/Helpers/Cards/Outer/Helpers.elm

@@ -15,6 +15,7 @@ import Config.Helpers.Format
         )
 import Config.Helpers.ImageFolders as M exposing (..)
 import Config.Helpers.Response exposing (contentContainer)
+import Config.Helpers.ServiceFormat exposing (divider)
 import Config.Pages.Debate.Arguments.Records.Template exposing (argument)
 import Config.Style.Colour.Helpers exposing (colourTheme)
 import Config.Style.Glow
@@ -36,7 +37,6 @@ import Element.Font as F
 import Html.Attributes as H
 import Route.Path as Path exposing (..)
 import Shared
-import Config.Helpers.ServiceFormat exposing (divider)
 
 
 cardMaker : Device -> Cardable msg -> List (Element msg) -> Element msg
@@ -84,7 +84,7 @@ cardMaker device cardable contents =
         cardTitleMaker : String -> Maybe String -> Element msg
         cardTitleMaker title maybeUrl =
             el
-                ([ headerFontSizeMedium
+                ([ headerFontSizeBig
                  , F.bold
                  , F.color colourTheme.textLightGrey
                  , width fill

frontend/src/Config/Helpers/Headers/Helpers.elm

@@ -34,7 +34,7 @@ import Route.Path as Path exposing (..)
 import Shared exposing (..)
 
 
-headerMaker : Headerable -> Element msg
+headerMaker : Headerable msg -> Element msg
 headerMaker headerable =
     let
         headerTitleMaker : String -> Element msg
@@ -48,7 +48,7 @@ headerMaker headerable =
             <|
                 paragraph [] [ text title ]
 
-        headerHelper : String -> String -> Element msg
+        headerHelper : String -> List (Element msg) -> Element msg
         headerHelper title body =
             el
                 [ width (fill |> minimum 100)
@@ -92,7 +92,7 @@ headerMaker headerable =
                                 , F.center
                                 ]
                             <|
-                                [ text body ]
+                                body
                     ]
     in
     case headerable of

frontend/src/Config/Helpers/Headers/Records.elm

@@ -1,113 +1,114 @@
 module Config.Helpers.Headers.Records exposing (..)
 
 import Config.Helpers.Headers.Types exposing (..)
+import Element as E exposing (text)
 
 
-argumentHeader : Header
+argumentHeader : Header msg
 argumentHeader =
     let
         name =
             "Arguments"
     in
     { headerTitle = String.toUpper name
-    , headerBody = "This page features arguments that I hold to be sound. I'm open to hearing all challenges, as I am ready to engage with and defend any argument listed."
+    , headerBody = [ text "This page features arguments that I hold to be sound. I'm open to hearing all challenges, as I am ready to engage with and defend any argument listed." ]
     }
 
 
-blogHeader : Header
+blogHeader : Header msg
 blogHeader =
     let
         name =
             "Blog"
     in
     { headerTitle = String.toUpper name
-    , headerBody = "This page features blog articles written by me, along with contributions from guest authors, covering topics primarily related to nutrition science, health science, and article."
+    , headerBody = [ text "This page features blog articles written by me, along with contributions from guest authors, covering topics primarily related to nutrition science, health science, and article." ]
     }
 
 
-cuckListHeader : Header
+cuckListHeader : Header msg
 cuckListHeader =
     let
         name =
             "Cucklist"
     in
     { headerTitle = String.toUpper name
-    , headerBody = "This page features a list of morons who wrote cheques with their mouths that their asses couldn't cash. Each person included in this list has dodged debating me."
+    , headerBody = [ text "This page features a list of morons who wrote cheques with their mouths that their asses couldn't cash. Each person included in this list has dodged debating me." ]
     }
 
 
-debateHeader : Header
+debateHeader : Header msg
 debateHeader =
     let
         name =
             "Debate"
     in
     { headerTitle = String.toUpper name
-    , headerBody = "Here you will find links to various pages relevant to debate, such as formal arguments, a list of debate-dodging cucks, and an inventory of nonsensical terminology."
+    , headerBody = [ text "Here you will find links to various pages relevant to debate, such as formal arguments, a list of debate-dodging cucks, and an inventory of nonsensical terminology." ]
     }
 
 
-donateHeader : Header
+donateHeader : Header msg
 donateHeader =
     let
         name =
             "Donate"
     in
     { headerTitle = String.toUpper name
-    , headerBody = "My site, research, and content all cost time and money to run. If you find my contributions valuable, please consider supporting my work on any of the platforms listed below!"
+    , headerBody = [ text "My site, research, and content all cost time and money to run. If you find my contributions valuable, please consider supporting my work on any of the platforms listed below!" ]
     }
 
 
-gibberishHeader : Header
+gibberishHeader : Header msg
 gibberishHeader =
     let
         name =
             "Gibberish"
     in
     { headerTitle = String.toUpper name
-    , headerBody = "This page is specifically for terms and ostensible concepts that I think are either nonsensical or so practically useless that its intelligiblity is irrelevant."
+    , headerBody = [ text "This page is specifically for terms and ostensible concepts that I think are either nonsensical or so practically useless that its intelligiblity is irrelevant." ]
     }
 
 
-servicesHeader : Header
+servicesHeader : Header msg
 servicesHeader =
     let
         name =
             "Services"
     in
     { headerTitle = String.toUpper name
-    , headerBody = "Bundle any of the services below to receive a $10 discount per hour. For example, two Debate Analysis sessions would cost $140 total, instead of $80/hr. All prices are in CAD."
+    , headerBody = [ text "Bundle any of the services below to receive a $10 discount per hour. For example, two Debate Analysis sessions would cost $140 total, instead of $80/hr. All prices are in CAD." ]
     }
 
 
-interviewHeader : Header
+interviewHeader : Header msg
 interviewHeader =
     let
         name =
             "Interviews"
     in
     { headerTitle = String.toUpper name
-    , headerBody = "This page showcases various podcasts and shows I've been on. If you’d like to have me as a guest on your podcast, feel free to reach out—I’d love to share my perspectives with your audience!"
+    , headerBody = [ text "This page showcases various podcasts and shows I've been on. If you’d like to have me as a guest on your podcast, feel free to reach out!" ]
     }
 
 
-nutriDexHeader : Header
+nutriDexHeader : Header msg
 nutriDexHeader =
     let
         name =
             "The NutriDex"
     in
     { headerTitle = String.toUpper name
-    , headerBody = ""
+    , headerBody = [ text "" ]
     }
 
 
-contactHeader : Header
+contactHeader : Header msg
 contactHeader =
     let
         name =
             "Contact"
     in
     { headerTitle = String.toUpper name
-    , headerBody = ""
+    , headerBody = [ text "" ]
     }

frontend/src/Config/Helpers/Headers/Types.elm

@@ -1,20 +1,22 @@
 module Config.Helpers.Headers.Types exposing (..)
 
-
-type Headerable
-    = Arguments Header
-    | BlogPage Header
-    | CuckList Header
-    | Debate Header
-    | Donate Header
-    | Gibberish Header
-    | Services Header
-    | Interviews Header
-    | NutriDex Header
-    | Contact Header
+import Element exposing (Element)
 
 
-type alias Header =
+type Headerable msg
+    = Arguments (Header msg)
+    | BlogPage (Header msg)
+    | CuckList (Header msg)
+    | Debate (Header msg)
+    | Donate (Header msg)
+    | Gibberish (Header msg)
+    | Services (Header msg)
+    | Interviews (Header msg)
+    | NutriDex (Header msg)
+    | Contact (Header msg)
+
+
+type alias Header msg =
     { headerTitle : String
-    , headerBody : String
+    , headerBody : List (Element msg)
     }

frontend/src/Config/Helpers/ServiceFormat.elm

@@ -1,6 +1,7 @@
 module Config.Helpers.ServiceFormat exposing (..)
 
 import Config.Data.Identity exposing (pageNames)
+import Config.Helpers.Cards.Inner.Helpers exposing (detailSpacing)
 import Config.Helpers.Format
     exposing
         ( headerFontSizeBig
@@ -38,7 +39,7 @@ chunkMaker : List (Element msg) -> Element msg
 chunkMaker elements =
     paragraph
         [ F.color colourTheme.textLightGrey
-        , paragraphSpacing
+        , detailSpacing
         , paragraphFontSize
         , F.alignLeft
         , width fill

frontend/src/Config/Pages/Blog/Records/NagraGoodrich.elm

@@ -11,8 +11,6 @@ articleNagraGoodrich =
     , articleAuthor = "Nick Hiebert"
     , isNewTabLink = False
     , hasReferences = False
-   
-    
     , hasTableOfContents = True
     , articleImage = "nagragoodrich"
     , articlePublished = "May 12, 2022"

frontend/src/Config/Style/Colour/Helpers.elm

@@ -46,124 +46,6 @@ syntaxTheme =
     }
 
 
-
--- Color attribute functions for main theme
-
-
-textLightGrey : E.Attr decorative msg
-textLightGrey =
-    F.color colourTheme.textLightGrey
-
-
-textDarkGrey : E.Attr decorative msg
-textDarkGrey =
-    F.color colourTheme.textDarkGrey
-
-
-textLightOrange : E.Attr decorative msg
-textLightOrange =
-    F.color colourTheme.textLightOrange
-
-
-textDarkOrange : E.Attr decorative msg
-textDarkOrange =
-    F.color colourTheme.textDarkOrange
-
-
-textDeepDarkOrange : E.Attr decorative msg
-textDeepDarkOrange =
-    F.color colourTheme.textDeepDarkOrange
-
-
-backgroundLightGrey : E.Attr decorative msg
-backgroundLightGrey =
-    F.color colourTheme.backgroundLightGrey
-
-
-backgroundDarkGrey : E.Attr decorative msg
-backgroundDarkGrey =
-    F.color colourTheme.backgroundDarkGrey
-
-
-backgroundDeepDarkGrey : E.Attr decorative msg
-backgroundDeepDarkGrey =
-    F.color colourTheme.backgroundDeepDarkGrey
-
-
-backgroundSpreadsheet : E.Attr decorative msg
-backgroundSpreadsheet =
-    F.color colourTheme.backgroundSpreadsheet
-
-
-backgroundSpreadsheetDark : E.Attr decorative msg
-backgroundSpreadsheetDark =
-    F.color colourTheme.backgroundSpreadsheetDark
-
-
-shadow : E.Attr decorative msg
-shadow =
-    F.color colourTheme.shadow
-
-
-barGreen : E.Attr decorative msg
-barGreen =
-    F.color colourTheme.barGreen
-
-
-barRed : E.Attr decorative msg
-barRed =
-    F.color colourTheme.barRed
-
-
-debugColour : E.Attr decorative msg
-debugColour =
-    F.color colourTheme.debugColour
-
-
-transparent : E.Attr decorative msg
-transparent =
-    F.color colourTheme.transparent
-
-
-
--- Color attribute functions for syntax theme
-
-
-syntaxPunctuation : E.Attr decorative msg
-syntaxPunctuation =
-    F.color syntaxTheme.punctuation
-
-
-syntaxKey : E.Attr decorative msg
-syntaxKey =
-    F.color syntaxTheme.key
-
-
-syntaxString : E.Attr decorative msg
-syntaxString =
-    F.color syntaxTheme.string
-
-
-syntaxKeyword : E.Attr decorative msg
-syntaxKeyword =
-    F.color syntaxTheme.keyword
-
-
-syntaxOperator : E.Attr decorative msg
-syntaxOperator =
-    F.color syntaxTheme.operator
-
-
-syntaxBackground : E.Attr decorative msg
-syntaxBackground =
-    F.color syntaxTheme.background
-
-
-syntaxText : E.Attr decorative msg
-syntaxText =
-    F.color syntaxTheme.text
-
-
 type ThemeColor
     = TextLightGrey
     | TextDarkGrey

frontend/src/Config/Style/Images.elm

@@ -1,7 +1,7 @@
 module Config.Style.Images exposing (..)
 
 import Config.Helpers.ImageFolders exposing (..)
-import Config.Style.Colour.Helpers exposing (colourTheme)
+import Config.Style.Colour.Helpers exposing (ThemeColor(..), colourTheme, getThemeColor)
 import Element as E exposing (..)
 import Element.Background as B exposing (color)
 import Element.Border as D
@@ -15,9 +15,15 @@ import Element.Border as D
 imageSquareMaker : Device -> String -> Bool -> String -> Element msg
 imageSquareMaker device imagePath isLeft size =
     E.image
-        [ D.rounded 10
+        [ D.rounded (roundingScaler size)
         , clip
         , E.width <| imageSizer size
+        , E.height <| imageSizer size
+        , if imagePath == imagePathMaker Donate "cardano" then
+            B.color (rgb255 4 20 108)
+
+          else
+            B.color (getThemeColor BackgroundLightGrey)
         ]
         { src = imagePath
         , description = ""
@@ -27,20 +33,43 @@ imageSquareMaker device imagePath isLeft size =
 imageSizer : String -> Length
 imageSizer size =
     case size of
-        "Fatty" ->
-            px 80
-
-        "Big" ->
-            px 60
-
-        "Medium" ->
-            px 45
-
         "Fill" ->
             fill
 
-        "Test" ->
-            px 145
+        "Fatty" ->
+            px 128
+
+        "Big" ->
+            px 65
+
+        "Small" ->
+            px 28
 
         _ ->
-            px 28
+            px 20
+
+
+roundingScaler : String -> Int
+roundingScaler size =
+    case size of
+        "Fill" ->
+            32
+
+        "Fatty" ->
+            32
+
+        -- 128px
+        "Big" ->
+            10
+
+        -- 65px
+        "Small" ->
+            10
+
+        -- 28px
+        _ ->
+            10
+
+
+
+-- 20px default