From afcf1a011bb4156d316fa12408a7dbe193f1f1c5 Mon Sep 17 00:00:00 2001 From: Robert Roose <103183050+rroose-rvo@users.noreply.github.com> Date: Thu, 26 Oct 2023 10:44:26 +0200 Subject: [PATCH] Add startpagina to Mijn Percelen demopages (#515) --- .../demopages/common/mijn-percelen.scss | 10 +- .../demopages/common/rhs-update.scss | 28 +++ .../mijnpercelen/Startpagina.stories.tsx | 17 ++ .../demopages/mijnpercelen/Startpagina.tsx | 163 ++++++++++++++++++ 4 files changed, 217 insertions(+), 1 deletion(-) create mode 100644 documentation/demopages/mijnpercelen/Startpagina.stories.tsx create mode 100644 documentation/demopages/mijnpercelen/Startpagina.tsx diff --git a/documentation/demopages/common/mijn-percelen.scss b/documentation/demopages/common/mijn-percelen.scss index 38e279f892..cde56726df 100644 --- a/documentation/demopages/common/mijn-percelen.scss +++ b/documentation/demopages/common/mijn-percelen.scss @@ -18,13 +18,21 @@ grid-template-columns: 500px 1fr; } + .rvo-main--mijn-percelen-startpagina { + grid-template-columns: 600px 1fr; + } + .rvo-main-mijn-percelen--data { padding-block-end: var(--rvo-space-md); - padding-block-start: var(--rvo-space-md); + padding-block-start: 0; padding-inline-end: var(--rvo-space-md); padding-inline-start: var(--rvo-space-md); } + .rvo-main-mijn-percelen--sidebar { + padding-block-start: var(--rvo-space-xl); + } + .rvo-cards--percelen { display: flex; flex-direction: column; diff --git a/documentation/demopages/common/rhs-update.scss b/documentation/demopages/common/rhs-update.scss index 2a5cceff9d..54ea64dd5d 100644 --- a/documentation/demopages/common/rhs-update.scss +++ b/documentation/demopages/common/rhs-update.scss @@ -192,4 +192,32 @@ .rvo-table-cell { border-bottom-color: #e2e8f0; } + + /* @CONTENT ELEMENTS */ + + .rvo-paragraph-spaced { + margin-block-start: 0; + } + + .rvo-paragraph--lg { + font-size: 1.125rem; + } + + .rvo-list { + padding-inline-start: 20px; + } + + /* @INFO BLOCK */ + + .rvo-info-block { + border: 1px solid #e2e8f0; + padding-block-end: var(--rvo-space-xl); + padding-block-start: var(--rvo-space-md); + padding-inline-end: var(--rvo-space-xl); + padding-inline-start: var(--rvo-space-xl); + + *:last-child { + margin-block-end: 0; + } + } } diff --git a/documentation/demopages/mijnpercelen/Startpagina.stories.tsx b/documentation/demopages/mijnpercelen/Startpagina.stories.tsx new file mode 100644 index 0000000000..62ecd22818 --- /dev/null +++ b/documentation/demopages/mijnpercelen/Startpagina.stories.tsx @@ -0,0 +1,17 @@ +import type { Meta, StoryObj } from '@storybook/react'; +import Startpagina from './Startpagina'; + +const meta: Meta = { + title: "Demo pagina's/Mijn Percelen/Startpagina", + component: Startpagina, + parameters: { + status: { + type: 'WORK IN PROGRESS', + }, + }, +}; +export default meta; + +type Story = StoryObj; + +export const Default: Story = { name: 'Startpagina' }; diff --git a/documentation/demopages/mijnpercelen/Startpagina.tsx b/documentation/demopages/mijnpercelen/Startpagina.tsx new file mode 100644 index 0000000000..c633cfb03e --- /dev/null +++ b/documentation/demopages/mijnpercelen/Startpagina.tsx @@ -0,0 +1,163 @@ +import { Button, Heading, LayoutColumnRow, MenuBar } from '@nl-rvo/components'; +import '../common/rhs-update.scss'; +import '../common/mijn-percelen.scss'; + +const Startpagina = () => { + return ( + +
+
+
+ +
+ +
+
+ Rijksdienst voor Ondernemend +
+ Nederland +
+ +
+
+
+ +
+
+
+ +
+
+ + {/* + + Terug naar mijn.rvo.nl + */} +
+ +
+ +

+ Hier registreert en wijzigt u de percelen die u in gebruik heeft. De perceelsgegevens zijn de + basis voor het aanvragen van subsidies en voor regelingen zoals de mestwetgeving. Daarom is + het belangrijk dat u uw gegevens bijhoudt. +

+ +
+
+ +
+ +

+ Wilt u alvast uw percelen voor 2024 opgeven? Klik op ‘Wijzigen’ en pas daarna de peildatum aan + naar 15-05-2024. Klik vervolgens op de knop ‘Percelen wijzigen’. U kunt dan starten met het + opgeven/bijwerken van uw gewaspercelen en landschapselementen voor 2024. +

+ +

+ Om landschapselementen te registreren gebruikt u verschillende nieuwe functies. Meer + informatie vindt u in het{' '} + + Stappenplan landschapselementen registreren + + . +

+ + +

+ Wij gaan zorgvuldig om met uw persoonsgegevens. Lees meer over ons{' '} + + privacybeleid + + . Informatie over specifieke verwerkingen vindt u in het{' '} + + AVG-register + {' '} + van het ministerie van Economische Zaken en Klimaat en het ministerie van Landbouw, Natuur en + Voedselkwaliteit. +

+ +
+ +
+ +
+
+
+
+ + +
+

+ +

Wil onze medewerker meekijken?

+ +

+
+ +
+
+
+ + ); +}; + +export default Startpagina;