Minor fixes (#460)

* fix(frontend): add padding and height to loader fallback

* fix(react): remove height and padding from fallback wrapper

* docs: add changesets

.changeset/fresh-jobs-relate.md

@@ -0,0 +1,5 @@
+---
+"@carrot-kpi/react": patch
+---
+
+Remove height and padding from fallback wrapper

.changeset/yellow-apes-explode.md

@@ -0,0 +1,5 @@
+---
+"@carrot-kpi/host-frontend": patch
+---
+
+Add padding and height to loader fallback

packages/frontend/src/pages/create-with-template-id/index.tsx

@@ -144,7 +144,7 @@ export const CreateWithTemplateId = () => {
                         key={formKey}
                         template={template || undefined}
                         fallback={
-                            <div className="text-black flex justify-center">
+                            <div className="h-screen py-20 text-black flex justify-center">
                                 <Loader />
                             </div>
                         }

packages/frontend/src/pages/page/index.tsx

@@ -32,7 +32,7 @@ export const Page = () => {
                     kpiToken={watchedKPITokenWithData}
                     i18n={i18n}
                     fallback={
-                        <div className="text-black flex justify-center items-center">
+                        <div className="h-screen py-20 text-black flex justify-center items-center">
                             <Loader />
                         </div>
                     }

packages/react/src/components/template-component.tsx

@@ -83,8 +83,7 @@ export function TemplateComponent({
         );
     }, [systemDarkTheme, theme]);
 
-    if (loading || !template || !Component)
-        return <div className="h-screen py-20">{fallback}</div>;
+    if (loading || !template || !Component) return <div>{fallback}</div>;
     return (
         <div
             className={wrapperStyles({