mirror of
https://gitlab.com/upRootNutrition/website.git
synced 2025-06-16 04:25:11 -05:00
feat: changed colour names to be more intuitive
This commit is contained in:
parent
ed73a38cbe
commit
6019079212
10 changed files with 65 additions and 65 deletions
|
@ -30,7 +30,7 @@ cardMaker =
|
|||
column
|
||||
[ E.width <| px 650
|
||||
, D.width 5
|
||||
, D.color colourTheme.cardBackground
|
||||
, D.color colourTheme.backgroundDarkGrey
|
||||
, D.roundEach
|
||||
{ topLeft = 32
|
||||
, topRight = 32
|
||||
|
@ -45,7 +45,7 @@ cardFormatter =
|
|||
column
|
||||
[ E.height fill
|
||||
, E.width fill
|
||||
, B.color colourTheme.cardBackground
|
||||
, B.color colourTheme.backgroundDarkGrey
|
||||
, paddingEach
|
||||
{ top = 10
|
||||
, bottom = 10
|
||||
|
@ -87,8 +87,8 @@ cardImageMaker image =
|
|||
[ column
|
||||
[ D.rounded 100
|
||||
, D.width 5
|
||||
, D.color colourTheme.cardBackground
|
||||
, B.color colourTheme.cardBackground
|
||||
, D.color colourTheme.backgroundDarkGrey
|
||||
, B.color colourTheme.backgroundDarkGrey
|
||||
]
|
||||
[ E.image
|
||||
[ alignRight
|
||||
|
@ -108,7 +108,7 @@ cardTitleMaker title =
|
|||
row
|
||||
(nonHighlightedTitleFormat
|
||||
++ [ F.size 20
|
||||
, B.color colourTheme.highlightTextHover
|
||||
, B.color colourTheme.textDarkOrange
|
||||
, paddingEach
|
||||
{ top = 6
|
||||
, bottom = 3
|
||||
|
|
|
@ -7,13 +7,13 @@ import Html.Attributes as H exposing (style)
|
|||
|
||||
|
||||
type alias Theme =
|
||||
{ nonHighlightedText : Color
|
||||
, nonHighlightedDarkText : Color
|
||||
, highlightText : Color
|
||||
, highlightTextHover : Color
|
||||
, backgroundColour : Color
|
||||
{ textLightGrey : Color
|
||||
, textDarkGrey : Color
|
||||
, textLightOrange : Color
|
||||
, textDarkOrange : Color
|
||||
, backgroundLightGrey : Color
|
||||
, debugColour : Color
|
||||
, cardBackground : Color
|
||||
, backgroundDarkGrey : Color
|
||||
, barGreen : Color
|
||||
, barRed : Color
|
||||
, transparent : Color
|
||||
|
@ -22,13 +22,13 @@ type alias Theme =
|
|||
|
||||
colourTheme : Theme
|
||||
colourTheme =
|
||||
{ nonHighlightedText = rgb255 212 212 212
|
||||
, nonHighlightedDarkText = rgb255 126 126 126
|
||||
, highlightText = rgb255 204 102 0
|
||||
, highlightTextHover = rgb255 120 60 0
|
||||
, backgroundColour = rgb255 40 40 40
|
||||
{ textLightGrey = rgb255 212 212 212
|
||||
, textDarkGrey = rgb255 126 126 126
|
||||
, textLightOrange = rgb255 204 102 0
|
||||
, textDarkOrange = rgb255 120 60 0
|
||||
, backgroundLightGrey = rgb255 40 40 40
|
||||
, debugColour = rgb255 227 28 121
|
||||
, cardBackground = rgb255 30 30 30
|
||||
, backgroundDarkGrey = rgb255 30 30 30
|
||||
, barGreen = rgb255 0 102 0
|
||||
, barRed = rgb255 102 0 0
|
||||
, transparent = rgba 1 1 1 0
|
||||
|
|
|
@ -14,7 +14,7 @@ topLevelContainer =
|
|||
el
|
||||
[ E.width fill
|
||||
, height fill
|
||||
, B.color colourTheme.backgroundColour
|
||||
, B.color colourTheme.backgroundLightGrey
|
||||
]
|
||||
|
||||
|
||||
|
@ -35,7 +35,7 @@ transitionStyle =
|
|||
transitionHighlightedLinkHover : Element msg -> Element msg
|
||||
transitionHighlightedLinkHover =
|
||||
el
|
||||
[ mouseOver [ F.color colourTheme.highlightTextHover ]
|
||||
[ mouseOver [ F.color colourTheme.textDarkOrange ]
|
||||
, transitionStyle
|
||||
]
|
||||
|
||||
|
@ -43,7 +43,7 @@ transitionHighlightedLinkHover =
|
|||
transitionNonHighlightedLinkHover : Element msg -> Element msg
|
||||
transitionNonHighlightedLinkHover =
|
||||
el
|
||||
[ mouseOver [ F.color colourTheme.highlightText ]
|
||||
[ mouseOver [ F.color colourTheme.textLightOrange ]
|
||||
, transitionStyle
|
||||
]
|
||||
|
||||
|
@ -57,7 +57,7 @@ transitionNonHighlightedLinkHoverWithMove content =
|
|||
(el
|
||||
[ centerX
|
||||
, centerY
|
||||
, mouseOver [ F.color colourTheme.highlightText, F.size 25 ]
|
||||
, mouseOver [ F.color colourTheme.textLightOrange, F.size 25 ]
|
||||
, transitionStyle
|
||||
]
|
||||
content
|
||||
|
@ -84,14 +84,14 @@ titleFormat =
|
|||
|
||||
nonHighlightedTitleFormat : List (Attr () msg)
|
||||
nonHighlightedTitleFormat =
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
[ F.color colourTheme.textLightGrey
|
||||
]
|
||||
++ titleFormat
|
||||
|
||||
|
||||
highlightedTitleFormat : List (Attr () msg)
|
||||
highlightedTitleFormat =
|
||||
[ F.color colourTheme.highlightText
|
||||
[ F.color colourTheme.textLightOrange
|
||||
]
|
||||
++ titleFormat
|
||||
|
||||
|
@ -105,7 +105,7 @@ paragraphLinkFormat : { url : String, label : Element msg } -> Element msg
|
|||
paragraphLinkFormat =
|
||||
newTabLink
|
||||
[ paragraphFontSize
|
||||
, F.color colourTheme.highlightText
|
||||
, F.color colourTheme.textLightOrange
|
||||
]
|
||||
|
||||
|
||||
|
@ -116,7 +116,7 @@ paragraphSpacing =
|
|||
|
||||
paragraphText : List (Attr () msg)
|
||||
paragraphText =
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, paragraphFontSize
|
||||
]
|
||||
|
@ -124,7 +124,7 @@ paragraphText =
|
|||
|
||||
paragraphHightlightedBoldText : List (Attr () msg)
|
||||
paragraphHightlightedBoldText =
|
||||
[ F.color colourTheme.highlightText
|
||||
[ F.color colourTheme.textLightOrange
|
||||
, F.bold
|
||||
, paragraphSpacing
|
||||
, paragraphFontSize
|
||||
|
|
|
@ -23,7 +23,7 @@ barMaker getTooltip num =
|
|||
([ E.height <| px 12
|
||||
, E.width fill
|
||||
, D.rounded 10
|
||||
, D.color colourTheme.nonHighlightedDarkText
|
||||
, D.color colourTheme.textDarkGrey
|
||||
, D.width 2
|
||||
, B.gradient
|
||||
{ angle = 90
|
||||
|
|
|
@ -27,10 +27,10 @@ tooltip content =
|
|||
, F.size 15
|
||||
, F.center
|
||||
, F.regular
|
||||
, B.color colourTheme.backgroundColour
|
||||
, F.color colourTheme.nonHighlightedText
|
||||
, B.color colourTheme.backgroundLightGrey
|
||||
, F.color colourTheme.textLightGrey
|
||||
, padding 15
|
||||
, D.color colourTheme.highlightText
|
||||
, D.color colourTheme.textLightOrange
|
||||
, D.rounded 5
|
||||
, D.width 2
|
||||
, D.shadow
|
||||
|
|
|
@ -195,7 +195,7 @@ circumstanceMaker dodgeEntry =
|
|||
VagueGesture ->
|
||||
"Chose to gesture vaguely instead of engaging"
|
||||
)
|
||||
, text "." |> el [ F.color colourTheme.nonHighlightedText ]
|
||||
, text "." |> el [ F.color colourTheme.textLightGrey ]
|
||||
, row [ alignTop, alignLeft ]
|
||||
(List.indexedMap
|
||||
(\index2 link ->
|
||||
|
@ -212,7 +212,7 @@ circumstanceMaker dodgeEntry =
|
|||
, label =
|
||||
row []
|
||||
[ transitionHighlightedLinkHover <| (text (String.fromInt (index2 + 1)) |> el [ F.size 13 ])
|
||||
, text ", " |> el [ F.color colourTheme.nonHighlightedText ]
|
||||
, text ", " |> el [ F.color colourTheme.textLightGrey ]
|
||||
]
|
||||
}
|
||||
)
|
||||
|
|
|
@ -70,7 +70,7 @@ propositionMaker argument =
|
|||
"A proposition is a declarative statement that can be evaluated as either true or false, and which serves as the basis for debate."
|
||||
]
|
||||
(text "Proposition:")
|
||||
|> el [ F.color colourTheme.highlightText ]
|
||||
|> el [ F.color colourTheme.textLightOrange ]
|
||||
]
|
||||
]
|
||||
, column
|
||||
|
@ -78,7 +78,7 @@ propositionMaker argument =
|
|||
[ paragraph (paragraphBoldFormat ++ [ F.size 18 ])
|
||||
[ text argument.propositionTitle
|
||||
|> el
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, F.regular
|
||||
, F.size 16
|
||||
]
|
||||
|
@ -115,7 +115,7 @@ reductioMaker argument =
|
|||
"This is the position from which the reductio ad absurdum is derived."
|
||||
]
|
||||
(text "Reductio:")
|
||||
|> el [ F.color colourTheme.highlightText ]
|
||||
|> el [ F.color colourTheme.textLightOrange ]
|
||||
]
|
||||
]
|
||||
, column [ E.width fill, E.alignLeft ]
|
||||
|
@ -148,7 +148,7 @@ summaryMaker argument =
|
|||
"The following information provides additional context and insight into the reasoning behind the argument."
|
||||
]
|
||||
(text "Summary:")
|
||||
|> el [ F.color colourTheme.highlightText ]
|
||||
|> el [ F.color colourTheme.textLightOrange ]
|
||||
]
|
||||
]
|
||||
, column
|
||||
|
@ -163,7 +163,7 @@ summaryMaker argument =
|
|||
)
|
||||
[ text argument.propositionSummary
|
||||
|> el
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, F.regular
|
||||
, F.size 16
|
||||
]
|
||||
|
@ -190,7 +190,7 @@ strengthMaker argument =
|
|||
"This represents my confidence in the soundness of the argument."
|
||||
]
|
||||
(text "Confidence:")
|
||||
|> el [ F.color colourTheme.highlightText ]
|
||||
|> el [ F.color colourTheme.textLightOrange ]
|
||||
]
|
||||
]
|
||||
, column
|
||||
|
@ -259,7 +259,7 @@ tableMaker argument =
|
|||
[ spacing 0
|
||||
, D.rounded 10
|
||||
, D.width 2
|
||||
, D.color colourTheme.nonHighlightedDarkText
|
||||
, D.color colourTheme.textDarkGrey
|
||||
, clip
|
||||
]
|
||||
{ data = argument.definitionTable
|
||||
|
@ -273,17 +273,17 @@ tableMaker argument =
|
|||
, left = 1
|
||||
, right = 1
|
||||
}
|
||||
, D.color colourTheme.nonHighlightedDarkText
|
||||
, D.color colourTheme.textDarkGrey
|
||||
, padding 8
|
||||
, E.width fill
|
||||
]
|
||||
(text "Definiendum")
|
||||
|> el [ F.color colourTheme.highlightText ]
|
||||
|> el [ F.color colourTheme.textLightOrange ]
|
||||
, width = fill |> maximum 50
|
||||
, view =
|
||||
\definition ->
|
||||
row
|
||||
[ F.color colourTheme.highlightText
|
||||
[ F.color colourTheme.textLightOrange
|
||||
, F.bold
|
||||
, D.widthEach
|
||||
{ bottom = 1
|
||||
|
@ -291,7 +291,7 @@ tableMaker argument =
|
|||
, left = 1
|
||||
, right = 1
|
||||
}
|
||||
, D.color colourTheme.nonHighlightedDarkText
|
||||
, D.color colourTheme.textDarkGrey
|
||||
, padding 8
|
||||
, E.height fill
|
||||
]
|
||||
|
@ -309,17 +309,17 @@ tableMaker argument =
|
|||
, left = 0
|
||||
, right = 1
|
||||
}
|
||||
, D.color colourTheme.nonHighlightedDarkText
|
||||
, D.color colourTheme.textDarkGrey
|
||||
, padding 8
|
||||
, E.width fill
|
||||
]
|
||||
(text "Definiens")
|
||||
|> el [ F.color colourTheme.highlightText ]
|
||||
|> el [ F.color colourTheme.textLightOrange ]
|
||||
, width = fill
|
||||
, view =
|
||||
\definition ->
|
||||
paragraph
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, F.regular
|
||||
, D.widthEach
|
||||
{ bottom = 1
|
||||
|
@ -327,7 +327,7 @@ tableMaker argument =
|
|||
, left = 0
|
||||
, right = 1
|
||||
}
|
||||
, D.color colourTheme.nonHighlightedDarkText
|
||||
, D.color colourTheme.textDarkGrey
|
||||
, padding 8
|
||||
, E.height fill
|
||||
]
|
||||
|
@ -376,7 +376,7 @@ formalizationMaker argument =
|
|||
[ text ("P" ++ String.fromInt (premiseIndex + 1) ++ ")")
|
||||
, text premiseWithNotation.premise
|
||||
|> el
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, F.regular
|
||||
, paddingEach
|
||||
{ top = 0
|
||||
|
@ -388,7 +388,7 @@ formalizationMaker argument =
|
|||
]
|
||||
, paragraph argumentFormatting
|
||||
[ text ("(" ++ premiseWithNotation.notation ++ ")")
|
||||
|> el [ F.color colourTheme.highlightText, F.bold ]
|
||||
|> el [ F.color colourTheme.textLightOrange, F.bold ]
|
||||
]
|
||||
]
|
||||
)
|
||||
|
@ -398,7 +398,7 @@ formalizationMaker argument =
|
|||
[ text "C)"
|
||||
, text argumentEntry.conclusion
|
||||
|> el
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, F.regular
|
||||
, paddingEach
|
||||
{ top = 0
|
||||
|
@ -411,7 +411,7 @@ formalizationMaker argument =
|
|||
, paragraph argumentFormatting
|
||||
[ text ("(∴" ++ argumentEntry.conclusionNotation ++ ")")
|
||||
|> el
|
||||
[ F.color colourTheme.highlightText
|
||||
[ F.color colourTheme.textLightOrange
|
||||
, F.bold
|
||||
]
|
||||
]
|
||||
|
@ -438,8 +438,8 @@ proofTreeMaker argument =
|
|||
[ newTabLink
|
||||
(paragraphBoldFormat
|
||||
++ [ F.size 18
|
||||
, F.color colourTheme.nonHighlightedText
|
||||
, B.color colourTheme.highlightTextHover
|
||||
, F.color colourTheme.textLightGrey
|
||||
, B.color colourTheme.textDarkOrange
|
||||
, paddingEach
|
||||
{ top = 6
|
||||
, bottom = 2
|
||||
|
@ -452,9 +452,9 @@ proofTreeMaker argument =
|
|||
, E.alignRight
|
||||
, transitionStyle
|
||||
, mouseOver
|
||||
[ B.color colourTheme.highlightTextHover
|
||||
, F.color colourTheme.nonHighlightedText
|
||||
, D.color colourTheme.highlightTextHover
|
||||
[ B.color colourTheme.textDarkOrange
|
||||
, F.color colourTheme.textLightGrey
|
||||
, D.color colourTheme.textDarkOrange
|
||||
]
|
||||
]
|
||||
)
|
||||
|
|
|
@ -142,8 +142,8 @@ episodeMaker appearanceEntry =
|
|||
]
|
||||
[ text ("#" ++ appearanceEntry.appearanceEpisode ++ ": " ++ appearanceEntry.appearanceTitle)
|
||||
|> el
|
||||
[ F.color colourTheme.highlightText
|
||||
, mouseOver [ F.color colourTheme.highlightTextHover ]
|
||||
[ F.color colourTheme.textLightOrange
|
||||
, mouseOver [ F.color colourTheme.textDarkOrange ]
|
||||
, transitionStyle
|
||||
]
|
||||
]
|
||||
|
|
|
@ -81,7 +81,7 @@ view { toContentMsg, model, content } =
|
|||
row
|
||||
[ E.width fill
|
||||
, height fill
|
||||
, B.color colourTheme.cardBackground
|
||||
, B.color colourTheme.backgroundDarkGrey
|
||||
]
|
||||
[ column
|
||||
[ htmlAttribute (H.style "position" "fixed")
|
||||
|
@ -91,12 +91,12 @@ view { toContentMsg, model, content } =
|
|||
, htmlAttribute (H.style "z-index" "10") -- Ensure navbar stays on top
|
||||
, htmlAttribute (H.style "transform-style" "preserve-3d")
|
||||
, D.widthEach { top = 0, bottom = 0, left = 0, right = 3 }
|
||||
, D.color colourTheme.highlightTextHover
|
||||
, D.color colourTheme.textDarkOrange
|
||||
]
|
||||
[ column
|
||||
[ alignLeft
|
||||
, height fill
|
||||
, F.color colourTheme.nonHighlightedText
|
||||
, F.color colourTheme.textLightGrey
|
||||
]
|
||||
[ column
|
||||
[ centerX
|
||||
|
@ -138,7 +138,7 @@ view { toContentMsg, model, content } =
|
|||
, left = 0
|
||||
, right = 0
|
||||
}
|
||||
, D.color colourTheme.nonHighlightedDarkText
|
||||
, D.color colourTheme.textDarkGrey
|
||||
]
|
||||
none
|
||||
]
|
||||
|
@ -146,7 +146,7 @@ view { toContentMsg, model, content } =
|
|||
[ padding 20, alignTop, alignLeft ]
|
||||
[ column
|
||||
[ F.bold
|
||||
, F.color colourTheme.nonHighlightedText
|
||||
, F.color colourTheme.textLightGrey
|
||||
, F.size 17
|
||||
, spacing 8
|
||||
]
|
||||
|
@ -249,7 +249,7 @@ buttonMaker name =
|
|||
{ url = localhostUrl ++ String.toLower name
|
||||
, label =
|
||||
el
|
||||
[ mouseOver [ F.color colourTheme.highlightText ]
|
||||
[ mouseOver [ F.color colourTheme.textLightOrange ]
|
||||
, htmlAttribute <| style "transition" "all 0.1s ease-in-out"
|
||||
]
|
||||
<|
|
||||
|
|
|
@ -76,7 +76,7 @@ rateMaker service =
|
|||
, alignLeft
|
||||
]
|
||||
[ paragraph [ F.regular ]
|
||||
[ el [ F.color colourTheme.highlightText ] <|
|
||||
[ el [ F.color colourTheme.textLightOrange ] <|
|
||||
text service.serviceRate
|
||||
]
|
||||
]
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue