feat: improved debate page

frontend/src/Config/Format.elm

@@ -21,7 +21,7 @@ pageList =
     [ spacing 40
     , centerX
     , centerY
-    , moveDown 60
+    , moveDown 30
     , alignTop
     ]
 
@@ -47,6 +47,14 @@ transitionNonHighlightedLinkHover =
         ]
 
 
+transitionNonHighlightedLinkHoverWithMove : Element msg -> Element msg
+transitionNonHighlightedLinkHoverWithMove =
+    el
+        [ mouseOver [ F.color colourTheme.highlightText, moveRight 10 ]
+        , transitionStyle
+        ]
+
+
 spartanFont : F.Font
 spartanFont =
     F.typeface "League Spartan"
@@ -143,6 +151,7 @@ paragraphAlignLeft =
     [ alignLeft, paragraphWidth ]
         ++ paragraphText
 
+
 paragraphAlignCenter : List (Attr () msg)
 paragraphAlignCenter =
     [ centerX, paragraphWidth ]

frontend/src/Config/Identity.elm

@@ -10,7 +10,6 @@ type alias PageInput =
     , pageInterviews : String
     , pageNutriDex : String
     , pagePlatforms : String
-    , pagePropositions : String
     , pageServices : String
     , pageSupport : String
     }
@@ -21,9 +20,8 @@ pageNames =
     { pageHome = "The Nutrivore"
     , pagePlatforms = "Platforms"
     , pageServices = "Services"
-    , pageDebate = "Debate"
     , pageDodgers = "Dodgers"
-    , pagePropositions = "Propositions"
+    , pageDebate = "Debate"
     , pageHyperBlog = "HyperBlog"
     , pageNutriDex = "NutriDex"
     , pageInterviews = "Interviews"
@@ -72,11 +70,6 @@ platformsName =
     createPageName pageNames.pagePlatforms
 
 
-propositionsName : String
-propositionsName =
-    createPageName pageNames.pagePropositions
-
-
 servicesName : String
 servicesName =
     createPageName pageNames.pageServices

frontend/src/Layouts/Navbar.elm

@@ -81,30 +81,32 @@ view { toContentMsg, model, content } =
             localhostUrl =
                 "http://localhost:1234/"
         in
-        column
+        row
             [ width fill
             , height fill
             , B.color colourTheme.backgroundColour
             ]
             [ column
-                [ height <| px 80
+                [ width <| px 200
-                , centerX
+                , alignLeft
+                , alignTop
+                , moveDown 30
                 ]
-                [ row
+                [ column
-                    [ spacing 30
+                    [ spacing 20
-                    , centerY
+                    , centerX
                     , F.color colourTheme.nonHighlightedText
                     ]
-                    [ image [ spacing 30, width <| px 80 ] { src = "navbar/nutrivorelogo.png", description = "" }
+                    [ image [ spacing 2, width <| px 80, centerX ] { src = "navbar/nutrivorelogo.png", description = "" }
                     , link nonHighlightedTitleFormat { url = localhostUrl ++ pageNames.pageHome, label = transitionNonHighlightedLinkHover <| text "THE NUTRIVORE" }
-                    , link navBarLinkFormat { url = localhostUrl ++ "platforms", label = transitionNonHighlightedLinkHover <| text "PLATFORMS" }
+                    , link navBarLinkFormat { url = localhostUrl ++ "platforms", label = transitionNonHighlightedLinkHoverWithMove <| text "PLATFORMS" }
-                    , link navBarLinkFormat { url = localhostUrl ++ "services", label = transitionNonHighlightedLinkHover <| text "SERVICES" }
+                    , link navBarLinkFormat { url = localhostUrl ++ "services", label = transitionNonHighlightedLinkHoverWithMove <| text "SERVICES" }
-                    , link navBarLinkFormat { url = localhostUrl ++ "cebate", label = transitionNonHighlightedLinkHover <| text "DEBATE" }
+                    , link navBarLinkFormat { url = localhostUrl ++ "debate", label = transitionNonHighlightedLinkHoverWithMove <| text "DEBATE" }
-                    , link navBarLinkFormat { url = localhostUrl ++ "blog", label = transitionNonHighlightedLinkHover <| text "BLOG" }
+                    , link navBarLinkFormat { url = localhostUrl ++ "blog", label = transitionNonHighlightedLinkHoverWithMove <| text "BLOG" }
-                    , link navBarLinkFormat { url = localhostUrl ++ "nutridex", label = transitionNonHighlightedLinkHover <| text "NUTRI-DEX" }
+                    , link navBarLinkFormat { url = localhostUrl ++ "nutridex", label = transitionNonHighlightedLinkHoverWithMove <| text "NUTRI-DEX" }
-                    , link navBarLinkFormat { url = localhostUrl ++ "support", label = transitionNonHighlightedLinkHover <| text "SUPPORT" }
+                    , link navBarLinkFormat { url = localhostUrl ++ "support", label = transitionNonHighlightedLinkHoverWithMove <| text "SUPPORT" }
-                    , link navBarLinkFormat { url = localhostUrl ++ "interviews", label = transitionNonHighlightedLinkHover <| text "INTERVIEWS" }
+                    , link navBarLinkFormat { url = localhostUrl ++ "interviews", label = transitionNonHighlightedLinkHoverWithMove <| text "INTERVIEWS" }
-                    , link navBarLinkFormat { url = localhostUrl ++ "contact", label = transitionNonHighlightedLinkHover <| text "CONTACT" }
+                    , link navBarLinkFormat { url = localhostUrl ++ "contact", label = transitionNonHighlightedLinkHoverWithMove <| text "CONTACT" }
                     ]
                 ]
             , content.element

frontend/src/Pages/Debate.elm

@@ -0,0 +1,302 @@
+module Pages.Debate exposing (Model, Msg, page)
+
+import Config.Colour as T exposing (..)
+import Config.Format as O exposing (..)
+import Config.Identity as I exposing (..)
+import Effect exposing (Effect)
+import Element exposing (..)
+import Element.Border as D exposing (..)
+import Element.Font as F
+import Html
+import Html.Attributes as H exposing (style, title, wrap)
+import Layouts
+import Page exposing (Page)
+import Route exposing (Route)
+import Shared
+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 = debateName
+    , attributes = []
+    , element = debateContainer
+    }
+
+
+debateContainer : Element msg
+debateContainer =
+    topLevelContainer debateList
+
+
+debateList : Element msg
+debateList =
+    column
+        pageList
+        argumentList
+
+
+type alias MakeRowInput =
+    { argumentTitle : String
+    , propositionTitle : String
+    , propositionSummary : String
+    , definitionTable : List Definition
+    , argumentFormalization : List ArgumentEntry
+    }
+
+
+type alias PremiseWithNotation =
+    { premise : String
+    , notation : String
+    }
+
+
+type alias ArgumentEntry =
+    { premises : List PremiseWithNotation
+    , conclusion : String
+    , conclusionNotation : String
+    }
+
+
+type alias Definition =
+    { definiendum : String
+    , definiens : String
+    }
+
+
+type alias Category =
+    { categoryName : String
+    , propositions : List MakeRowInput
+    }
+
+
+makeRow : MakeRowInput -> Element msg
+makeRow makeRowInput =
+    let
+        argRows : List (Element msg)
+        argRows =
+            let
+                argumentFormatting =
+                    [ centerX, F.center, spacing 3 ]
+            in
+            List.indexedMap
+                (\index argumentEntry ->
+                    column (paragraphFormat ++ [ spacing 3, paddingEach { top = 30, right = 0, bottom = 0, left = 0 } ])
+                        (List.indexedMap
+                            (\premiseIndex premiseWithNotation ->
+                                column argumentFormatting
+                                    [ paragraph paragraphHightlightedBoldText
+                                        [ text ("P" ++ String.fromInt (premiseIndex + 1) ++ ") ")
+                                        , text premiseWithNotation.premise
+                                            |> el [ F.color colourTheme.nonHighlightedText, F.regular ]
+                                        ]
+                                    , paragraph argumentFormatting
+                                        [ text premiseWithNotation.notation
+                                            |> el [ F.color colourTheme.highlightText, F.bold ]
+                                        ]
+                                    ]
+                            )
+                            argumentEntry.premises
+                            ++ [ column argumentFormatting
+                                    [ paragraph paragraphHightlightedBoldText
+                                        [ text ("C" ++ String.fromInt (index + 1) ++ ") ")
+                                        , text argumentEntry.conclusion
+                                            |> el [ F.color colourTheme.nonHighlightedText, F.regular ]
+                                        ]
+                                    , paragraph argumentFormatting
+                                        [ text argumentEntry.conclusionNotation
+                                            |> el [ F.color colourTheme.highlightText, F.bold ]
+                                        ]
+                                    ]
+                               ]
+                        )
+                )
+                makeRowInput.argumentFormalization
+    in
+    column
+        [ paragraphWidth, alignLeft, spacing 8 ]
+        [ paragraph paragraphBoldFormat
+            [ text makeRowInput.argumentTitle |> el [ F.color colourTheme.nonHighlightedText, F.bold ]
+            ]
+        , paragraph paragraphBoldFormat
+            [ text "Proposition: " |> el [ F.color colourTheme.highlightText ]
+            , text makeRowInput.propositionTitle |> el [ F.color colourTheme.nonHighlightedText, F.regular ]
+            ]
+        , paragraph paragraphBoldFormat
+            [ text "Summary: " |> el [ F.color colourTheme.highlightText ]
+            , text makeRowInput.propositionSummary |> el [ F.color colourTheme.nonHighlightedText, F.regular ]
+            ]
+        , wrappedRow (paragraphBoldFormat ++ [ alignLeft ])
+            [ Element.table [ spacing 8 ]
+                { data = makeRowInput.definitionTable
+                , columns =
+                    [ { header = el [ F.bold ] (text "Definiendum" |> el [ F.color colourTheme.highlightText ])
+                      , width = fill |> maximum 50
+                      , view =
+                            \definition ->
+                                text definition.definiendum
+                                    |> el [ F.color colourTheme.highlightText, F.bold ]
+                      }
+                    , { header = el [ F.bold ] (text "Definiens" |> el [ F.color colourTheme.highlightText ])
+                      , width = fill
+                      , view =
+                            \definition ->
+                                paragraph [ F.color colourTheme.nonHighlightedText, F.regular ]
+                                    [ text definition.definiens ]
+                      }
+                    ]
+                }
+            ]
+        , column [ centerX ] argRows
+        ]
+
+
+argumentList : List (Element msg)
+argumentList =
+    List.map
+        (\category ->
+            column [ spacing 20 ]
+                [ el (nonHighlightedTitleFormat ++ [ centerX ]) (text category.categoryName)
+                , column [] (List.map makeRow category.propositions)
+                ]
+        )
+        [ { categoryName = "Dietary Patterns"
+          , propositions =
+                [ { argumentTitle = "Argument for Using the Term Retard"
+                  , propositionTitle = ""
+                  , propositionSummary = ""
+                  , definitionTable =
+                        [ { definiendum = "C(x)"
+                          , definiens = "(x) slur's negative connotations have been neutralised"
+                          }
+                        , { definiendum = "B(x)"
+                          , definiens = "(x) slur has been rendered non-bigoted via altered usage"
+                          }
+                        , { definiendum = "D(x)"
+                          , definiens = "oppressed people will continue to suffer from the use of (x) slur"
+                          }
+                        , { definiendum = "S(x)"
+                          , definiens = "it is permissible to neutralise the term retard's negative connotations"
+                          }
+                        , { definiendum = "A(x)"
+                          , definiens = "it is generally permissible to use the term retard with an altered non-bigoted meaning"
+                          }
+                        , { definiendum = "r"
+                          , definiens = "retard"
+                          }
+                        ]
+                  , argumentFormalization =
+                        [ { premises =
+                                [ { premise = "For all slurs, (x) slur's negative connotations have been neutralised if and only if, (x) slur has been rendered non-bigoted via altered usage."
+                                  , notation = "(∀x(Cx↔Bx))"
+                                  }
+                                , { premise = "For all slurs, if it is not the case that (x) slur's negative connotations have been neutralised, then oppressed people will continue to suffer from the use of (x) slur."
+                                  , notation = "(∀x(¬Cx→Dx))"
+                                  }
+                                , { premise = "It is not the case that the term retard's negative connotations have been neutralised."
+                                  , notation = "(¬Cr)"
+                                  }
+                                , { premise = "If the term retard has not been rendered non-bigoted via altered usage and oppressed people will continue to suffer from the use of the term retard, then it is permissible to neutralise the term retard's negative connotations."
+                                  , notation = "(¬Br∧Dr→Sr)"
+                                  }
+                                , { premise = "If it is permissible to neutralise the term retard's negative connotations, then It is generally permissible to use the term retard with an altered non-bigoted meaning."
+                                  , notation = "(Sr→Ar)"
+                                  }
+                                ]
+                          , conclusion = "Therefore, it is generally permissible to use the term retard with an altered non-bigoted meaning."
+                          , conclusionNotation = "(∴Ar)"
+                          }
+                        ]
+                  }
+                , { argumentTitle = ""
+                  , propositionTitle = ""
+                  , propositionSummary = ""
+                  , definitionTable =
+                        [ { definiendum = ""
+                          , definiens = ""
+                          }
+                        , { definiendum = ""
+                          , definiens = ""
+                          }
+                        ]
+                  , argumentFormalization =
+                        [ { premises =
+                                [ { premise = ""
+                                  , notation = ""
+                                  }
+                                , { premise = ""
+                                  , notation = ""
+                                  }
+                                , { premise = "."
+                                  , notation = ""
+                                  }
+                                ]
+                          , conclusion = ""
+                          , conclusionNotation = ""
+                          }
+                        ]
+                  }
+                ]
+          }
+        ]

frontend/src/Pages/Propositions.elm

@@ -1,202 +0,0 @@
-module Pages.Propositions exposing (Model, Msg, page)
-
-import Config.Colour as T exposing (..)
-import Config.Format as O exposing (..)
-import Config.Identity as I exposing (..)
-import Effect exposing (Effect)
-import Element exposing (..)
-import Element.Font as F
-import Html
-import Html.Attributes as H exposing (style, wrap)
-import Layouts
-import Page exposing (Page)
-import Route exposing (Route)
-import Shared
-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 = propositionsName
-    , attributes = []
-    , element = propositionsContainer
-    }
-
-
-propositionsContainer : Element msg
-propositionsContainer =
-    topLevelContainer propositionsList
-
-
-propositionsList : Element msg
-propositionsList =
-    column
-        pageList
-        propositions
-
-
-type alias MakeRowInput =
-    { propositionTitle : String
-    , propositionSummary : String
-    , definitionTable : List Definition
-    , argumentFormalization : List ArgumentEntry
-    }
-
-
-type alias ArgumentEntry =
-    { premises : List String
-    , conclusion : String
-    }
-
-
-type alias Definition =
-    { definiendum : String
-    , definiens : String
-    }
-
-
-makeRow : MakeRowInput -> Element msg
-makeRow makeRowInput =
-    let
-        argRows : List (Element msg)
-        argRows =
-            List.indexedMap
-                (\index argumentEntry ->
-                    column paragraphFormat
-                        (List.indexedMap
-                            (\premiseIndex premise ->
-                                row paragraphHightlightedBoldText
-                                    [ text ("P" ++ String.fromInt (premiseIndex + 1) ++ ")")
-                                    , text premise |> el [ F.color colourTheme.nonHighlightedText, F.regular ]
-                                    ]
-                            )
-                            argumentEntry.premises
-                            ++ [ row paragraphHightlightedBoldText
-                                    [ text ("C" ++ String.fromInt (index + 1) ++ ")")
-                                    , text argumentEntry.conclusion |> el [ F.color colourTheme.nonHighlightedText, F.regular ]
-                                    ]
-                               ]
-                        )
-                )
-                makeRowInput.argumentFormalization
-    in
-    column
-        [ paragraphWidth, alignLeft, spacing 8 ]
-        [ row paragraphBoldFormat
-            [ text "Proposition:" |> el [ F.color colourTheme.highlightText ]
-            , text makeRowInput.propositionTitle |> el [ F.color colourTheme.nonHighlightedText, F.regular ]
-            ]
-        , row paragraphBoldFormat
-            [ text "Summary:" |> el [ F.color colourTheme.highlightText ]
-            , text makeRowInput.propositionSummary |> el [ F.color colourTheme.nonHighlightedText, F.regular ]
-            ]
-        , wrappedRow (paragraphBoldFormat ++ [ alignLeft ])
-            [ Element.table [ spacing 8 ]
-                { data = makeRowInput.definitionTable
-                , columns =
-                    [ { header = el [ F.bold ] (text "Definiendum" |> el [ F.color colourTheme.highlightText ])
-                      , width = fill
-                      , view =
-                            \definition ->
-                                text definition.definiendum
-                                    |> el [ F.color colourTheme.highlightText, F.bold ]
-                      }
-                    , { header = el [ F.bold ] (text "Definiens" |> el [ F.color colourTheme.highlightText ])
-                      , width = fill
-                      , view =
-                            \definition ->
-                                text definition.definiens
-                                    |> el [ F.color colourTheme.nonHighlightedText, F.regular ]
-                      }
-                    ]
-                }
-            ]
-        , column [ centerX, paragraphSpacing ] argRows
-        ]
-
-
-propositions =
-    List.map makeRow
-        [ { propositionTitle = "String"
-          , propositionSummary = "String"
-          , definitionTable =
-                [ { definiendum = "Term 1"
-                  , definiens = "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."
-                  }
-                , { definiendum = "Term 2"
-                  , definiens = "Definition 2"
-                  }
-                ]
-          , argumentFormalization =
-                [ { premises =
-                        [ "First premise"
-                        , "Second premise"
-                        , "Third premise"
-                        , "Fourth premise"
-                        ]
-                  , conclusion = "Conclusion"
-                  }
-                ]
-          }
-        ]