paul/jon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Restyle calculator

Browse Source
This commit is contained in:
Paul Brinkmeier 2023-08-20 20:24:16 +02:00
parent dd7288d1c2
commit de427689f4
3 changed files with 130 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
frontend/Calculator.elm
View File

@ -53,38 +53,50 @@ view model taxGroup =
let
mainPart =
[ text "("
, input
[ class "formula-input", placeholder "Gebindepreis"
, value <| NumberInput.show model.bundlePrice
, onInput SetBundlePrice
, div [ class "form-input --inline" ]
[ label [ for "bundle-price" ] [ text "Gebindepreis" ]
, input
[ placeholder "Gebindepreis"
, value <| NumberInput.show model.bundlePrice
, onInput SetBundlePrice
, id "bundle-price"
, type_ "number"
, step "0.01"
]
[]
]
[]
, text " ÷ "
, input
[ class "formula-input", placeholder "Gebindegröße"
, value <| NumberInput.show model.bundleSize
, onInput SetBundleSize
, div [ class "form-input --inline" ]
[ label [ for "bundle-size" ] [ text "Gebindegröße" ]
, input
[ placeholder "Gebindegröße"
, value <| NumberInput.show model.bundleSize
, onInput SetBundleSize
, id "bundle-size"
, type_ "number"
, step "1"
]
[]
]
[]
, text ") "
]
taxPart =
[ text " ÷ "
, input
[ class "formula-input"
, disabled True
, value <| String.fromFloat <| 1 + taxGroup.percentage
, div [ class "form-input --inline" ]
[ label [ for "tax" ] [ text "Steuer" ]
, input
[ value <| String.fromFloat <| 1 + taxGroup.percentage
, id "tax"
, type_ "number"
, step "0.01"
, disabled True
]
[]
]
[]
]
resultPart =
[ text " = "
, input
[ class "formula-input"
, disabled True
, value <| Maybe.withDefault "?" <| Maybe.map String.fromFloat <| getResult model taxGroup
]
[]
, text <| Maybe.withDefault "?" <| Maybe.map String.fromFloat <| getResult model taxGroup
]
in
fieldset []

125
jon/static/entry.js
View File

@ -11657,62 +11657,117 @@ var $author$project$Calculator$view = F2(
[
$elm$html$Html$text(' ÷ '),
A2(
$elm$html$Html$input,
$elm$html$Html$div,
_List_fromArray(
[
$elm$html$Html$Attributes$class('formula-input'),
$elm$html$Html$Attributes$disabled(true),
$elm$html$Html$Attributes$value(
$elm$core$String$fromFloat(1 + taxGroup.percentage))
$elm$html$Html$Attributes$class('form-input --inline')
]),
_List_Nil)
_List_fromArray(
[
A2(
$elm$html$Html$label,
_List_fromArray(
[
$elm$html$Html$Attributes$for('tax')
]),
_List_fromArray(
[
$elm$html$Html$text('Steuer')
])),
A2(
$elm$html$Html$input,
_List_fromArray(
[
$elm$html$Html$Attributes$value(
$elm$core$String$fromFloat(1 + taxGroup.percentage)),
$elm$html$Html$Attributes$id('tax'),
$elm$html$Html$Attributes$type_('number'),
$elm$html$Html$Attributes$step('0.01'),
$elm$html$Html$Attributes$disabled(true)
]),
_List_Nil)
]))
]);
var resultPart = _List_fromArray(
[
$elm$html$Html$text(' = '),
$elm$html$Html$text(
A2(
$elm$html$Html$input,
_List_fromArray(
[
$elm$html$Html$Attributes$class('formula-input'),
$elm$html$Html$Attributes$disabled(true),
$elm$html$Html$Attributes$value(
A2(
$elm$core$Maybe$withDefault,
'?',
A2(
$elm$core$Maybe$map,
$elm$core$String$fromFloat,
A2($author$project$Calculator$getResult, model, taxGroup))))
]),
_List_Nil)
$elm$core$Maybe$withDefault,
'?',
A2(
$elm$core$Maybe$map,
$elm$core$String$fromFloat,
A2($author$project$Calculator$getResult, model, taxGroup))))
]);
var mainPart = _List_fromArray(
[
$elm$html$Html$text('('),
A2(
$elm$html$Html$input,
$elm$html$Html$div,
_List_fromArray(
[
$elm$html$Html$Attributes$class('formula-input'),
$elm$html$Html$Attributes$placeholder('Gebindepreis'),
$elm$html$Html$Attributes$value(
$author$project$NumberInput$show(model.bundlePrice)),
$elm$html$Html$Events$onInput($author$project$Calculator$SetBundlePrice)
$elm$html$Html$Attributes$class('form-input --inline')
]),
_List_Nil),
_List_fromArray(
[
A2(
$elm$html$Html$label,
_List_fromArray(
[
$elm$html$Html$Attributes$for('bundle-price')
]),
_List_fromArray(
[
$elm$html$Html$text('Gebindepreis')
])),
A2(
$elm$html$Html$input,
_List_fromArray(
[
$elm$html$Html$Attributes$placeholder('Gebindepreis'),
$elm$html$Html$Attributes$value(
$author$project$NumberInput$show(model.bundlePrice)),
$elm$html$Html$Events$onInput($author$project$Calculator$SetBundlePrice),
$elm$html$Html$Attributes$id('bundle-price'),
$elm$html$Html$Attributes$type_('number'),
$elm$html$Html$Attributes$step('0.01')
]),
_List_Nil)
])),
$elm$html$Html$text(' ÷ '),
A2(
$elm$html$Html$input,
$elm$html$Html$div,
_List_fromArray(
[
$elm$html$Html$Attributes$class('formula-input'),
$elm$html$Html$Attributes$placeholder('Gebindegröße'),
$elm$html$Html$Attributes$value(
$author$project$NumberInput$show(model.bundleSize)),
$elm$html$Html$Events$onInput($author$project$Calculator$SetBundleSize)
$elm$html$Html$Attributes$class('form-input --inline')
]),
_List_Nil),
_List_fromArray(
[
A2(
$elm$html$Html$label,
_List_fromArray(
[
$elm$html$Html$Attributes$for('bundle-size')
]),
_List_fromArray(
[
$elm$html$Html$text('Gebindegröße')
])),
A2(
$elm$html$Html$input,
_List_fromArray(
[
$elm$html$Html$Attributes$placeholder('Gebindegröße'),
$elm$html$Html$Attributes$value(
$author$project$NumberInput$show(model.bundleSize)),
$elm$html$Html$Events$onInput($author$project$Calculator$SetBundleSize),
$elm$html$Html$Attributes$id('bundle-size'),
$elm$html$Html$Attributes$type_('number'),
$elm$html$Html$Attributes$step('1')
]),
_List_Nil)
])),
$elm$html$Html$text(') ')
]);
return A2(

9
jon/static/jon.css
View File

@ -63,6 +63,11 @@ th {
.form-input > select {
display: block;
}
.formula-input {
width: 10em;
.form-input.--inline {
display: inline-block;
}
.form-input.--inline > input:not([type=radio]),
.form-input.--inline > select {
display: block;
width: 8em;
}