Skip to content
Snippets Groups Projects
Commit 0fbfc8fc authored by Emmanuel Raviart's avatar Emmanuel Raviart
Browse files

Style law, bill & amendment values.

parent 7ea19d50
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
src/lib/components/test_cases/TestCaseView.svelte
+ 49
− 73
View file @ 0fbfc8fc
...@@ -29,6 +29,8 @@ ...@@ -29,6 +29,8 @@
} from "$lib/situations" } from "$lib/situations"
import { retrieveVariableSummaryByName } from "$lib/variables" import { retrieveVariableSummaryByName } from "$lib/variables"
import ValueChange from "./ValueChange.svelte"
export let calculationName: CalculationName export let calculationName: CalculationName
export let decompositionByName: DecompositionByName export let decompositionByName: DecompositionByName
export let evaluationByNameArrayByCalculationName: EvaluationByNameArrayByCalculationName export let evaluationByNameArrayByCalculationName: EvaluationByNameArrayByCalculationName
...@@ -461,34 +463,24 @@ ...@@ -461,34 +463,24 @@
</div> </div>
<div class="place-self-center"> <div class="place-self-center">
<p <p
class=" text-2xl font-bold" class="font-bold text-2xl"
title="⚠️ Les dispositifs n'étant pas tous à jour, ce montant est à considérer avec prudence" title="⚠️ Les dispositifs n'étant pas tous à jour, ce montant est à considérer avec prudence"
> >
<span class="line-through-bill"> <ValueChange
{euroAmountFormatter.format( amendmentValue={Object.keys($reform).length === 0
evaluationByNameArrayByCalculationName.law[situationIndex][ ? undefined
: evaluationByNameArrayByCalculationName.amendment[situationIndex][
rootDecompositionName rootDecompositionName
].deltaAtVectorIndex ?? 0, ].deltaAtVectorIndex ?? 0}
)} billValue={$billName === undefined
</span> ? undefined
{#if $billName !== undefined} : evaluationByNameArrayByCalculationName.bill[situationIndex][
<span class="text-le-rouge-pjl line-through-reform">
{euroAmountFormatter.format(
evaluationByNameArrayByCalculationName.bill[situationIndex][
rootDecompositionName rootDecompositionName
].deltaAtVectorIndex ?? 0, ].deltaAtVectorIndex ?? 0}
)} lawValue={evaluationByNameArrayByCalculationName.law[situationIndex][
</span>
{/if}
{#if Object.keys($reform).length > 0}
<span class="text-black bg-le-jaune px-1">
{euroAmountFormatter.format(
evaluationByNameArrayByCalculationName.amendment[situationIndex][
rootDecompositionName rootDecompositionName
].deltaAtVectorIndex ?? 0, ].deltaAtVectorIndex ?? 0}
)} />
</span>
{/if}
</p> </p>
</div> </div>
...@@ -503,29 +495,21 @@ ...@@ -503,29 +495,21 @@
class="text-base" class="text-base"
title="⚠️ Les dispositifs n'étant pas tous à jour, ce montant est à considérer avec prudence" title="⚠️ Les dispositifs n'étant pas tous à jour, ce montant est à considérer avec prudence"
> >
{euroAmountFormatter.format( <ValueChange
evaluationByNameArrayByCalculationName.law[situationIndex][ amendmentValue={Object.keys($reform).length === 0
? undefined
: evaluationByNameArrayByCalculationName.amendment[situationIndex][
firstDecompositionName firstDecompositionName
].deltaAtVectorIndex ?? 0, ].deltaAtVectorIndex ?? 0}
)} billValue={$billName === undefined
{#if $billName !== undefined} ? undefined
<span class="text-le-rouge-pjl"> : evaluationByNameArrayByCalculationName.bill[situationIndex][
{euroAmountFormatter.format(
evaluationByNameArrayByCalculationName.bill[situationIndex][
firstDecompositionName firstDecompositionName
].deltaAtVectorIndex ?? 0, ].deltaAtVectorIndex ?? 0}
)} lawValue={evaluationByNameArrayByCalculationName.law[situationIndex][
</span>
{/if}
{#if Object.keys($reform).length > 0}
<span class="text-black bg-le-jaune px-1">
{euroAmountFormatter.format(
evaluationByNameArrayByCalculationName.amendment[situationIndex][
firstDecompositionName firstDecompositionName
].deltaAtVectorIndex ?? 0, ].deltaAtVectorIndex ?? 0}
)} />
</span>
{/if}
</p> </p>
</div> </div>
...@@ -542,38 +526,30 @@ ...@@ -542,38 +526,30 @@
class="text-base" class="text-base"
title="⚠️ Les dispositifs n'étant pas tous à jour, ce montant est à considérer avec prudence" title="⚠️ Les dispositifs n'étant pas tous à jour, ce montant est à considérer avec prudence"
> >
{euroAmountFormatter.format( <ValueChange
(evaluationByNameArrayByCalculationName.law[situationIndex][ amendmentValue={Object.keys($reform).length === 0
? undefined
: (evaluationByNameArrayByCalculationName.amendment[situationIndex][
rootDecompositionName rootDecompositionName
].deltaAtVectorIndex ?? 0) - ].deltaAtVectorIndex ?? 0) -
(evaluationByNameArrayByCalculationName.law[situationIndex][ (evaluationByNameArrayByCalculationName.amendment[situationIndex][
firstDecompositionName firstDecompositionName
].deltaAtVectorIndex ?? 0), ].deltaAtVectorIndex ?? 0)}
)} billValue={$billName === undefined
{#if $billName !== undefined} ? undefined
<span class="text-le-rouge-pjl"> : (evaluationByNameArrayByCalculationName.bill[situationIndex][
{euroAmountFormatter.format(
(evaluationByNameArrayByCalculationName.bill[situationIndex][
rootDecompositionName rootDecompositionName
].deltaAtVectorIndex ?? 0) - ].deltaAtVectorIndex ?? 0) -
(evaluationByNameArrayByCalculationName.bill[situationIndex][ (evaluationByNameArrayByCalculationName.bill[situationIndex][
firstDecompositionName firstDecompositionName
].deltaAtVectorIndex ?? 0), ].deltaAtVectorIndex ?? 0)}
)} lawValue={(evaluationByNameArrayByCalculationName.law[situationIndex][
</span>
{/if}
{#if Object.keys($reform).length > 0}
<span class="text-le-rouge-pjl">
{euroAmountFormatter.format(
(evaluationByNameArrayByCalculationName.amendment[situationIndex][
rootDecompositionName rootDecompositionName
].deltaAtVectorIndex ?? 0) - ].deltaAtVectorIndex ?? 0) -
(evaluationByNameArrayByCalculationName.amendment[situationIndex][ (evaluationByNameArrayByCalculationName.law[situationIndex][
firstDecompositionName firstDecompositionName
].deltaAtVectorIndex ?? 0), ].deltaAtVectorIndex ?? 0)}
)} />
</span>
{/if}
</p> </p>
</div> </div>
</div> </div>
......
src/lib/components/test_cases/ValueChange.svelte 0 → 100644
+ 65
− 0
View file @ 0fbfc8fc
<script lang="ts">
const euroAmountFormatter = new Intl.NumberFormat("fr-FR", {
currency: "EUR",
maximumFractionDigits: 0,
minimumFractionDigits: 0,
style: "currency",
})
export let amendmentValue: number | undefined
export let billValue: number | undefined
export let lawValue: number
$: amendmentValueFormatted =
amendmentValue === undefined
? undefined
: euroAmountFormatter.format(amendmentValue)
$: billValueFormatted =
billValue === undefined ? undefined : euroAmountFormatter.format(billValue)
$: lawValueFormatted = euroAmountFormatter.format(lawValue)
$: showAmendmentValue = mustShowAmendmentValue(
amendmentValueFormatted,
billValueFormatted,
lawValueFormatted,
)
$: showBillValue =
billValueFormatted !== undefined && billValueFormatted !== lawValueFormatted
function mustShowAmendmentValue(
amendmentValueFormatted: string | undefined,
billValueFormatted: string | undefined,
lawValueFormatted: string,
) {
if (amendmentValueFormatted === undefined) {
return false
}
if (
billValueFormatted !== undefined &&
amendmentValueFormatted !== billValueFormatted
) {
return true
}
return amendmentValueFormatted !== lawValueFormatted
}
</script>
<span
class={showBillValue
? "line-through-bill"
: showAmendmentValue
? "line-through-amendment"
: ""}>{lawValueFormatted}</span
>
{#if showBillValue}
<span
class="text-le-rouge-bill"
class:line-through-amendment={showAmendmentValue}>{billValueFormatted}</span
>
{/if}
{#if showAmendmentValue}
<span class="text-black bg-le-jaune px-1">{amendmentValueFormatted}</span>
{/if}
tailwind.config.cjs
+ 15
− 15
View file @ 0fbfc8fc
...@@ -13,7 +13,7 @@ const config = { ...@@ -13,7 +13,7 @@ const config = {
"le-bleu-light": "#d2dfff", "le-bleu-light": "#d2dfff",
"le-jaune": "#ded500", "le-jaune": "#ded500",
"le-jaune-dark": "#a6a00c", "le-jaune-dark": "#a6a00c",
"le-rouge-pjl": "#ff6b6b", "le-rouge-bill": "#ff6b6b",
"le-gris-dispositif": "#5E709E", "le-gris-dispositif": "#5E709E",
"le-gris-dispositif-light": "#CCD3E7", "le-gris-dispositif-light": "#CCD3E7",
"le-gris-dispositif-dark": "#2F406A", "le-gris-dispositif-dark": "#2F406A",
...@@ -22,9 +22,9 @@ const config = { ...@@ -22,9 +22,9 @@ const config = {
white: colors.white, white: colors.white,
}, },
blur: { blur: {
xs: '1.2px', xs: "1.2px",
xxs: '0.8px', xxs: "0.8px",
} },
}, },
fontFamily: { fontFamily: {
sans: ["Lato", "sans-serif"], sans: ["Lato", "sans-serif"],
...@@ -37,19 +37,19 @@ const config = { ...@@ -37,19 +37,19 @@ const config = {
plugins: [ plugins: [
function ({ addUtilities }) { function ({ addUtilities }) {
const extendLineThrough = { const extendLineThrough = {
'.line-through-bill': { ".line-through-amendment": {
'textDecoration': 'line-through', textDecoration: "line-through",
'text-decoration-color': 'rgba(255, 107, 107,0.7)', "text-decoration-color": "rgba(222, 213, 0,0.7)",
'text-decoration-thickness': '2px' "text-decoration-thickness": "2px",
}, },
'.line-through-reform': { ".line-through-bill": {
'textDecoration': 'line-through', textDecoration: "line-through",
'text-decoration-color': 'rgba(222, 213, 0,0.7)', "text-decoration-color": "rgba(255, 107, 107,0.7)",
'text-decoration-thickness': '2px' "text-decoration-thickness": "2px",
}, },
} }
addUtilities(extendLineThrough) addUtilities(extendLineThrough)
} },
], ],
} }
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment