feat: added glow

This commit is contained in:
Nick 2024-12-09 03:06:20 -06:00
parent 0d662c56eb
commit 6867defd0a
19 changed files with 156 additions and 51 deletions

View file

@ -38,6 +38,7 @@ cardMaker =
, centerX
, D.color colourTheme.backgroundDarkGrey
, D.rounded 32
, glow
]
@ -89,8 +90,8 @@ cardContentSpacing =
]
cardImageMaker : { src : String, description : String } -> Element msg
cardImageMaker image =
cardImageMaker : { src : String, description : String } -> String -> Element msg
cardImageMaker image url =
column
[ E.width <| px 115
, E.height <| px 115
@ -100,26 +101,31 @@ cardImageMaker image =
[ column
[ D.rounded 100
, D.width 5
, glow
, D.color colourTheme.backgroundDarkGrey
, B.color colourTheme.backgroundDarkGrey
, mouseOver [ D.color colourTheme.textDarkOrange ]
, htmlAttribute <| style "transition" "all 0.1s ease-in-out"
, mouseOver [ D.color colourTheme.textDarkOrange, glowHighlight ]
, htmlAttribute <| style "transition" "all 0.3s ease-in-out"
]
[ E.image
[ alignRight
, alignTop
, D.rounded 100
, clip
, E.width <| px 90
, E.height <| px 90
]
image
[ newTabLink []
{ url = url
, label =
E.image
[ alignRight
, alignTop
, D.rounded 100
, clip
, E.width <| px 90
, E.height <| px 90
]
image
}
]
]
cardImageMakerMobile : { src : String, description : String } -> Element msg
cardImageMakerMobile image =
cardImageMakerMobile : { src : String, description : String } -> String -> Element msg
cardImageMakerMobile image url =
column
[ alignTop
, centerX
@ -141,14 +147,18 @@ cardImageMakerMobile image =
, mouseOver [ D.color colourTheme.textDarkOrange ]
, htmlAttribute <| style "transition" "all 0.1s ease-in-out"
]
[ E.image
[ D.rounded 100
, clip
, centerX
, E.width <| px 45
, E.height <| px 45
]
image
[ newTabLink []
{ url = url
, label =
E.image
[ D.rounded 100
, clip
, centerX
, E.width <| px 45
, E.height <| px 45
]
image
}
]
]

View file

@ -13,10 +13,11 @@ type alias Theme =
, textDarkOrange : Color
, textDeepDarkOrange : Color
, backgroundLightGrey : Color
, debugColour : Color
, backgroundDarkGrey : Color
, backgroundDeepDarkGrey : Color
, barGreen : Color
, barRed : Color
, debugColour : Color
, transparent : Color
}
@ -29,9 +30,10 @@ colourTheme =
, textDarkOrange = rgb255 120 60 0
, textDeepDarkOrange = rgb255 60 30 0
, backgroundLightGrey = rgb255 40 40 40
, debugColour = rgb255 227 28 121
, backgroundDarkGrey = rgb255 30 30 30
, backgroundDeepDarkGrey = rgb255 20 20 20
, barGreen = rgb255 0 102 0
, barRed = rgb255 102 0 0
, debugColour = rgb255 227 28 121
, transparent = rgba 1 1 1 0
}

View file

@ -169,3 +169,13 @@ formatName name =
|> String.replace "'" ""
|> String.replace "." ""
|> String.replace "-" ""
glow : Attr decorative msg
glow =
D.glow colourTheme.backgroundDeepDarkGrey 8
glowHighlight : Attr decorative msg
glowHighlight =
D.glow colourTheme.textDeepDarkOrange 5

View file

@ -76,7 +76,7 @@ argumentMaker : Argument -> Element msg
argumentMaker argument =
row
topLevelBox
[ cardImageMaker (argumentImage argument)
[ cardImageMaker (argumentImage argument) ""
, cardMaker
[ cardTitleMaker argument.argumentTitle
, cardFormatter
@ -108,7 +108,7 @@ argumentMakerMobile argument =
[ cardContentSpacing
[ column
fieldSpacer
[ cardImageMakerMobile (argumentImage argument)
[ cardImageMakerMobile (argumentImage argument) ""
, propositionMakerMobile argument
, reductioMakerMobile argument
, summaryMakerMobile argument
@ -706,6 +706,7 @@ proofTreeMaker argument =
, F.center
, E.alignRight
, transitionStyle
, O.glow
, mouseOver
[ B.color colourTheme.textDeepDarkOrange
, F.color colourTheme.textDarkGrey

View file

@ -87,7 +87,7 @@ cuckMaker : Cuck -> Element msg
cuckMaker cuck =
row
topLevelBox
[ cardImageMaker (cuckImage cuck)
[ cardImageMaker (cuckImage cuck) (cuckSocial cuck)
, cardMaker
[ cardTitleMaker (cuckTitle cuck)
, cardFormatter
@ -121,7 +121,7 @@ cuckMakerMobile cuck =
, alignLeft
, spacing 3
]
[ cardImageMakerMobile (cuckImage cuck)
[ cardImageMakerMobile (cuckImage cuck) (cuckSocial cuck)
, socialMaker cuck
, dodgeTitle cuck
, dodgeMaker cuck
@ -150,6 +150,11 @@ cuckTitle cuck =
cuck.cuckName
cuckSocial : Cuck -> String
cuckSocial cuck =
cuck.cuckSocial
dodgeMaker : Cuck -> Element msg
dodgeMaker cuck =
column

View file

@ -35,7 +35,7 @@ gibberishMaker : Gibberish -> Element msg
gibberishMaker gibberish =
row
topLevelBox
[ cardImageMaker (gibberishImage gibberish)
[ cardImageMaker (gibberishImage gibberish) ""
, cardMaker
[ cardTitleMaker (gibberishTitle gibberish)
, cardFormatter
@ -72,7 +72,7 @@ gibberishMakerMobile gibberish =
, F.center
]
)
[ cardImageMakerMobile (gibberishImage gibberish)
[ cardImageMakerMobile (gibberishImage gibberish) ""
, mobileDomainList gibberish
]
]
@ -82,6 +82,7 @@ gibberishMakerMobile gibberish =
]
gibberishImage : Gibberish -> { src : String, description : String }
gibberishImage gibberish =
{ src = "gibberish/" ++ gibberish.gibberishImage ++ ".png"
@ -140,7 +141,7 @@ desktopMakeTerms terms index =
]
[ paragraph
[]
[ text (String.fromInt index ++ ". ") ]
[ text <| String.fromInt index ++ ". " ]
]
, column
[ E.width fill
@ -154,7 +155,12 @@ desktopMakeTerms terms index =
[ paragraph
[]
[ el [ F.color colourTheme.textLightOrange ] <|
text terms.term
text <|
String.toLower
("\""
++ terms.term
++ "\""
)
]
, desktopBar terms
, paragraph
@ -213,7 +219,10 @@ mobileMakeTerms terms index =
[ paragraph
[]
[ el [ F.color colourTheme.textLightOrange ] <|
text terms.term
text <|
String.toLower "\""
++ terms.term
++ "\""
]
, mobileBar terms
, paragraph

View file

@ -30,7 +30,7 @@ donateMaker : Donate -> Element msg
donateMaker donate =
row
topLevelBox
[ cardImageMaker (donateImage donate)
[ cardImageMaker (donateImage donate) (donateLink donate)
, cardMaker
[ cardTitleMaker (donateTitle donate)
, cardFormatter
@ -63,6 +63,7 @@ donateMakerMobile donate =
[ column
fieldSpacer
[ cardImageMakerMobile (donateImage donate)
(donateLink donate)
, feeMaker donate
, preferenceMaker donate
, tableMakerMobile donate
@ -94,6 +95,11 @@ donateTitle donate =
donate.donateName
donateLink : Donate -> String
donateLink donate =
donate.donateLink
donateWidth =
width <| px 45

View file

@ -11,7 +11,7 @@ donateKoFi =
"Ko-Fi"
in
{ donateImage = formatName name
, donateLink = "https://ko-fi.com/thenutrivore"
, donateLink = "https://ko-fi.com/uprootnutrition"
, donateName = name
, donateFees = "5%"
, donatePreference = 5

View file

@ -11,9 +11,9 @@ donatePatreon =
"Patreon"
in
{ donateImage = formatName name
, donateLink = "https://www.patreon.com/thenutrivore"
, donateLink = "https://www.patreon.com/c/upRootNutrition"
, donateName = name
, donateFees = "5%"
, donateFees = "8%"
, donatePreference = 6
, donateFeatures =
[ { free = Just False

View file

@ -0,0 +1,46 @@
module Donate.Methods.Stripe exposing (..)
import Donate.Types exposing (..)
donateStripe : Donate
donateStripe =
let
name : String
name =
"Stripe"
in
{ donateImage = formatName name
, donateLink = "https://donate.stripe.com/aEUaFT3Vd9ta1oI144"
, donateName = name
, donateFees = "3%"
, donatePreference = 8
, donateFeatures =
[ { free = Just False
, subscriptions = Just True
, openSource = Just False
, fastPayments = Just True
, userFriendly = Just True
, anonymous = Just True
, rewardTiers = Just False
}
]
, donatePros =
[ { pro = "Widely used and recognized globally."
}
, { pro = "Lower 3% transaction fee."
}
, { pro = "Offers buyer and seller protections."
}
, { pro = "Easy to use for one-time donations."
}
, { pro = "Familiar to most internet users."
}
]
, donateCons =
[ { con = "Can have complicated international transaction rules."
}
, { con = "Potential account limitations or freezes."
}
]
}

View file

@ -11,7 +11,7 @@ donateYouTube =
"YouTube"
in
{ donateImage = formatName name
, donateLink = "https://www.youtube.com/@TheNutrivore/membership"
, donateLink = "https://www.youtube.com/@upRootNutrition/membership"
, donateName = name
, donateFees = "45%"
, donatePreference = 3

View file

@ -36,6 +36,7 @@ headerMaker header =
, bottomRight = 32
, bottomLeft = 32
}
, glow
]
[ paragraph
(nonHighlightedTitleFormat

View file

@ -38,6 +38,7 @@ homePage image =
, left = 20
, right = 20
}
, O.glow
, B.color colourTheme.backgroundDarkGrey
, rounded 10
, E.width fill

View file

@ -23,7 +23,7 @@ interviewMaker : Interview -> Element msg
interviewMaker interview =
row
topLevelBox
[ cardImageMaker (interviewImage interview)
[ cardImageMaker (interviewImage interview) (interviewSocial interview)
, cardMaker
[ cardTitleMaker (interviewTitle interview)
, cardFormatter
@ -51,7 +51,7 @@ interviewMakerMobile interview =
[ cardContentSpacing
[ column
fieldSpacer
[ cardImageMakerMobile (interviewImage interview)
[ cardImageMakerMobile (interviewImage interview) (interviewSocial interview)
, socialMaker interview
, appearanceTitle interview
, appearanceMaker interview
@ -74,6 +74,11 @@ interviewTitle interview =
interview.interviewName
interviewSocial : Interview -> String
interviewSocial interview =
interview.interviewSocial
socialMaker : Interview -> Element msg
socialMaker interview =
paragraph

View file

@ -115,6 +115,7 @@ navbarContainer device content =
, D.widthEach { top = 0, bottom = 0, left = 0, right = 3 }
, D.color colourTheme.textDarkOrange
, B.color colourTheme.backgroundDarkGrey
, O.glow
]
(case ( device.class, device.orientation ) of
( Phone, Portrait ) ->
@ -353,7 +354,7 @@ desktopButtonMaker name icon =
, column
[ mouseOver [ F.color colourTheme.textLightOrange ]
, F.color colourTheme.textLightGrey
, htmlAttribute <| style "transition" "all 0.1s ease-in-out"
, htmlAttribute <| style "transition" "all 0.2s ease-in-out"
, alignBottom
]
[ text (String.toUpper name)

View file

@ -13,6 +13,7 @@ import Donate.Methods.LiberaPay exposing (donateLiberaPay)
import Donate.Methods.Merch exposing (donateMerch)
import Donate.Methods.Patreon exposing (donatePatreon)
import Donate.Methods.PayPal exposing (donatePayPal)
import Donate.Methods.Stripe exposing (donateStripe)
import Donate.Methods.YouTube exposing (donateYouTube)
import Donate.Types exposing (..)
import Effect exposing (Effect)
@ -129,7 +130,7 @@ donateList device =
List.map donateMaker
)
[ donateLiberaPay
, donatePayPal
, donateStripe
, donatePatreon
, donateCardano
, donateKoFi

View file

@ -1,5 +1,6 @@
module Services.Helpers exposing (..)
import Browser
import Config.CardFormat exposing (..)
import Config.Colour exposing (..)
import Config.Format exposing (..)
@ -8,7 +9,8 @@ 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 Html exposing (Html, a, text)
import Html.Attributes as H exposing (href, style)
import Layouts
import Page exposing (Page)
import Route exposing (Route)
@ -21,7 +23,7 @@ serviceMaker : Service -> Element msg
serviceMaker service =
row
topLevelBox
[ cardImageMaker (serviceImage service)
[ cardImageMaker (serviceImage service) ""
, cardMaker
[ cardTitleMaker (serviceTitle service)
, cardFormatter
@ -49,7 +51,7 @@ serviceMakerMobile service =
[ cardContentSpacing
[ column
fieldSpacer
[ cardImageMakerMobile (serviceImage service)
[ cardImageMakerMobile (serviceImage service) ""
, rateMaker service
, descriptionMaker service
, offeringMaker service
@ -60,6 +62,11 @@ serviceMakerMobile service =
]
emailLink : List (Html msg) -> Html msg
emailLink =
a [ href "mailto:nick@upRootNutrition.com?subject=Hello&body=%20" ]
serviceImage : Service -> { src : String, description : String }
serviceImage service =
{ src = "services/" ++ service.serviceImage ++ ".png"
@ -88,7 +95,7 @@ rateMaker service =
[ alignTop
, serviceWidth
]
[ text "Rate:"
[ E.text "Rate:"
]
, column
[ E.width fill
@ -96,7 +103,7 @@ rateMaker service =
]
[ paragraph [ F.regular ]
[ el [ F.color colourTheme.textLightOrange ] <|
text service.serviceRate
E.text service.serviceRate
]
]
]
@ -109,7 +116,7 @@ descriptionMaker service =
[ alignTop
, width <| px 80
]
[ text "Offerings:"
[ E.text "Offerings:"
]
]
@ -141,5 +148,5 @@ makeDescription description =
]
)
[ paragraph [ F.regular ]
[ text (" " ++ description.point) ]
[ E.text (" " ++ description.point) ]
]

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB