mirror of
https://gitlab.com/upRootNutrition/website.git
synced 2025-06-16 20:35:13 -05:00
feat: refactored some stuff
This commit is contained in:
Nick
parent
5e25267fbe
commit
ed73a38cbe
6 changed files with 380 additions and 141 deletions
|
|
@ -4,6 +4,7 @@ import Config.CardFormat exposing (..)
|
|||
import Config.Colour as T exposing (..)
|
||||
import Config.Format as O exposing (..)
|
||||
import Config.StrengthBar exposing (..)
|
||||
import Config.ToolTip exposing (..)
|
||||
import Debate.Types exposing (..)
|
||||
import Effect exposing (Effect)
|
||||
import Element as E exposing (..)
|
||||
|
|
@ -64,11 +65,25 @@ propositionMaker argument =
|
|||
[ column
|
||||
[ E.alignTop, E.alignLeft ]
|
||||
[ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
|
||||
[ el [ tooltip below (myTooltip "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
|
||||
[ tooltip
|
||||
"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 ]
|
||||
]
|
||||
]
|
||||
, column
|
||||
[ E.width fill, E.alignLeft ]
|
||||
[ paragraph (paragraphBoldFormat ++ [ F.size 18 ]) [ text argument.propositionTitle |> el [ F.color colourTheme.nonHighlightedText, F.regular, F.size 16 ] ] ]
|
||||
[ paragraph (paragraphBoldFormat ++ [ F.size 18 ])
|
||||
[ text argument.propositionTitle
|
||||
|> el
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
, F.regular
|
||||
, F.size 16
|
||||
]
|
||||
]
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
|
|
@ -79,15 +94,37 @@ reductioMaker argument =
|
|||
none
|
||||
|
||||
reductio ->
|
||||
row [ paddingEach { top = 10, right = 0, bottom = 0, left = 0 } ]
|
||||
row
|
||||
[ paddingEach
|
||||
{ top = 10
|
||||
, right = 0
|
||||
, bottom = 0
|
||||
, left = 0
|
||||
}
|
||||
]
|
||||
[ column
|
||||
[ E.alignTop, E.alignLeft ]
|
||||
[ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
|
||||
[ el [ tooltip below (myTooltip "This is the position from which the reductio ad absurdum is derived.") ] (text "Reductio:") |> el [ F.color colourTheme.highlightText ]
|
||||
[ paragraph
|
||||
(paragraphBoldFormat
|
||||
++ [ F.size 18
|
||||
, E.width <| px 100
|
||||
]
|
||||
)
|
||||
[ el
|
||||
[ tooltip
|
||||
"This is the position from which the reductio ad absurdum is derived."
|
||||
]
|
||||
(text "Reductio:")
|
||||
|> el [ F.color colourTheme.highlightText ]
|
||||
]
|
||||
]
|
||||
, column [ E.width fill, E.alignLeft ]
|
||||
[ paragraph (paragraphFormat ++ [ F.size 18, spacing 3 ])
|
||||
[ paragraph
|
||||
(paragraphFormat
|
||||
++ [ F.size 18
|
||||
, spacing 3
|
||||
]
|
||||
)
|
||||
[ text reductio ]
|
||||
]
|
||||
]
|
||||
|
|
@ -97,14 +134,41 @@ summaryMaker : Argument -> Element msg
|
|||
summaryMaker argument =
|
||||
row []
|
||||
[ column
|
||||
[ E.alignTop, E.alignLeft ]
|
||||
[ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
|
||||
[ el [ tooltip below (myTooltip "The following information provides additional context and insight into the reasoning behind the argument") ] (text "Summary:") |> el [ F.color colourTheme.highlightText ]
|
||||
[ E.alignTop
|
||||
, E.alignLeft
|
||||
]
|
||||
[ paragraph
|
||||
(paragraphBoldFormat
|
||||
++ [ F.size 18
|
||||
, E.width <| px 100
|
||||
]
|
||||
)
|
||||
[ el
|
||||
[ tooltip
|
||||
"The following information provides additional context and insight into the reasoning behind the argument."
|
||||
]
|
||||
(text "Summary:")
|
||||
|> el [ F.color colourTheme.highlightText ]
|
||||
]
|
||||
]
|
||||
, column
|
||||
[ E.width fill, E.alignLeft ]
|
||||
[ paragraph (paragraphBoldFormat ++ [ F.size 18, spacing 3 ]) [ text argument.propositionSummary |> el [ F.color colourTheme.nonHighlightedText, F.regular, F.size 16 ] ] ]
|
||||
[ E.width fill
|
||||
, E.alignLeft
|
||||
]
|
||||
[ paragraph
|
||||
(paragraphBoldFormat
|
||||
++ [ F.size 18
|
||||
, spacing 3
|
||||
]
|
||||
)
|
||||
[ text argument.propositionSummary
|
||||
|> el
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
, F.regular
|
||||
, F.size 16
|
||||
]
|
||||
]
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
|
|
@ -112,12 +176,28 @@ strengthMaker : Argument -> Element msg
|
|||
strengthMaker argument =
|
||||
row [ E.width fill ]
|
||||
[ column
|
||||
[ E.alignTop, E.alignLeft ]
|
||||
[ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
|
||||
[ el [ tooltip below (myTooltip "This represents my confidence in the soundness of the argument.") ] (text "Confidence:") |> el [ F.color colourTheme.highlightText ] ]
|
||||
[ E.alignTop
|
||||
, E.alignLeft
|
||||
]
|
||||
[ paragraph
|
||||
(paragraphBoldFormat
|
||||
++ [ F.size 18
|
||||
, E.width <| px 100
|
||||
]
|
||||
)
|
||||
[ el
|
||||
[ tooltip
|
||||
"This represents my confidence in the soundness of the argument."
|
||||
]
|
||||
(text "Confidence:")
|
||||
|> el [ F.color colourTheme.highlightText ]
|
||||
]
|
||||
]
|
||||
, column
|
||||
[ E.width fill, E.alignLeft, centerY ]
|
||||
[ E.width fill
|
||||
, E.alignLeft
|
||||
, centerY
|
||||
]
|
||||
[ barMaker getConfidenceTooltip argument.argumentCertainty ]
|
||||
]
|
||||
|
||||
|
|
@ -164,50 +244,17 @@ getConfidenceTooltip num =
|
|||
|
||||
tableMaker : Argument -> Element msg
|
||||
tableMaker argument =
|
||||
let
|
||||
formalizationMaker : List (Element msg)
|
||||
formalizationMaker =
|
||||
let
|
||||
argumentFormatting : List (Attribute msg)
|
||||
argumentFormatting =
|
||||
[ centerX, F.center, spacing 3 ]
|
||||
in
|
||||
List.indexedMap
|
||||
(\index argumentEntry ->
|
||||
column (paragraphFormat ++ [ spacing 3, centerX, E.width <| px 500, paddingEach { top = 10, right = 0, bottom = 0, left = 0 } ])
|
||||
(List.indexedMap
|
||||
(\premiseIndex premiseWithNotation ->
|
||||
column argumentFormatting
|
||||
[ paragraph paragraphHightlightedBoldText
|
||||
[ text ("P" ++ String.fromInt (premiseIndex + 1) ++ ")")
|
||||
, text premiseWithNotation.premise
|
||||
|> el [ F.color colourTheme.nonHighlightedText, F.regular, paddingEach { top = 0, right = 0, bottom = 0, left = 5 } ]
|
||||
]
|
||||
, paragraph argumentFormatting
|
||||
[ text ("(" ++ premiseWithNotation.notation ++ ")")
|
||||
|> el [ F.color colourTheme.highlightText, F.bold ]
|
||||
]
|
||||
]
|
||||
)
|
||||
argumentEntry.premises
|
||||
++ [ column argumentFormatting
|
||||
[ paragraph paragraphHightlightedBoldText
|
||||
[ text "C)"
|
||||
, text argumentEntry.conclusion
|
||||
|> el [ F.color colourTheme.nonHighlightedText, F.regular, paddingEach { top = 0, right = 0, bottom = 0, left = 5 } ]
|
||||
]
|
||||
, paragraph argumentFormatting
|
||||
[ text ("(∴" ++ argumentEntry.conclusionNotation ++ ")")
|
||||
|> el [ F.color colourTheme.highlightText, F.bold ]
|
||||
]
|
||||
]
|
||||
]
|
||||
)
|
||||
)
|
||||
argument.argumentFormalization
|
||||
in
|
||||
column [ centerX, E.width <| px 600 ]
|
||||
[ wrappedRow (paragraphBoldFormat ++ [ E.alignLeft, E.width fill ])
|
||||
column
|
||||
[ centerX
|
||||
, E.width <| px 600
|
||||
]
|
||||
([ wrappedRow
|
||||
(paragraphBoldFormat
|
||||
++ [ E.alignLeft
|
||||
, E.width fill
|
||||
, htmlAttribute <| H.style "position" "relative"
|
||||
]
|
||||
)
|
||||
[ E.table
|
||||
[ spacing 0
|
||||
, D.rounded 10
|
||||
|
|
@ -220,18 +267,30 @@ tableMaker argument =
|
|||
[ { header =
|
||||
el
|
||||
[ F.bold
|
||||
, D.widthEach { bottom = 1, top = 1, left = 1, right = 1 }
|
||||
, D.widthEach
|
||||
{ bottom = 1
|
||||
, top = 1
|
||||
, left = 1
|
||||
, right = 1
|
||||
}
|
||||
, D.color colourTheme.nonHighlightedDarkText
|
||||
, padding 8
|
||||
, E.width fill
|
||||
]
|
||||
(text "Definiendum" |> el [ F.color colourTheme.highlightText ])
|
||||
(text "Definiendum")
|
||||
|> el [ F.color colourTheme.highlightText ]
|
||||
, width = fill |> maximum 50
|
||||
, view =
|
||||
\definition ->
|
||||
row
|
||||
[ F.color colourTheme.highlightText
|
||||
, F.bold
|
||||
, D.widthEach { bottom = 1, top = 0, left = 1, right = 1 }
|
||||
, D.widthEach
|
||||
{ bottom = 1
|
||||
, top = 0
|
||||
, left = 1
|
||||
, right = 1
|
||||
}
|
||||
, D.color colourTheme.nonHighlightedDarkText
|
||||
, padding 8
|
||||
, E.height fill
|
||||
|
|
@ -244,18 +303,30 @@ tableMaker argument =
|
|||
, { header =
|
||||
el
|
||||
[ F.bold
|
||||
, D.widthEach { bottom = 1, top = 1, left = 0, right = 1 }
|
||||
, D.widthEach
|
||||
{ bottom = 1
|
||||
, top = 1
|
||||
, left = 0
|
||||
, right = 1
|
||||
}
|
||||
, D.color colourTheme.nonHighlightedDarkText
|
||||
, padding 8
|
||||
, E.width fill
|
||||
]
|
||||
(text "Definiens" |> el [ F.color colourTheme.highlightText ])
|
||||
(text "Definiens")
|
||||
|> el [ F.color colourTheme.highlightText ]
|
||||
, width = fill
|
||||
, view =
|
||||
\definition ->
|
||||
paragraph
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
, F.regular
|
||||
, D.widthEach { bottom = 1, top = 0, left = 0, right = 1 }
|
||||
, D.widthEach
|
||||
{ bottom = 1
|
||||
, top = 0
|
||||
, left = 0
|
||||
, right = 1
|
||||
}
|
||||
, D.color colourTheme.nonHighlightedDarkText
|
||||
, padding 8
|
||||
, E.height fill
|
||||
|
|
@ -268,20 +339,113 @@ tableMaker argument =
|
|||
]
|
||||
}
|
||||
]
|
||||
, column [ centerX ] formalizationMaker
|
||||
]
|
||||
]
|
||||
++ formalizationMaker argument
|
||||
)
|
||||
|
||||
|
||||
formalizationMaker : Argument -> List (Element msg)
|
||||
formalizationMaker argument =
|
||||
let
|
||||
argumentFormatting : List (Attribute msg)
|
||||
argumentFormatting =
|
||||
[ centerX
|
||||
, F.center
|
||||
, spacing 3
|
||||
]
|
||||
in
|
||||
List.indexedMap
|
||||
(\index argumentEntry ->
|
||||
column
|
||||
(paragraphFormat
|
||||
++ [ spacing 3
|
||||
, centerX
|
||||
, E.width <| px 500
|
||||
, paddingEach
|
||||
{ top = 10
|
||||
, right = 0
|
||||
, bottom = 0
|
||||
, left = 0
|
||||
}
|
||||
]
|
||||
)
|
||||
(List.indexedMap
|
||||
(\premiseIndex premiseWithNotation ->
|
||||
column argumentFormatting
|
||||
[ paragraph paragraphHightlightedBoldText
|
||||
[ text ("P" ++ String.fromInt (premiseIndex + 1) ++ ")")
|
||||
, text premiseWithNotation.premise
|
||||
|> el
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
, F.regular
|
||||
, paddingEach
|
||||
{ top = 0
|
||||
, right = 0
|
||||
, bottom = 0
|
||||
, left = 5
|
||||
}
|
||||
]
|
||||
]
|
||||
, paragraph argumentFormatting
|
||||
[ text ("(" ++ premiseWithNotation.notation ++ ")")
|
||||
|> el [ F.color colourTheme.highlightText, F.bold ]
|
||||
]
|
||||
]
|
||||
)
|
||||
argumentEntry.premises
|
||||
++ [ column argumentFormatting
|
||||
[ paragraph paragraphHightlightedBoldText
|
||||
[ text "C)"
|
||||
, text argumentEntry.conclusion
|
||||
|> el
|
||||
[ F.color colourTheme.nonHighlightedText
|
||||
, F.regular
|
||||
, paddingEach
|
||||
{ top = 0
|
||||
, right = 0
|
||||
, bottom = 0
|
||||
, left = 5
|
||||
}
|
||||
]
|
||||
]
|
||||
, paragraph argumentFormatting
|
||||
[ text ("(∴" ++ argumentEntry.conclusionNotation ++ ")")
|
||||
|> el
|
||||
[ F.color colourTheme.highlightText
|
||||
, F.bold
|
||||
]
|
||||
]
|
||||
]
|
||||
]
|
||||
)
|
||||
)
|
||||
argument.argumentFormalization
|
||||
|
||||
|
||||
proofTreeMaker : Argument -> Element msg
|
||||
proofTreeMaker argument =
|
||||
row [ paddingEach { top = 10, right = 0, bottom = 10, left = 0 }, centerX, E.width fill ]
|
||||
row
|
||||
[ paddingEach
|
||||
{ top = 10
|
||||
, right = 0
|
||||
, bottom = 10
|
||||
, left = 0
|
||||
}
|
||||
, centerX
|
||||
, E.width fill
|
||||
]
|
||||
[ column [ E.alignRight ]
|
||||
[ newTabLink
|
||||
(paragraphBoldFormat
|
||||
++ [ F.size 18
|
||||
, F.color colourTheme.nonHighlightedText
|
||||
, B.color colourTheme.highlightTextHover
|
||||
, paddingEach { top = 6, bottom = 2, left = 12, right = 12 }
|
||||
, paddingEach
|
||||
{ top = 6
|
||||
, bottom = 2
|
||||
, left = 12
|
||||
, right = 12
|
||||
}
|
||||
, D.rounded 10
|
||||
, E.width <| px 105
|
||||
, F.center
|
||||
|
|
@ -305,8 +469,18 @@ basicDivider =
|
|||
el
|
||||
[ E.width fill
|
||||
, centerX
|
||||
, D.widthEach { bottom = 1, top = 0, left = 0, right = 0 }
|
||||
, D.widthEach
|
||||
{ bottom = 1
|
||||
, top = 0
|
||||
, left = 0
|
||||
, right = 0
|
||||
}
|
||||
, D.color (rgb255 200 200 200)
|
||||
, paddingEach { top = 40, bottom = 0, left = 0, right = 0 }
|
||||
, paddingEach
|
||||
{ top = 40
|
||||
, bottom = 0
|
||||
, left = 0
|
||||
, right = 0
|
||||
}
|
||||
]
|
||||
none
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue