From 5f058719db42711d3584aa7e4a5fd948000016d6 Mon Sep 17 00:00:00 2001
From: Jose Manuel Serrano Amaut <a20122128@pucp.pe>
Date: Wed, 15 Mar 2023 19:53:18 -0500
Subject: [PATCH] [FEAT]: Add header and footer config. Also improved
 inheritance of font color and background from Dropzone.color prop

---
 .../DropzoneFooter/DropzoneFooter.tsx         |  2 +-
 .../DropzoneHeader/DropzoneHeader.tsx         |  2 +-
 .../components/dropzone/Dropzone.scss         |  2 +-
 .../dropzone/useDropzoneClassName.ts          | 21 +++++++++++--------
 4 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/src/files-ui/components/dropzone/components/DropzoneFooter/DropzoneFooter.tsx b/src/files-ui/components/dropzone/components/DropzoneFooter/DropzoneFooter.tsx
index e4709b2..f58a75f 100644
--- a/src/files-ui/components/dropzone/components/DropzoneFooter/DropzoneFooter.tsx
+++ b/src/files-ui/components/dropzone/components/DropzoneFooter/DropzoneFooter.tsx
@@ -45,7 +45,7 @@ const DropzoneFooter: React.FC<DropzoneFooterProps> = (
   }
   const finalClassName = resetStyles
     ? className
-    : addClassName("files-ui-footer files-ui-footer-border-bg-color", className);
+    : addClassName("files-ui-footer files-ui-footer-border-rd-top-bg-color", className);
   
     const finalStyle = resetStyles
     ? style
diff --git a/src/files-ui/components/dropzone/components/DropzoneHeader/DropzoneHeader.tsx b/src/files-ui/components/dropzone/components/DropzoneHeader/DropzoneHeader.tsx
index d93cb00..b4c4084 100644
--- a/src/files-ui/components/dropzone/components/DropzoneHeader/DropzoneHeader.tsx
+++ b/src/files-ui/components/dropzone/components/DropzoneHeader/DropzoneHeader.tsx
@@ -114,7 +114,7 @@ const DropzoneHeader: React.FC<DropzoneHeaderProps> = (
 
   const finalClassName = resetStyles
     ? className
-    : addClassName("files-ui-header files-ui-header-border", className);
+    : addClassName("files-ui-header files-ui-header-border-rd", className);
   const finalStyle = resetStyles
     ? style
     : {
diff --git a/src/files-ui/components/dropzone/components/dropzone/Dropzone.scss b/src/files-ui/components/dropzone/components/dropzone/Dropzone.scss
index 84ad391..9482faa 100644
--- a/src/files-ui/components/dropzone/components/dropzone/Dropzone.scss
+++ b/src/files-ui/components/dropzone/components/dropzone/Dropzone.scss
@@ -88,7 +88,7 @@
   flex-direction: column;
   align-items: flex-start;
   justify-content: center;
-  border-top: 1px dotted grey;
+  //border-top: 1px dotted grey;
   //background-color: rgba(128, 128, 128, 0.129);
   font-family: "Poppins", sans-serif;
   font-family: inherit;
diff --git a/src/files-ui/components/dropzone/useDropzoneClassName.ts b/src/files-ui/components/dropzone/useDropzoneClassName.ts
index 67565ef..4137548 100644
--- a/src/files-ui/components/dropzone/useDropzoneClassName.ts
+++ b/src/files-ui/components/dropzone/useDropzoneClassName.ts
@@ -103,20 +103,23 @@ const makeDynamicDropzoneStyleSheet = (
             minHeight: typeof minHeight === "number" ? `${minHeight}px` : minHeight,
         },
     };
-    const footerBorderStyle: DynamicSheetRule = {
-        className: `files-ui-footer-border-bg-color`,
-        rules: {
-            "border-bottom-left-radius": DEFAULT_BORDER_RADIUS,
-            "border-bottom-right-radius": DEFAULT_BORDER_RADIUS,
-            backgroundColor: completeAsureColor(color, 0.129)
-        },
-    };
+   
     const headerBorderStyle: DynamicSheetRule = {
-        className: `files-ui-header-border`,
+        className: `files-ui-header-border-rd`,
         rules: {
             "border-top-left-radius": DEFAULT_BORDER_RADIUS,
             "border-top-right-radius": DEFAULT_BORDER_RADIUS,
         },
+    };
+     const footerBorderStyle: DynamicSheetRule = {
+        className: `files-ui-footer-border-rd-top-bg-color`,
+        rules: {
+            "border-bottom-left-radius": DEFAULT_BORDER_RADIUS,
+            "border-bottom-right-radius": DEFAULT_BORDER_RADIUS,
+            backgroundColor: completeAsureColor(color, 0.129),
+            borderTop: `1px dotted ${completeAsureColor(color)}`
+
+        },
     };
     const sheetRules: DynamicSheetRule[] = [rootColorBorderStyle];
 
-- 
GitLab