feat: updated nutridex stuff

This commit is contained in:
Nick 2024-12-01 16:19:10 -06:00
parent 36f9c89214
commit c304bcb0b2
28 changed files with 130 additions and 9 deletions

109
frontend/src/Products/Helpers.elm Normal file → Executable file
View file

@ -9,6 +9,7 @@ import Effect exposing (Effect)
import Element as E exposing (..)
import Element.Background as B exposing (..)
import Element.Border as D
import Element.Events exposing (onClick)
import Element.Font as F
import Headers.Types exposing (..)
import Html.Attributes as H exposing (style)
@ -46,7 +47,6 @@ nutriDexMaker nutridex =
, left = 25
, right = 15
}
, alignBottom
, width fill
, F.center
, D.roundEach
@ -68,9 +68,114 @@ nutriDexMaker nutridex =
, F.center
]
)
[ text nutridex.nutriDexTitle ]
[ featureList nutridex ]
]
]
]
]
]
makeFeature : Features -> Element msg
makeFeature features =
column
[ E.width fill
, paddingEach
{ top = 0
, right = 0
, bottom = 0
, left = 8
}
]
[ row [ E.width fill ]
[ column [ E.width fill ]
[ paragraph [ F.regular, F.alignLeft ]
[ text (" " ++ features.feature) ]
]
]
]
featureList : NutriDex -> Element msg
featureList nutridex =
column
[ spacing 8
, width fill
, height fill
]
[ row
[ spacing 20
, width fill
, height fill
]
[ column
[]
[ column
[ spacing 20
]
[ row
[ D.rounded 25
, D.width 5
, centerX
, D.color colourTheme.backgroundLightGrey
, B.color colourTheme.backgroundLightGrey
]
[ E.image
[ D.rounded 20
, clip
, E.width <| px 305
, E.height <| px 231
]
{ src = "nutridex/nutridex.png", description = "" }
]
, row
[ D.width 5
, D.rounded 25
, centerX
, D.color colourTheme.backgroundLightGrey
, B.color colourTheme.backgroundLightGrey
]
[ row
[ B.color colourTheme.textDarkOrange
, D.rounded 30
, F.size 25
, F.bold
, paddingEach
{ top = 10
, right = 25
, bottom = 10
, left = 25
}
]
[ newTabLink []
{ url = "https://the-nutrivore.myshopify.com/cart/31192710807615:1?channel=buy_button"
, label = row [ F.center ] [ text "Purchase!" ]
}
]
]
]
, column
[ centerX ]
[ column
[ F.size 18
, F.bold
, F.color colourTheme.textLightOrange
]
[ newTabLink []
{ url = "https://drive.google.com/file/d/1sk7VgjuL2rEqQdnBRdZjr2_Ab9vwrbmo/view?usp=sharing"
, label =
paragraph
[ centerX
, centerY
]
[ text "Cost Efficiency Score!" ]
}
]
]
]
, column [ width fill, F.size 12, spacing 3 ] <|
List.map2 (\x y -> makeFeature x)
nutridex.nutriDexFeatures
(List.range 1 (List.length nutridex.nutriDexFeatures))
]
]