feat: refactored and added some stuff

This commit is contained in:
Nick 2024-12-12 22:48:20 -06:00
parent 7b8faede8d
commit 9f1a7fe872
17 changed files with 798 additions and 707 deletions

View file

@ -126,7 +126,9 @@ serviceMaker =
[ cardSubTitleMaker
[ column
bodyFormat
[ chunkMaker servicesDebateAnalysis.serviceArticle.articleParagraph
[ chunkMaker servicesDebateAnalysis.serviceArticle.articleParagraph.paragraph1
, chunkMaker
servicesDebateAnalysis.serviceArticle.articleParagraph.paragraph2
, titleMaker servicesDebateAnalysis.serviceArticle.articleTitles.title1
-- , highlightedBlockMaker

View file

@ -130,7 +130,8 @@ serviceMaker =
[ cardSubTitleMaker
[ column
bodyFormat
[ chunkMaker servicesDebateCoaching.serviceArticle.articleParagraph
[ chunkMaker servicesDebateCoaching.serviceArticle.articleParagraph.paragraph1
, chunkMaker servicesDebateCoaching.serviceArticle.articleParagraph.paragraph2
, titleMaker servicesDebateCoaching.serviceArticle.articleTitles.title1
, numberMaker servicesDebateCoaching.serviceArticle.articleListEntries.list1
, titleMaker servicesDebateCoaching.serviceArticle.articleTitles.title2
@ -141,6 +142,7 @@ serviceMaker =
, highlightedBlockMaker servicesDebateCoaching.serviceArticle.articleTitles.title5 servicesDebateCoaching.serviceArticle.articleListEntries.list5
, highlightedBlockMaker servicesDebateCoaching.serviceArticle.articleTitles.title6 servicesDebateCoaching.serviceArticle.articleListEntries.list6
, highlightedBlockMaker servicesDebateCoaching.serviceArticle.articleTitles.title7 servicesDebateCoaching.serviceArticle.articleListEntries.list7
, highlightedBlockMaker servicesDebateCoaching.serviceArticle.articleTitles.title8 servicesDebateCoaching.serviceArticle.articleListEntries.list8
]
]
]

View file

@ -11,7 +11,7 @@ import Config.Helpers.Response
import Config.Helpers.ToolTip exposing (..)
import Config.Pages.Headers.Types exposing (..)
import Config.Pages.Services.Services.ElmBuilds exposing (servicesElmBuilds)
import Config.Style.Colour exposing (colourTheme)
import Config.Style.Colour exposing (..)
import Config.Style.Transitions
exposing
( hoverFontDarkOrange
@ -130,11 +130,15 @@ serviceMaker =
[ cardSubTitleMaker
[ column
bodyFormat
[-- chunkMaker
-- , titleMaker
-- , highlightedBlockMaker
-- , bulletPointMaker
-- , numberMaker
[ chunkMaker servicesElmBuilds.serviceArticle.articleParagraph.paragraph1
, chunkMaker servicesElmBuilds.serviceArticle.articleParagraph.paragraph2
, chunkMaker servicesElmBuilds.serviceArticle.articleParagraph.paragraph3
, titleMaker servicesElmBuilds.serviceArticle.articleTitles.title1
, numberMaker servicesElmBuilds.serviceArticle.articleListEntries.list1
, titleMaker servicesElmBuilds.serviceArticle.articleTitles.title2
, bulletPointMaker servicesElmBuilds.serviceArticle.articleListEntries.list2
, titleMaker servicesElmBuilds.serviceArticle.articleTitles.title3
, elmCodeRenderer
]
]
]
@ -142,3 +146,263 @@ serviceMaker =
]
]
]
elmCodeRenderer : Element msg
elmCodeRenderer =
el
[ paddingEach
{ top = 15
, bottom = 15
, left = 20
, right = 20
}
, B.color colourTheme.backgroundLightGrey
, D.rounded 10
, width fill
, spacing 8
]
<|
column
[ F.size 14
, spacing 5
, width fill
]
[ renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 0 0 ]
, text "barMaker"
|> el [ F.color syntaxTheme.key ]
, text " : "
|> el [ F.color syntaxTheme.operator ]
, text "("
|> el [ F.color syntaxTheme.punctuation ]
, text "Int"
|> el [ F.color syntaxTheme.keyword ]
, text " -> "
|> el [ F.color syntaxTheme.operator ]
, text "String"
|> el [ F.color syntaxTheme.keyword ]
, text ")"
|> el [ F.color syntaxTheme.punctuation ]
, text " -> "
|> el [ F.color syntaxTheme.operator ]
, text "Int"
|> el [ F.color syntaxTheme.keyword ]
, text " -> "
|> el [ F.color syntaxTheme.operator ]
, text "Element"
|> el [ F.color syntaxTheme.keyword ]
, text " msg"
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 0 0 ]
, text "barMaker"
|> el [ F.color syntaxTheme.key ]
, text " getToolTip"
, text " num"
, text " ="
|> el [ F.color syntaxTheme.operator ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 16 0 ]
, text "el"
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 28 0 ]
, text "("
|> el [ F.color syntaxTheme.punctuation ]
, text "["
|> el [ F.color syntaxTheme.punctuation ]
, text " Element"
|> el [ F.color syntaxTheme.keyword ]
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "height"
, text " <| "
|> el [ F.color syntaxTheme.operator ]
, text "px"
, text " 12"
|> el [ F.color syntaxTheme.string ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 32 0 ]
, text ","
|> el [ F.color syntaxTheme.punctuation ]
, text " Element"
|> el [ F.color syntaxTheme.keyword ]
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "width"
, text " fill"
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 32 0 ]
, text ","
|> el [ F.color syntaxTheme.punctuation ]
, text " Border"
|> el [ F.color syntaxTheme.keyword ]
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "rounded"
, text " 10"
|> el [ F.color syntaxTheme.string ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 32 0 ]
, text ","
|> el [ F.color syntaxTheme.punctuation ]
, text " Border"
|> el [ F.color syntaxTheme.keyword ]
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "color"
, text " colourTheme"
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "textDarkGrey"
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 32 0 ]
, text ","
|> el [ F.color syntaxTheme.punctuation ]
, text " Border"
|> el [ F.color syntaxTheme.keyword ]
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "width"
, text " 2"
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 32 0 ]
, text ","
|> el [ F.color syntaxTheme.punctuation ]
, text " Background"
|> el [ F.color syntaxTheme.keyword ]
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "gradient"
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 48 0 ]
, text "{"
|> el [ F.color syntaxTheme.punctuation ]
, text " angle"
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "1.57"
|> el [ F.color syntaxTheme.string ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 48 0 ]
, text ","
|> el [ F.color syntaxTheme.punctuation ]
, text " steps"
, text " = "
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 56 0 ]
, text "List"
|> el [ F.color syntaxTheme.keyword ]
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "concat"
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 62 0 ]
, text "[ "
|> el [ F.color syntaxTheme.punctuation ]
, text "List"
|> el [ F.color syntaxTheme.keyword ]
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "repeat"
, text " num "
, text "colourTheme"
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "barGreen"
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 62 0 ]
, text ", "
|> el [ F.color syntaxTheme.punctuation ]
, text "List"
|> el [ F.color syntaxTheme.keyword ]
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "repeat"
, text " ("
|> el [ F.color syntaxTheme.punctuation ]
, text "10"
|> el [ F.color syntaxTheme.string ]
, text " - "
|> el [ F.color syntaxTheme.operator ]
, text "num"
, text " )"
|> el [ F.color syntaxTheme.punctuation ]
, text " colourTheme"
, text "."
|> el [ F.color syntaxTheme.punctuation ]
, text "barRed"
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 62 0 ]
, text "]"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 48 0 ]
, text "}"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 40 0 ]
, text "]"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 48 0 ]
, text "++"
|> el [ F.color syntaxTheme.operator ]
, text " [ "
|> el [ F.color syntaxTheme.punctuation ]
, text "tooltip"
, text " ("
|> el [ F.color syntaxTheme.punctuation ]
, text "getToolTip"
, text " num"
, text ")"
|> el [ F.color syntaxTheme.punctuation ]
, text " ]"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 28 0 ]
, text ")"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 28 0 ]
, text "none"
]
]

View file

@ -11,7 +11,7 @@ import Config.Helpers.Response
import Config.Helpers.ToolTip exposing (..)
import Config.Pages.Headers.Types exposing (..)
import Config.Pages.Services.Services.NixBuilds exposing (servicesNixBuilds)
import Config.Style.Colour exposing (colourTheme)
import Config.Style.Colour exposing (..)
import Config.Style.Transitions
exposing
( hoverFontDarkOrange
@ -50,7 +50,6 @@ toLayout model =
-- INIT
@ -131,11 +130,14 @@ serviceMaker =
[ cardSubTitleMaker
[ column
bodyFormat
[-- chunkMaker
-- , titleMaker
-- , highlightedBlockMaker
-- , bulletPointMaker
-- , numberMaker
[ chunkMaker servicesNixBuilds.serviceArticle.articleParagraph.paragraph1
, chunkMaker servicesNixBuilds.serviceArticle.articleParagraph.paragraph2
, titleMaker servicesNixBuilds.serviceArticle.articleTitles.title1
, numberMaker servicesNixBuilds.serviceArticle.articleListEntries.list1
, titleMaker servicesNixBuilds.serviceArticle.articleTitles.title2
, bulletPointMaker servicesNixBuilds.serviceArticle.articleListEntries.list2
, titleMaker servicesNixBuilds.serviceArticle.articleTitles.title3
, nixCodeRenderer
]
]
]
@ -143,3 +145,332 @@ serviceMaker =
]
]
]
renderCodeLine : SyntaxColors -> List (Element msg) -> Element msg
renderCodeLine colors elements =
paragraph
[ F.color colors.text
, F.alignLeft
, F.family
[ F.monospace ]
]
elements
nixCodeRenderer : Element msg
nixCodeRenderer =
el
[ paddingEach
{ top = 15
, bottom = 15
, left = 20
, right = 20
}
, B.color colourTheme.backgroundLightGrey
, D.rounded 10
, width fill
, spacing 8
]
<|
column
[ F.size 14
, spacing 5
, width fill
]
[ renderCodeLine syntaxTheme
[ text "{"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 8 0 ]
, text "description"
|> el [ F.color syntaxTheme.key ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "\"Elm Environment\""
|> el [ F.color syntaxTheme.string ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 8 0 ]
, text "inputs"
|> el [ F.color syntaxTheme.key ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "{"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 16 0 ]
, text "nixpkgs.url"
|> el [ F.color syntaxTheme.key ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "\"github:NixOS/nixpkgs/nixos-unstable\""
|> el [ F.color syntaxTheme.string ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 16 0 ]
, text "nixpkgs-stable.url"
|> el [ F.color syntaxTheme.key ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "\"github:NixOS/nixpkgs/nixos-23.11\""
|> el [ F.color syntaxTheme.string ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 16 0 ]
, text "haskell-flake.url"
|> el [ F.color syntaxTheme.key ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "\"github:srid/haskell-flake\""
|> el [ F.color syntaxTheme.string ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 8 0 ]
, text "}"
|> el [ F.color syntaxTheme.punctuation ]
, text ";"
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 8 0 ]
, text "outputs"
|> el [ F.color syntaxTheme.key ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "inputs"
|> el [ F.color syntaxTheme.keyword ]
, text " @ "
|> el [ F.color syntaxTheme.operator ]
, text "{"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 16 0 ]
, text "flake-parts"
|> el [ F.color syntaxTheme.keyword ]
, text ","
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 16 0 ]
, text "self"
|> el [ F.color syntaxTheme.keyword ]
, text ","
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 16 0 ]
, text "..."
|> el [ F.color syntaxTheme.operator ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 8 0 ]
, text "}"
|> el [ F.color syntaxTheme.punctuation ]
, text ": "
|> el [ F.color syntaxTheme.operator ]
, text "let"
|> el [ F.color syntaxTheme.keyword ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 16 0 ]
, text "system"
|> el [ F.color syntaxTheme.keyword ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "\"x86_64-linux\""
|> el [ F.color syntaxTheme.string ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 8 0 ]
, text "in"
|> el [ F.color syntaxTheme.keyword ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 16 0 ]
, text "flake-parts.lib.mkFlake"
|> el [ F.color syntaxTheme.keyword ]
, text " { "
|> el [ F.color syntaxTheme.punctuation ]
, text "inherit inputs"
|> el [ F.color syntaxTheme.keyword ]
, text " } "
|> el [ F.color syntaxTheme.punctuation ]
, text "{"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 24 0 ]
, text "imports"
|> el [ F.color syntaxTheme.key ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "["
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 32 0 ]
, text "./parts"
|> el [ F.color syntaxTheme.string ]
, text ","
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 32 0 ]
, text "inputs.haskell-flake.flakeModule"
|> el [ F.color syntaxTheme.keyword ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 24 0 ]
, text "]"
|> el [ F.color syntaxTheme.punctuation ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 24 0 ]
, text "systems"
|> el [ F.color syntaxTheme.key ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "[ "
|> el [ F.color syntaxTheme.punctuation ]
, text "system"
|> el [ F.color syntaxTheme.keyword ]
, text " ]"
|> el [ F.color syntaxTheme.punctuation ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 24 0 ]
, text "perSystem"
|> el [ F.color syntaxTheme.key ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "{ "
|> el [ F.color syntaxTheme.punctuation ]
, text "pkgs"
|> el [ F.color syntaxTheme.keyword ]
, text ", ... "
|> el [ F.color syntaxTheme.operator ]
, text "} "
|> el [ F.color syntaxTheme.punctuation ]
, text ": "
|> el [ F.color syntaxTheme.operator ]
, text "{"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 32 0 ]
, text "_module.args.pkgs"
|> el [ F.color syntaxTheme.key ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "import"
|> el [ F.color syntaxTheme.keyword ]
, text " inputs.nixpkgs "
|> el [ F.color syntaxTheme.keyword ]
, text "{ "
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 40 0 ]
, text "inherit system"
|> el [ F.color syntaxTheme.key ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 32 0 ]
, text "}"
|> el [ F.color syntaxTheme.punctuation ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 32 0 ]
, text "_module.args.pkgs-stable"
|> el [ F.color syntaxTheme.key ]
, text " = "
|> el [ F.color syntaxTheme.operator ]
, text "import"
|> el [ F.color syntaxTheme.keyword ]
, text " inputs.nixpkgs-stable "
|> el [ F.color syntaxTheme.keyword ]
, text "{ "
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 40 0 ]
, text "inherit system"
|> el [ F.color syntaxTheme.key ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 32 0 ]
, text "}"
|> el [ F.color syntaxTheme.punctuation ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 24 0 ]
, text "}"
|> el [ F.color syntaxTheme.punctuation ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text ""
|> el [ paddingXY 16 0 ]
, text "}"
|> el [ F.color syntaxTheme.punctuation ]
, text ";"
|> el [ F.color syntaxTheme.punctuation ]
]
, renderCodeLine syntaxTheme
[ text "}"
|> el [ F.color syntaxTheme.punctuation ]
]
]

View file

@ -130,11 +130,14 @@ serviceMaker =
[ cardSubTitleMaker
[ column
bodyFormat
[-- chunkMaker
-- , titleMaker
-- , highlightedBlockMaker
-- , bulletPointMaker
-- , numberMaker
[ chunkMaker servicesNutritionScience.serviceArticle.articleParagraph.paragraph1
, chunkMaker servicesNutritionScience.serviceArticle.articleParagraph.paragraph2
, titleMaker servicesNutritionScience.serviceArticle.articleTitles.title1
-- , highlightedBlockMaker
, numberMaker servicesNutritionScience.serviceArticle.articleListEntries.list1
, titleMaker servicesNutritionScience.serviceArticle.articleTitles.title2
, bulletPointMaker servicesNutritionScience.serviceArticle.articleListEntries.list2
]
]
]