feat: added donation page

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."