feat: reverted the arguments page

frontend/src/Config/Identity.elm

@@ -11,13 +11,13 @@ type alias PageInput =
     , pageNutriDex : String
     , pagePlatforms : String
     , pageServices : String
-    , pageSupport : String
+    , pageDonate : String
     }
 
 
 pageNames : PageInput
 pageNames =
-    { pageHome = "upRootHealth"
+    { pageHome = "home"
     , pagePlatforms = "platforms"
     , pageServices = "services"
     , pageDodgers = "cuckList"
@@ -26,14 +26,20 @@ pageNames =
     , pageNutriDex = "nutriDex"
     , pageInterviews = "interviews"
     , pageContact = "contact"
-    , pageSupport = "support"
+    , pageDonate = "donate"
     }
 
+
 createPageName : String -> String
 createPageName pageName =
     pageNames.pageHome ++ " :: " ++ pageName
 
 
+homeName : String
+homeName =
+    createPageName pageNames.pageHome
+
+
 contactName : String
 contactName =
     createPageName pageNames.pageContact
@@ -76,4 +82,4 @@ servicesName =
 
 supportName : String
 supportName =
-    createPageName pageNames.pageSupport
+    createPageName pageNames.pageDonate

frontend/src/Cuckery/Helpers.elm

@@ -145,7 +145,7 @@ makeDodge dodgeEntry index =
                             (List.indexedMap
                                 (\index2 link ->
                                     newTabLink
-                                        [ paddingEach { top = 0, right = 0, bottom = 0, left = 5 }, F.size 13 ]
+                                        [ paddingEach { top = 0, right = 15, bottom = 0, left = 5 }, F.size 13 ]
                                         { url = link
                                         , label =
                                             row []
@@ -161,18 +161,18 @@ makeDodge dodgeEntry index =
             ]
         , row paragraphBoldFormat
             [ column [ alignTop, width <| px 165 ]
-                [ text "Proposition:" |> el [ paddingEach { top = 0, right = 0, bottom = 0, left = 70 } ]
+                [ text "Proposition:" |> el [ paddingEach { top = 0, right = 15, bottom = 0, left = 70 } ]
                 ]
-            , column [ E.width fill, alignLeft ]
+            , column [ E.width fill, alignLeft, paddingEach { top = 0, right = 15, bottom = 0, left = 0 } ]
                 [ paragraph [ F.regular ] [ text (formatProposition dodgeEntry.dodgeProposition) ]
                 ]
             ]
         , maybeFallacyField
         , row (paragraphBoldFormat ++ [ width fill ])
             [ column [ alignTop, width <| px 165 ]
-                [ text "Attitude:" |> el [ paddingEach { top = 0, right = 0, bottom = 0, left = 70 } ]
+                [ text "Attitude:" |> el [ paddingEach { top = 0, right = 15, bottom = 0, left = 70 } ]
                 ]
-            , column [ E.width fill, alignLeft ]
+            , column [ E.width fill, alignLeft, paddingEach { top = 0, right = 15, bottom = 0, left = 0 } ]
                 [ case dodgeEntry.dodgeNicksDoxasticState of
                     Nothing ->
                         paragraph [ F.regular ] [ text "I don't form a doxastic state." ]
@@ -199,7 +199,7 @@ makeDodge dodgeEntry index =
             [ column [ alignTop, width <| px 165 ]
                 [ text "Reason:" |> el [ paddingEach { top = 0, right = 0, bottom = 0, left = 70 } ]
                 ]
-            , column [ E.width fill, alignLeft ]
+            , column [ E.width fill, alignLeft, paddingEach { top = 0, right = 15, bottom = 0, left = 0 } ]
                 [ paragraph [ F.regular ]
                     [ text <|
                         case dodgeEntry.dodgeNicksDoxasticReason of
@@ -255,41 +255,41 @@ cuckMaker cuck =
             [ row
                 (nonHighlightedTitleFormat
                     ++ [ F.size 20
-
-                       --    , B.color colourTheme.highlightTextHover
+                       , B.color colourTheme.highlightTextHover
                        , paddingEach { top = 6, bottom = 3, left = 25, right = 15 }
                        , alignBottom
                        , width fill
-                       , D.roundEach { topLeft = 26, topRight = 15, bottomRight = 0, bottomLeft = 0 }
-                       , B.gradient
-                            { angle = 1.5708
-                            , steps =
-                                [ colourTheme.highlightTextHover
-                                , colourTheme.highlightTextHover
-                                , colourTheme.transparent
-                                , colourTheme.transparent
-                                ]
-                            }
+                       , D.roundEach { topLeft = 26, topRight = 26, bottomRight = 0, bottomLeft = 0 }
+
+                       --    , B.gradient
+                       --         { angle = 1.5708
+                       --         , steps =
+                       --             [ colourTheme.highlightTextHover
+                       --             , colourTheme.highlightTextHover
+                       --             , colourTheme.transparent
+                       --             , colourTheme.transparent
+                       --             ]
+                       --         }
                        ]
                 )
                 [ text cuck.cuckName ]
             , column
                 [ E.height fill
                 , E.width fill
-
-                -- , B.color colourTheme.cardBackground
+                , B.color colourTheme.cardBackground
                 , paddingEach { top = 10, bottom = 10, left = 10, right = 10 }
-                , D.roundEach { topLeft = 0, topRight = 0, bottomRight = 0, bottomLeft = 26 }
+                , D.roundEach { topLeft = 0, topRight = 0, bottomRight = 26, bottomLeft = 26 }
                 , spacing 3
-                , B.gradient
-                    { angle = 1.5708
-                    , steps =
-                        [ colourTheme.cardBackground
-                        , colourTheme.cardBackground
-                        , colourTheme.transparent
-                        , colourTheme.transparent
-                        ]
-                    }
+
+                -- , B.gradient
+                --     { angle = 1.5708
+                --     , steps =
+                --         [ colourTheme.cardBackground
+                --         , colourTheme.cardBackground
+                --         , colourTheme.transparent
+                --         , colourTheme.transparent
+                --         ]
+                --     }
                 ]
                 [ row
                     (paragraphBoldFormat

frontend/src/Debate/Helpers.elm

@@ -1,9 +1,5 @@
 module Debate.Helpers exposing (..)
 
--- import Html exposing (div, hr)
--- import Html.Attributes as H exposing (style, title, wrap)
--- import Config.Types exposing (..)
-
 import Config.Colour as T exposing (..)
 import Config.Format as O exposing (..)
 import Debate.Types exposing (..)
@@ -13,165 +9,109 @@ import Element.Background as B exposing (..)
 import Element.Border as D exposing (..)
 import Element.Events as V exposing (..)
 import Element.Font as F exposing (..)
-import Html.Attributes exposing (form, id, style)
+import Html exposing (div, hr)
+import Html.Attributes as H exposing (style, title, wrap)
 import Layouts
-import List.Extra exposing (..)
-import Maybe exposing (withDefault)
-import Maybe.Extra exposing (isNothing)
 import Page exposing (Page)
 import Route exposing (Route)
 import Shared
 import View exposing (View)
 
 
-type alias ArgMakerInput msg =
-    { arg : Argument
-    , index : Int
-    , isExpanded : Bool
-    , maybeHeight : Maybe Int
-    , titleClickMsg : msg
-    }
-
-
-argumentMaker : ArgMakerInput msg -> Element msg
-argumentMaker argMakerInput =
-    -- row [ imageSpacer, E.alignLeft ]
-    --     [ E.image
-    --         (case argMakerInput.maybeHeight of
-    --             Nothing ->
-    --                 [ transparent True ]
-    --             Just _ ->
-    --                 [ centerX
-    --                 , centerY
-    --                 , alignTop
-    --                 , D.rounded 100
-    --                 , E.width <| px 52
-    --                 ]
-    --         )
-    --         { src = "arguments/" ++ argMakerInput.arg.argumentImage ++ ".png"
-    --         , description = ""
-    --         }
-    --     ,
-    column
-        (if isNothing argMakerInput.maybeHeight then
-            [ E.htmlAttribute (id <| "arg" ++ String.fromInt argMakerInput.index)
-            , E.width <| px 600
+argumentMaker : Argument -> Element msg
+argumentMaker argument =
+    row
+        [ spacing 20
+        , E.width fill
+        , E.height fill
+        , E.alignTop
+        , E.alignRight
+        ]
+        [ column
+            [ E.width <| px 115
+            , E.height <| px 115
+            , E.alignTop
+            , E.alignRight
             ]
-
-         else
-            [ E.width <| px 600, alignTop ]
-        )
-        [ titleMaker argMakerInput
-        , column
-            (case argMakerInput.maybeHeight of
-                Just h ->
-                    [ B.color colourTheme.cardBackground
-                    , clip
-                    , htmlAttribute <| style "transition" "all .7s ease-in-out"
-                    , roundEach { topLeft = 0, topRight = 0, bottomRight = 20, bottomLeft = 20 }
-                    , height <|
-                        px <|
-                            if argMakerInput.isExpanded then
-                                h
-
-                            else
-                                0
-                    ]
-
-                Nothing ->
-                    [ transparent True ]
-            )
-          <|
-            List.map (\x -> x argMakerInput)
-                [ propositionMaker
-                , reductioMaker
-                , summaryMaker
-                , strengthMaker
-                , tableMaker
-                , proofTreeMaker
+            [ column
+                [ D.rounded 100
+                , D.width 5
+                , D.color colourTheme.cardBackground
                 ]
+                [ E.image
+                    [ E.alignRight
+                    , alignTop
+                    , D.rounded 100
+                    , clip
+                    , E.width <| px 90
+                    , E.height <| px 90
+                    ]
+                    { src = "arguments/" ++ argument.argumentImage ++ ".png"
+                    , description = argument.argumentTitle
+                    }
+                ]
+            ]
+        , column
+            [ E.width <| px 600
+            , alignTop
+            ]
+            [ column
+                [ B.color colourTheme.cardBackground
+                , htmlAttribute <| style "transition" "all .7s ease-in-out"
+                , rounded 26
+                ]
+                [ titleMaker argument
+                , column [ paddingEach { top = 10, right = 30, bottom = 10, left = 30 }, spacing 10 ]
+                    [ propositionMaker argument
+                    , reductioMaker argument
+                    , summaryMaker argument
+                    , strengthMaker argument
+                    , tableMaker argument
+                    , proofTreeMaker argument
+                    ]
+                ]
+            ]
         ]
 
 
-
--- ]
-
-
-titleMaker : ArgMakerInput msg -> Element msg
-titleMaker argMakerInput =
+titleMaker : Argument -> Element msg
+titleMaker argument =
     paragraph
         (paragraphBoldFormat
             ++ [ F.size 20
-               , F.color colourTheme.backgroundColour
-               , B.color colourTheme.highlightText
-               , paddingEach { top = 6, bottom = 2, left = 12, right = 12 }
+               , B.color colourTheme.highlightTextHover
+               , paddingEach { top = 6, bottom = 3, left = 30, right = 30 }
                , alignBottom
-               , roundEach { topLeft = 10, topRight = 10, bottomRight = 0, bottomLeft = 0 }
-               , F.center
-               , pointer
-               , htmlAttribute <| style "transition" "all 0.3s ease-in-out"
-               , mouseOver
-                    [ B.color colourTheme.highlightTextHover
-                    , F.color colourTheme.nonHighlightedText
-                    ]
-               , V.onClick <| argMakerInput.titleClickMsg
+               , E.width fill
+               , D.roundEach { topLeft = 26, topRight = 26, bottomRight = 0, bottomLeft = 0 }
                ]
-            ++ (case argMakerInput.maybeHeight of
-                    Nothing ->
-                        [ transparent True ]
-
-                    Just _ ->
-                        [ roundEach <|
-                            if argMakerInput.isExpanded then
-                                { topLeft = 10, topRight = 10, bottomRight = 0, bottomLeft = 0 }
-
-                            else
-                                { topLeft = 10, topRight = 10, bottomRight = 10, bottomLeft = 10 }
-                        , F.alignLeft
-                        ]
-               )
         )
-        [ text argMakerInput.arg.argumentTitle ]
-
-
-propositionMaker : ArgMakerInput msg -> Element msg
-propositionMaker argMakerInput =
-    row
-        [ paddingEach { top = 20, right = 30, bottom = 0, left = 30 }
-        , E.width fill
+        [ text argument.argumentTitle
         ]
+
+
+propositionMaker : Argument -> Element msg
+propositionMaker argument =
+    row []
         [ column
             [ E.alignTop, E.alignLeft ]
-            [ paragraph
-                (paragraphBoldFormat
-                    ++ [ F.size 18
-                       , E.width <| px 100
-                       ]
-                )
+            [ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
                 [ el [ tooltip below (myTooltip "A proposition is a declarative statement that can be evaluated as either true or false, and which serves as the basis for debate.") ] (text "Proposition:") |> el [ F.color colourTheme.highlightText ] ]
             ]
         , column
             [ E.width fill, E.alignLeft ]
-            [ paragraph (paragraphBoldFormat ++ [ F.size 18 ])
-                [ text argMakerInput.arg.propositionTitle
-                    |> el
-                        [ F.color colourTheme.nonHighlightedText
-                        , F.regular
-                        , F.size 16
-                        ]
-                ]
-            ]
+            [ paragraph (paragraphBoldFormat ++ [ F.size 18 ]) [ text argument.propositionTitle |> el [ F.color colourTheme.nonHighlightedText, F.regular, F.size 16 ] ] ]
         ]
 
 
-reductioMaker : ArgMakerInput msg -> Element msg
-reductioMaker argMakerInput =
-    case argMakerInput.arg.propositionReductio of
+reductioMaker : Argument -> Element msg
+reductioMaker argument =
+    case argument.propositionReductio of
         "" ->
             none
 
         reductio ->
-            row [ paddingEach { top = 8, right = 30, bottom = 0, left = 30 }, E.width fill ]
+            row [ paddingEach { top = 10, right = 0, bottom = 0, left = 0 } ]
                 [ column
                     [ E.alignTop, E.alignLeft ]
                     [ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
@@ -179,15 +119,15 @@ reductioMaker argMakerInput =
                         ]
                     ]
                 , column [ E.width fill, E.alignLeft ]
-                    [ paragraph (paragraphBoldFormat ++ [ F.size 18, spacing 3 ])
+                    [ paragraph (paragraphFormat ++ [ F.size 18, spacing 3 ])
                         [ text reductio ]
                     ]
                 ]
 
 
-summaryMaker : ArgMakerInput msg -> Element msg
-summaryMaker argMakerInput =
-    row [ paddingEach { top = 10, right = 30, bottom = 0, left = 30 } ]
+summaryMaker : Argument -> Element msg
+summaryMaker argument =
+    row []
         [ column
             [ E.alignTop, E.alignLeft ]
             [ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
@@ -196,25 +136,12 @@ summaryMaker argMakerInput =
             ]
         , column
             [ E.width fill, E.alignLeft ]
-            [ paragraph
-                (paragraphBoldFormat
-                    ++ [ F.size 18
-                       , spacing 3
-                       ]
-                )
-                [ text argMakerInput.arg.propositionSummary
-                    |> el
-                        [ F.color colourTheme.nonHighlightedText
-                        , F.regular
-                        , F.size 16
-                        ]
-                ]
-            ]
+            [ paragraph (paragraphBoldFormat ++ [ F.size 18, spacing 3 ]) [ text argument.propositionSummary |> el [ F.color colourTheme.nonHighlightedText, F.regular, F.size 16 ] ] ]
         ]
 
 
-strengthMaker : ArgMakerInput msg -> Element msg
-strengthMaker argMakerInput =
+strengthMaker : Argument -> Element msg
+strengthMaker argument =
     let
         barMaker : Int -> Element msg
         barMaker num =
@@ -275,7 +202,7 @@ strengthMaker argMakerInput =
                 _ ->
                     "Confidence level out of expected range."
     in
-    row [ paddingEach { top = 10, right = 30, bottom = 0, left = 30 }, E.width fill ]
+    row [ E.width fill ]
         [ column
             [ E.alignTop, E.alignLeft ]
             [ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
@@ -283,12 +210,12 @@ strengthMaker argMakerInput =
             ]
         , column
             [ E.width fill, E.alignLeft, centerY ]
-            [ barMaker argMakerInput.arg.argumentCertainty ]
+            [ barMaker argument.argumentCertainty ]
         ]
 
 
-tableMaker : ArgMakerInput msg -> Element msg
-tableMaker argMakerInput =
+tableMaker : Argument -> Element msg
+tableMaker argument =
     let
         formalizationMaker : List (Element msg)
         formalizationMaker =
@@ -299,7 +226,7 @@ tableMaker argMakerInput =
             in
             List.indexedMap
                 (\index argumentEntry ->
-                    column (paragraphFormat ++ [ spacing 3, centerX, E.width fill, paddingEach { top = 10, right = 30, bottom = 0, left = 30 } ])
+                    column (paragraphFormat ++ [ spacing 3, centerX, E.width <| px 500, paddingEach { top = 10, right = 0, bottom = 0, left = 0 } ])
                         (List.indexedMap
                             (\premiseIndex premiseWithNotation ->
                                 column argumentFormatting
@@ -329,13 +256,9 @@ tableMaker argMakerInput =
                                ]
                         )
                 )
-                argMakerInput.arg.argumentFormalization
+                argument.argumentFormalization
     in
-    column
-        [ centerX
-        , paddingEach { top = 8, right = 30, bottom = 0, left = 30 }
-        , E.width fill
-        ]
+    column [ centerX, E.width <| px 600 ]
         [ wrappedRow (paragraphBoldFormat ++ [ E.alignLeft, E.width fill ])
             [ E.table
                 [ spacing 0
@@ -344,7 +267,7 @@ tableMaker argMakerInput =
                 , D.color colourTheme.nonHighlightedDarkText
                 , clip
                 ]
-                { data = argMakerInput.arg.definitionTable
+                { data = argument.definitionTable
                 , columns =
                     [ { header =
                             el
@@ -401,24 +324,21 @@ tableMaker argMakerInput =
         ]
 
 
-proofTreeMaker : ArgMakerInput msg -> Element msg
-proofTreeMaker argMakerInput =
-    row
-        [ paddingEach { top = 8, right = 30, bottom = 0, left = 30 }
-        , centerX
-        , E.width fill
-        ]
-        [ column [ E.width fill ]
+proofTreeMaker : Argument -> Element msg
+proofTreeMaker argument =
+    row [ paddingEach { top = 10, right = 0, bottom = 10, left = 0 }, centerX, E.width fill ]
+        [ column [ E.alignRight ]
             [ newTabLink
                 (paragraphBoldFormat
                     ++ [ F.size 18
                        , F.color colourTheme.backgroundColour
                        , B.color colourTheme.highlightText
                        , paddingEach { top = 6, bottom = 2, left = 12, right = 12 }
+                       , D.width 1
                        , D.rounded 10
+                       , E.width <| px 105
                        , F.center
                        , E.alignRight
-                       , alignBottom
                        , transitionStyle
                        , mouseOver
                             [ B.color colourTheme.highlightTextHover
@@ -427,8 +347,19 @@ proofTreeMaker argMakerInput =
                             ]
                        ]
                 )
-                { url = argMakerInput.arg.proofLink
+                { url = argument.proofLink
                 , label = text "Proof Tree"
                 }
             ]
         ]
+
+
+basicDivider =
+    el
+        [ E.width fill
+        , centerX
+        , D.widthEach { bottom = 1, top = 0, left = 0, right = 0 }
+        , D.color (rgb255 200 200 200)
+        , paddingEach { top = 40, bottom = 0, left = 0, right = 0 }
+        ]
+        none

frontend/src/Interviews/Helpers.elm

@@ -53,7 +53,7 @@ makeAppearance appearanceEntry index =
                     row
                         [ F.size 18
                         ]
-                        [ text ("#"++appearanceEntry.appearanceEpisode++": "++appearanceEntry.appearanceTitle)
+                        [ text ("#" ++ appearanceEntry.appearanceEpisode ++ ": " ++ appearanceEntry.appearanceTitle)
                             |> el
                                 [ F.color colourTheme.highlightText
                                 , mouseOver [ F.color colourTheme.highlightTextHover ]
@@ -132,21 +132,23 @@ interviewMaker interview =
                             }
                        , alignBottom
                        , width fill
+                       , B.color colourTheme.highlightTextHover
                        , D.roundEach
                             { topLeft = 26
-                            , topRight = 15
+                            , topRight = 26
                             , bottomRight = 0
                             , bottomLeft = 0
                             }
-                       , B.gradient
-                            { angle = 1.5708
-                            , steps =
-                                [ colourTheme.highlightTextHover
-                                , colourTheme.highlightTextHover
-                                , colourTheme.transparent
-                                , colourTheme.transparent
-                                ]
-                            }
+
+                       --    , B.gradient
+                       --         { angle = 1.5708
+                       --         , steps =
+                       --             [ colourTheme.highlightTextHover
+                       --             , colourTheme.highlightTextHover
+                       --             , colourTheme.transparent
+                       --             , colourTheme.transparent
+                       --             ]
+                       --         }
                        ]
                 )
                 [ text interview.interviewName ]
@@ -154,7 +156,7 @@ interviewMaker interview =
                 [ E.height fill
                 , E.width fill
 
-                -- , B.color colourTheme.cardBackground
+                , B.color colourTheme.cardBackground
                 , paddingEach
                     { top = 10
                     , bottom = 10
@@ -164,19 +166,19 @@ interviewMaker interview =
                 , D.roundEach
                     { topLeft = 0
                     , topRight = 0
-                    , bottomRight = 0
+                    , bottomRight = 26
                     , bottomLeft = 26
                     }
                 , spacing 3
-                , B.gradient
-                    { angle = 1.5708
-                    , steps =
-                        [ colourTheme.cardBackground
-                        , colourTheme.cardBackground
-                        , colourTheme.transparent
-                        , colourTheme.transparent
-                        ]
-                    }
+                -- , B.gradient
+                --     { angle = 1.5708
+                --     , steps =
+                --         [ colourTheme.cardBackground
+                --         , colourTheme.cardBackground
+                --         , colourTheme.transparent
+                --         , colourTheme.transparent
+                --         ]
+                --     }
                 ]
                 [ row
                     (paragraphBoldFormat

frontend/src/Layouts/Navbar.elm

@@ -150,18 +150,18 @@ view { toContentMsg, model, content } =
                             , F.size 17
                             , spacing 8
                             ]
-                            [ homeButton
-                            , servicesButton
-                            , hyperbolgButton
-                            , argumentsButton
-                            , cucklistButton
-
-                            -- , communityButton
-                            , nutridexButton
-                            , donateButton
-                            , interviewButton
-                            , contactButton
-                            ]
+                          <|
+                            List.map buttonMaker
+                                [ pageNames.pageHome
+                                , pageNames.pageServices
+                                , pageNames.pageHyperBlog
+                                , pageNames.pageDebate
+                                , pageNames.pageDodgers
+                                , pageNames.pageNutriDex
+                                , pageNames.pageInterviews
+                                , pageNames.pageDonate
+                                , pageNames.pageContact
+                                ]
                         ]
                     ]
                 , row
@@ -231,28 +231,17 @@ localhostUrl =
     "http://localhost:1234/"
 
 
-linkFormat =
-    el
-        [ mouseOver [ F.color colourTheme.highlightText ]
-        , htmlAttribute <| style "transition" "all 0.1s ease-in-out"
-        ]
-
-
-iconDistance =
-    E.width <| px 36
-
-
-homeButton : Element msg
-homeButton =
+buttonMaker : String -> Element msg
+buttonMaker name =
     row
         []
-        [ column [ iconDistance ]
+        [ column [ E.width <| px 36 ]
             [ E.image
                 [ alignLeft
                 , alignBottom
                 , E.width <| px 30
                 ]
-                { src = "navbar/home.png"
+                { src = "navbar/" ++ String.toLower name ++ ".png"
                 , description = ""
                 }
             ]
@@ -260,232 +249,14 @@ homeButton =
             [ alignBottom ]
             [ link
                 []
-                { url = localhostUrl ++ "home"
-                , label = linkFormat <| text "HOME"
-                }
-            ]
-        ]
-
-
-servicesButton : Element msg
-servicesButton =
-    row
-        []
-        [ column [ iconDistance ]
-            [ E.image
-                [ alignLeft
-                , alignBottom
-                , E.width <| px 30
-                ]
-                { src = "navbar/services.png"
-                , description = ""
-                }
-            ]
-        , column
-            [ alignBottom ]
-            [ link
-                []
-                { url = localhostUrl ++ "services"
-                , label = linkFormat <| text "SERVICES"
-                }
-            ]
-        ]
-
-
-hyperbolgButton : Element msg
-hyperbolgButton =
-    row
-        []
-        [ column [ iconDistance ]
-            [ E.image
-                [ alignLeft
-                , alignBottom
-                , E.width <| px 30
-                ]
-                { src = "navbar/hyperblog.png"
-                , description = ""
-                }
-            ]
-        , column
-            [ alignBottom ]
-            [ link
-                []
-                { url = localhostUrl ++ "hyperblog"
-                , label = linkFormat <| text "HYPERBLOG"
-                }
-            ]
-        ]
-
-
-argumentsButton : Element msg
-argumentsButton =
-    row
-        []
-        [ column [ iconDistance ]
-            [ E.image
-                [ alignLeft
-                , alignBottom
-                , E.width <| px 30
-                ]
-                { src = "navbar/arguments.png"
-                , description = ""
-                }
-            ]
-        , column
-            [ alignBottom ]
-            [ link
-                []
-                { url = localhostUrl ++ "arguments"
-                , label = linkFormat <| text "ARGUMENTS"
-                }
-            ]
-        ]
-
-
-cucklistButton : Element msg
-cucklistButton =
-    row
-        []
-        [ column [ iconDistance ]
-            [ E.image
-                [ alignLeft
-                , alignBottom
-                , E.width <| px 30
-                ]
-                { src = "navbar/cucklist.png"
-                , description = ""
-                }
-            ]
-        , column
-            [ alignBottom ]
-            [ link
-                []
-                { url = localhostUrl ++ "cucklist"
-                , label = linkFormat <| text "CUCKLIST"
-                }
-            ]
-        ]
-
-
-communityButton : Element msg
-communityButton =
-    row
-        []
-        [ column [ iconDistance ]
-            [ E.image
-                [ alignLeft
-                , alignBottom
-                , E.width <| px 30
-                ]
-                { src = "navbar/community.png"
-                , description = ""
-                }
-            ]
-        , column
-            [ alignBottom ]
-            [ link
-                []
-                { url = localhostUrl ++ "community"
-                , label = linkFormat <| text "COMMUNITY"
-                }
-            ]
-        ]
-
-
-nutridexButton : Element msg
-nutridexButton =
-    row
-        []
-        [ column [ iconDistance ]
-            [ E.image
-                [ alignLeft
-                , alignBottom
-                , E.width <| px 30
-                ]
-                { src = "navbar/nutridex.png"
-                , description = ""
-                }
-            ]
-        , column
-            [ alignBottom ]
-            [ link
-                []
-                { url = localhostUrl ++ "nutridex"
-                , label = linkFormat <| text "NUTRIDEX"
-                }
-            ]
-        ]
-
-
-donateButton : Element msg
-donateButton =
-    row
-        []
-        [ column [ iconDistance ]
-            [ E.image
-                [ alignLeft
-                , alignBottom
-                , E.width <| px 30
-                ]
-                { src = "navbar/donate.png"
-                , description = ""
-                }
-            ]
-        , column
-            [ alignBottom ]
-            [ link
-                []
-                { url = localhostUrl ++ "donate"
-                , label = linkFormat <| text "DONATE"
-                }
-            ]
-        ]
-
-
-interviewButton =
-    row
-        []
-        [ column [ iconDistance ]
-            [ E.image
-                [ alignLeft
-                , alignBottom
-                , E.width <| px 30
-                ]
-                { src = "navbar/interviews.png"
-                , description = ""
-                }
-            ]
-        , column
-            [ alignBottom ]
-            [ link
-                []
-                { url = localhostUrl ++ "interviews"
-                , label = linkFormat <| text "INTERVIEWS"
-                }
-            ]
-        ]
-
-
-contactButton : Element msg
-contactButton =
-    row
-        []
-        [ column [ iconDistance ]
-            [ E.image
-                [ alignLeft
-                , alignBottom
-                , E.width <| px 30
-                ]
-                { src = "navbar/contact.png"
-                , description = ""
-                }
-            ]
-        , column
-            [ alignBottom ]
-            [ link
-                []
-                { url = localhostUrl ++ "contact"
-                , label = linkFormat <| text "CONTACT"
+                { url = localhostUrl ++ String.toLower name
+                , label =
+                    el
+                        [ mouseOver [ F.color colourTheme.highlightText ]
+                        , htmlAttribute <| style "transition" "all 0.1s ease-in-out"
+                        ]
+                    <|
+                        text (String.toUpper name)
                 }
             ]
         ]

frontend/src/Pages/Arguments.elm

@@ -76,7 +76,7 @@ page shared route =
         { init = init
         , update = update
         , subscriptions = subscriptions
-        , view = view shared
+        , view = view
         }
         |> Page.withLayout toLayout
 
@@ -91,21 +91,12 @@ toLayout model =
 
 
 type alias Model =
-    { argExpansions : List Bool
-    , argHeights : List Int
-    }
+    {}
 
 
 init : () -> ( Model, Effect Msg )
 init () =
-    let
-        numArgs : Int
-        numArgs =
-            List.length argumentList
-    in
-    ( { argExpansions = List.repeat numArgs False
-      , argHeights = List.repeat numArgs 0
-      }
+    ( {}
     , Effect.none
     )
 
@@ -115,151 +106,97 @@ init () =
 
 
 type Msg
-    = GotArgHeight (List Int)
-    | ToggleExpandArg Int
+    = NoOp
 
 
 update : Msg -> Model -> ( Model, Effect Msg )
 update msg model =
-    Debug.log (Debug.toString model.argHeights) <|
-        case msg of
-            GotArgHeight argHeights ->
-                ( { model | argHeights = argHeights }, Effect.none )
+    case msg of
+        NoOp ->
+            ( model
+            , Effect.none
+            )
 
-            ToggleExpandArg index ->
-                ( case getAt index model.argExpansions of
-                    Nothing ->
-                        model
 
-                    Just isExpanded ->
-                        { model
-                            | argExpansions =
-                                setAt index
-                                    (not isExpanded)
-                                    model.argExpansions
-                        }
-                , Effect.sendCmd <| Ports.getArgHeight <| List.length model.argHeights
-                )
+
+-- SUBSCRIPTIONS
 
 
 subscriptions : Model -> Sub Msg
 subscriptions model =
-    gotArgHeight GotArgHeight
+    Sub.none
 
 
 
 -- VIEW
 
 
-view : Shared.Model -> Model -> View Msg
-view shared model =
-    { title = debateName
+view : Model -> View Msg
+view model =
+    { title = dodgersName
     , attributes = []
-    , element = debateContainer shared model
+    , element = debateContainer
     }
 
 
-debateContainer : Shared.Model -> Model -> Element Msg
-debateContainer shared model =
-    let
-        a : Device
-        a =
-            shared.device
-    in
-    topLevelContainer <| debateList model
+debateContainer : Element msg
+debateContainer =
+    topLevelContainer debateList
 
 
-debateList : Model -> Element Msg
-debateList model =
-    let
-        argColumn : Bool -> Element Msg
-        argColumn isHidden =
-            column
-                [ padding 30
-                , spacing 15
-                ]
-            <|
-                List.map argumentMaker <|
-                    List.map4
-                        (\w x y z ->
-                            { arg = w
-                            , index = x
-                            , isExpanded = y
-                            , maybeHeight =
-                                if isHidden then
-                                    Nothing
-
-                                else
-                                    z
-                            , titleClickMsg = ToggleExpandArg x
-                            }
-                        )
-                        argumentList
-                        (List.range 0 <| List.length model.argHeights)
-                        model.argExpansions
-                        (List.map Just model.argHeights)
-    in
-    el
-        [ behindContent <| argColumn True
-        , spacing 10
-        , centerX
-        , centerY
-        , alignTop
-        , paddingEach { top = 30, bottom = 30, left = 30, right = 30 }
-        ]
+debateList : Element msg
+debateList =
+    column
+        pageList
     <|
-        argColumn False
-
-
-argumentList : List Argument
-argumentList =
-    [ argumentApoBCVD
-    , argumentAnabolicKeto
-    , argumentAntagonisticPleiotropy
-    , argumentCarbsObesity
-    , argumentDietaryCholesterol
-    , argumentFructoseNAFLD
-    , argumentHealthPromotingFoods
-    , argumentHealthSeeker
-    , argumentHealthyChocolate
-    , argumentHealthyDairy
-    , argumentHealthyFattyFish
-    , argumentHealthyFibre
-    , argumentHealthyFood
-    , argumentHealthyPlantFoods
-    , argumentHealthySeedOils
-    , argumentHealthySoy
-    , argumentMalondialdehyde
-    , argumentOmega3Omega6Ratio
-    , argumentPlantBasedCVDReversal
-    , argumentPolyphenolReductio
-    , argumentSodiumCVD
-    , argumentTMAOCausality
-    , argumentUnhealthyCoconutOil
-    , argumentUnhealthyProcessedMeat
-    , argumentUnhealthyRedMeat
-    , argumentUnhealthySaturatedFat
-    , argumentAbortion
-    , argumentAgnosticism
-    , argumentAgriculturalPredation
-    , argumentAnimalRights
-    , argumentAntiRewilding
-    , argumentAntiVandalism
-    , argumentColonizingNature
-    , argumentCropDeaths
-    , argumentDairyCowRape
-    , argumentEfilismPatrolSquad
-    , argumentEthicalSlurs
-    , argumentFineTuning
-    , argumentImmortalityReductio
-    , argumentOddOrderPredators
-    , argumentOstroveganism
-    , argumentPollinationReductio
-    , argumentScratcherPioneers
-    , argumentTransPeople
-    , argumentVeganSocietyReductio
-    , argumentBoobyTrapPagers
-    , argumentEpidemiologyCausality
-    , argumentFlatEarthDebunk
-    , argumentTruncatedMeta
-    ]
+        List.map argumentMaker
+            [ argumentApoBCVD
+            , argumentAnabolicKeto
+            , argumentAntagonisticPleiotropy
+            , argumentCarbsObesity
+            , argumentDietaryCholesterol
+            , argumentFructoseNAFLD
+            , argumentHealthPromotingFoods
+            , argumentHealthSeeker
+            , argumentHealthyChocolate
+            , argumentHealthyDairy
+            , argumentHealthyFattyFish
+            , argumentHealthyFibre
+            , argumentHealthyFood
+            , argumentHealthyPlantFoods
+            , argumentHealthySeedOils
+            , argumentHealthySoy
+            , argumentMalondialdehyde
+            , argumentOmega3Omega6Ratio
+            , argumentPlantBasedCVDReversal
+            , argumentPolyphenolReductio
+            , argumentSodiumCVD
+            , argumentTMAOCausality
+            , argumentUnhealthyCoconutOil
+            , argumentUnhealthyProcessedMeat
+            , argumentUnhealthyRedMeat
+            , argumentUnhealthySaturatedFat
+            , argumentAbortion
+            , argumentAgnosticism
+            , argumentAgriculturalPredation
+            , argumentAnimalRights
+            , argumentAntiRewilding
+            , argumentAntiVandalism
+            , argumentColonizingNature
+            , argumentCropDeaths
+            , argumentDairyCowRape
+            , argumentEfilismPatrolSquad
+            , argumentEthicalSlurs
+            , argumentFineTuning
+            , argumentImmortalityReductio
+            , argumentOddOrderPredators
+            , argumentOstroveganism
+            , argumentPollinationReductio
+            , argumentScratcherPioneers
+            , argumentTransPeople
+            , argumentVeganSocietyReductio
+            , argumentBoobyTrapPagers
+            , argumentEpidemiologyCausality
+            , argumentFlatEarthDebunk
+            , argumentTruncatedMeta
+            ]

frontend/src/Pages/Home_.elm

@@ -23,6 +23,12 @@ page shared route =
         , subscriptions = subscriptions
         , view = view
         }
+        |> Page.withLayout toLayout
+
+
+toLayout : Model -> Layouts.Layout Msg
+toLayout model =
+    Layouts.Navbar {}