From c1e66eca98c19d233f893b359f3e283e65e8d59b Mon Sep 17 00:00:00 2001
From: Orka Arnest CRUZE <orka.cruze@ign.fr>
Date: Mon, 24 Jun 2024 14:21:15 +0200
Subject: [PATCH] =?UTF-8?q?feat:=20am=C3=A9liore=20config=20antd?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .nvmrc                             |  1 +
 src/components/DsfrAntdConfig.tsx  | 56 ++++++++++++++++++++++++++----
 src/components/GeostylerEditor.tsx |  7 ++++
 src/css/geostyler.css              |  8 +++++
 4 files changed, 66 insertions(+), 6 deletions(-)
 create mode 100644 .nvmrc

diff --git a/.nvmrc b/.nvmrc
new file mode 100644
index 0000000..42e31a0
--- /dev/null
+++ b/.nvmrc
@@ -0,0 +1 @@
+v20.14.0
diff --git a/src/components/DsfrAntdConfig.tsx b/src/components/DsfrAntdConfig.tsx
index d81893c..2d503cb 100644
--- a/src/components/DsfrAntdConfig.tsx
+++ b/src/components/DsfrAntdConfig.tsx
@@ -13,10 +13,24 @@ const DsfrAntdConfig: FC<PropsWithChildren> = ({ children }) => {
             theme={{
                 token: {
                     colorPrimary: options.blueFrance.sun113_625.default,
+                    colorPrimaryHover: options.blueFrance.sun113_625.hover,
+                    colorPrimaryActive: options.blueCumulus.sun368moon732.active,
+
                     colorSuccess: options.success._950_100.default,
+                    colorSuccessHover: options.success._950_100.hover,
+                    colorSuccessActive: options.success._950_100.active,
+
                     colorError: options.error._950_100.default,
+                    colorErrorHover: options.error._950_100.hover,
+                    colorErrorActive: options.error._950_100.active,
+
                     colorWarning: options.warning._950_100.default,
+                    colorWarningHover: options.warning._950_100.hover,
+                    colorWarningActive: options.warning._950_100.active,
+
                     colorInfo: options.info._950_100.default,
+                    colorInfoHover: options.info._950_100.hover,
+                    colorInfoActive: options.info._950_100.active,
 
                     colorBgBase: decisions.background.default.grey.default,
                     colorBorder: decisions.border.default.grey.default,
@@ -24,22 +38,52 @@ const DsfrAntdConfig: FC<PropsWithChildren> = ({ children }) => {
                     colorTextDisabled: decisions.text.disabled.grey.default,
                     colorTextLabel: decisions.text.label.grey.default,
 
+                    borderRadius: 0,
+                    colorBorderBg: decisions.border.plain.grey.default,
+
+                    fontFamily: "Marianne, arial, sans-serif",
+                    fontSize: 16,
+
                     fontSizeHeading1: 40,
+                    lineHeightHeading1: 48,
+
                     fontSizeHeading2: 32,
+                    lineHeightHeading2: 40,
+
                     fontSizeHeading3: 28,
+                    lineHeightHeading3: 36,
+
                     fontSizeHeading4: 24,
+                    lineHeightHeading4: 32,
+
                     fontSizeHeading5: 22,
+                    lineHeightHeading5: 28,
 
-                    borderRadius: 0,
-                    fontFamily: "Marianne, arial, sans-serif",
-                    fontSize: 16,
                     // margin: fr.spacing("10v")
+                    padding: 16,
                 },
                 components: {
-                    Input: {
-                        colorBgBase: decisions.background.raised.grey.default,
-                        colorBgContainer: decisions.background.raised.grey.default,
+                    Button: {
+                        defaultShadow: "none",
+                        primaryShadow: "none",
+                        padding: 16,
+                        paddingBlock: 16,
+                        paddingInline: 16,
                     },
+                    // Input: {
+                    //     padding: 16,
+                    //     paddingBlock: 8,
+                    //     paddingInline: 16,
+                    //     colorBgContainer: decisions.background.contrast.grey.default,
+                    //     // colorBorder: decisions.border.plain.grey.default,
+                    //     // borderRadius: 5,
+                    // },
+                    // InputNumber: {
+                    //     padding: 16,
+                    //     paddingBlock: 8,
+                    //     paddingInline: 16,
+                    //     colorBgContainer: decisions.background.contrast.grey.default,
+                    // },
                 },
             }}
         >
diff --git a/src/components/GeostylerEditor.tsx b/src/components/GeostylerEditor.tsx
index a5b7e40..a1f6e33 100644
--- a/src/components/GeostylerEditor.tsx
+++ b/src/components/GeostylerEditor.tsx
@@ -1,4 +1,6 @@
 import { fr } from "@codegouvfr/react-dsfr";
+import { Button } from "@codegouvfr/react-dsfr/Button";
+import { Input } from "@codegouvfr/react-dsfr/Input";
 import { Tabs } from "@codegouvfr/react-dsfr/Tabs";
 import { CardStyle, CodeEditor, GeoStylerContext, GeoStylerContextInterface, Style, locale } from "geostyler";
 import MapboxStyleParser from "geostyler-mapbox-parser";
@@ -6,6 +8,7 @@ import QGISStyleParser from "geostyler-qgis-parser";
 import SldStyleParser from "geostyler-sld-parser";
 import { Style as GsStyle } from "geostyler-style";
 import { FC } from "react";
+import { Input as AntdInput } from "antd";
 
 import DsfrAntdConfig from "./DsfrAntdConfig";
 
@@ -85,6 +88,10 @@ const GeostylerEditor: FC<GeostylerEditorProps> = ({ gsStyle, onStyleChange }) =
                         },
                     ]}
                 />
+                <Button>Hello</Button>
+                <Input label="Input DSFR disabled" disabled />
+                <Input label="Input DSFR" />
+                <AntdInput title="Input Antd" />
             </DsfrAntdConfig>
         </GeoStylerContext.Provider>
     );
diff --git a/src/css/geostyler.css b/src/css/geostyler.css
index 80893e8..cf5b59b 100644
--- a/src/css/geostyler.css
+++ b/src/css/geostyler.css
@@ -1,3 +1,11 @@
 .code-editor-container {
     height: 600px;
 }
+
+/* .gs-renderer > .gs-symbolizer-olrenderer {
+    height: 40px;
+}
+
+.gs-renderer .gs-symbolizer-olrenderer {
+    height: 40px;
+} */