mirror of
https://gitlab.com/upRootNutrition/website.git
synced 2025-06-16 04:25:11 -05:00
feat: so very close
This commit is contained in:
parent
185d922ffb
commit
071c823c41
20 changed files with 293 additions and 570 deletions
|
@ -1,6 +1,7 @@
|
|||
module Pages.Donate exposing (Model, Msg, page)
|
||||
|
||||
import Config.Data.Identity as I exposing (..)
|
||||
import Config.Helpers.Cards.Inner.Helpers exposing (detailBodyMaker, detailFormat, detailFormatEl, detailTitleMaker, listItem, listMaker)
|
||||
import Config.Helpers.Cards.Outer.Helpers exposing (cardMaker)
|
||||
import Config.Helpers.Cards.Outer.Types as C
|
||||
import Config.Helpers.Format
|
||||
|
@ -169,194 +170,55 @@ contentList device donate =
|
|||
<|
|
||||
imageSquareMaker device (imagePathMaker M.Donate donate.donateImage) True size
|
||||
in
|
||||
[ row [ width fill ]
|
||||
[ image "Small"
|
||||
, column [ width fill ]
|
||||
[ detailFormat row
|
||||
[ image "Fatty"
|
||||
, detailFormat column
|
||||
[ feeMaker donate
|
||||
, preferenceMaker donate
|
||||
, tableMaker donate device
|
||||
]
|
||||
]
|
||||
, tableMaker donate device
|
||||
, proTitleMaker donate
|
||||
, proMaker donate
|
||||
, conTitleMaker donate
|
||||
, conMaker donate
|
||||
, proConMaker donate
|
||||
]
|
||||
|
||||
|
||||
donateWidth =
|
||||
width <| px 45
|
||||
|
||||
|
||||
feeMaker : Donate -> Element msg
|
||||
feeMaker donate =
|
||||
row
|
||||
[ F.color colourTheme.textLightOrange
|
||||
, paragraphSpacing
|
||||
, F.bold
|
||||
, headerFontSizeSmall
|
||||
, E.width fill
|
||||
, spacing 5
|
||||
]
|
||||
[ column
|
||||
[ alignTop
|
||||
]
|
||||
[ text "Fees:"
|
||||
]
|
||||
, el
|
||||
[ E.width fill
|
||||
, alignLeft
|
||||
]
|
||||
<|
|
||||
el
|
||||
[ F.regular
|
||||
, paragraphFontSize
|
||||
, F.color colourTheme.textLightGrey
|
||||
]
|
||||
<|
|
||||
text donate.donateFees
|
||||
detailFormat row
|
||||
[ detailTitleMaker TextLightOrange "Fees:"
|
||||
, detailBodyMaker TextLightGrey (text donate.donateFees)
|
||||
]
|
||||
|
||||
|
||||
proTitleMaker : Donate -> Element msg
|
||||
proTitleMaker donate =
|
||||
row
|
||||
[ F.color colourTheme.textLightOrange
|
||||
, paragraphSpacing
|
||||
, headerFontSizeSmall
|
||||
, F.bold
|
||||
proConMaker : Donate -> Element msg
|
||||
proConMaker donate =
|
||||
detailFormat column
|
||||
[ detailTitleMaker TextLightOrange "Pros:"
|
||||
, listMaker makePro donate.donatePros
|
||||
, detailTitleMaker TextLightOrange "Cons:"
|
||||
, listMaker makeCon donate.donateCons
|
||||
]
|
||||
[ el
|
||||
[ alignTop
|
||||
, width <| px 80
|
||||
]
|
||||
<|
|
||||
text "Pros:"
|
||||
]
|
||||
|
||||
|
||||
conTitleMaker : Donate -> Element msg
|
||||
conTitleMaker donate =
|
||||
row
|
||||
[ F.color colourTheme.textLightOrange
|
||||
, paragraphSpacing
|
||||
, headerFontSizeSmall
|
||||
, F.bold
|
||||
]
|
||||
[ el
|
||||
[ 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
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, paragraphFontSize
|
||||
, F.bold
|
||||
, alignLeft
|
||||
, 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))
|
||||
listItem TextLightGrey pro.pro
|
||||
|
||||
|
||||
makeCon : Cons -> Element msg
|
||||
makeCon con =
|
||||
column
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, paragraphFontSize
|
||||
, F.bold
|
||||
, alignLeft
|
||||
, spacing 8
|
||||
, width fill
|
||||
]
|
||||
[ paragraph [ F.regular ] <|
|
||||
[ text ("• " ++ con.con)
|
||||
]
|
||||
]
|
||||
listItem TextLightGrey con.con
|
||||
|
||||
|
||||
preferenceMaker : Donate -> Element msg
|
||||
preferenceMaker donate =
|
||||
row
|
||||
[ width fill
|
||||
, height fill
|
||||
]
|
||||
[ column
|
||||
[ E.alignTop
|
||||
, E.alignLeft
|
||||
]
|
||||
[ paragraph
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, F.bold
|
||||
, headerFontSizeSmall
|
||||
, alignLeft
|
||||
, E.width fill
|
||||
]
|
||||
[ el
|
||||
[ tooltip
|
||||
"This represents how strongly I prefer a given platform relative to other platforms."
|
||||
]
|
||||
(el
|
||||
[ paddingEach
|
||||
{ top = 0
|
||||
, right = 10
|
||||
, bottom = 0
|
||||
, left = 0
|
||||
}
|
||||
, F.color colourTheme.textLightOrange
|
||||
]
|
||||
<|
|
||||
text "Preference:"
|
||||
)
|
||||
]
|
||||
detailFormat row
|
||||
[ el
|
||||
[ tooltip
|
||||
"This represents how strongly I prefer a given platform relative to other platforms."
|
||||
]
|
||||
<|
|
||||
detailTitleMaker TextLightOrange "Preference:"
|
||||
, barPadding
|
||||
[ barMaker getPreferenceTooltip donate.donatePreference ]
|
||||
]
|
||||
|
@ -404,48 +266,44 @@ getPreferenceTooltip num =
|
|||
|
||||
tableMaker : Donate -> Device -> Element msg
|
||||
tableMaker donate device =
|
||||
column
|
||||
[ centerX
|
||||
el
|
||||
[ E.alignLeft
|
||||
, E.width fill
|
||||
, centerX
|
||||
]
|
||||
[ el
|
||||
[ E.alignLeft
|
||||
, E.width fill
|
||||
]
|
||||
<|
|
||||
E.table
|
||||
([ spacing 0
|
||||
, D.rounded 10
|
||||
, D.width 2
|
||||
, D.color colourTheme.textDarkGrey
|
||||
, clip
|
||||
]
|
||||
++ (case ( device.class, device.orientation ) of
|
||||
( Phone, Portrait ) ->
|
||||
[ B.color colourTheme.backgroundSpreadsheet ]
|
||||
<|
|
||||
E.table
|
||||
([ spacing 0
|
||||
, D.rounded 10
|
||||
, D.width 2
|
||||
, D.color colourTheme.textDarkGrey
|
||||
, clip
|
||||
]
|
||||
++ (case ( device.class, device.orientation ) of
|
||||
( Phone, Portrait ) ->
|
||||
[ B.color colourTheme.backgroundSpreadsheet ]
|
||||
|
||||
( Tablet, Portrait ) ->
|
||||
[ B.color colourTheme.backgroundSpreadsheet ]
|
||||
( Tablet, Portrait ) ->
|
||||
[ B.color colourTheme.backgroundSpreadsheet ]
|
||||
|
||||
_ ->
|
||||
[]
|
||||
)
|
||||
)
|
||||
{ data = donate.donateFeatures
|
||||
, columns =
|
||||
List.map createColumn
|
||||
(case ( device.class, device.orientation ) of
|
||||
( Phone, Portrait ) ->
|
||||
mobileLabels
|
||||
_ ->
|
||||
[]
|
||||
)
|
||||
)
|
||||
{ data = donate.donateFeatures
|
||||
, columns =
|
||||
List.map createColumn
|
||||
(case ( device.class, device.orientation ) of
|
||||
( Phone, Portrait ) ->
|
||||
mobileLabels
|
||||
|
||||
( Tablet, Portrait ) ->
|
||||
mobileLabels
|
||||
( Tablet, Portrait ) ->
|
||||
mobileLabels
|
||||
|
||||
_ ->
|
||||
desktopLabels
|
||||
)
|
||||
}
|
||||
]
|
||||
_ ->
|
||||
desktopLabels
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
desktopLabels : List { label : String, getter : { a | free : b, subscriptions : b, userFriendly : b, anonymous : b, rewardTiers : b } -> b }
|
||||
|
@ -497,7 +355,7 @@ createColumn { label, getter } =
|
|||
, right = 0
|
||||
}
|
||||
, D.color colourTheme.textDarkGrey
|
||||
, padding 8
|
||||
, padding 5
|
||||
, E.width fill
|
||||
, F.center
|
||||
]
|
||||
|
@ -516,10 +374,13 @@ createColumn { label, getter } =
|
|||
, right = 0
|
||||
}
|
||||
, D.color colourTheme.textDarkGrey
|
||||
, padding 8
|
||||
, padding 5
|
||||
, E.height fill
|
||||
]
|
||||
[ row [ centerX ]
|
||||
[ row
|
||||
[ centerX
|
||||
, centerY
|
||||
]
|
||||
[ paragraph []
|
||||
[ E.image
|
||||
[ E.width <| px 30
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue