Merge pull request #9 from deco-sites/fix/theme

fix: theme
deco-sites · Aug 28, 2024 · 85a5d5e · 85a5d5e
2 parents 6b25331 + 38aaa81
commit 85a5d5e
Show file tree

Hide file tree

Showing 10 changed files with 901 additions and 23 deletions.
diff --git a/.deco/blocks/Fashion%20theme.json b/.deco/blocks/Fashion%20theme.json
@@ -1 +1,58 @@
-{"font":{"fonts":[{"family":"Mulish","variations":[{"weight":"300"},{"weight":"400"},{"weight":"500"},{"weight":"600"},{"weight":"700"}]}],"__resolveType":"website/loaders/fonts/googleFonts.ts"},"fonts":[{"fontFamily":"Poppins"}],"mainColors":{"primary":"#384c53","base-100":"#FFFFFF","tertiary":"#5f9a99","secondary":"#020202"},"buttonStyle":{"--border-btn":"1px","--rounded-btn":"0.2rem","--animation-btn":"0.25s","--btn-text-case":"normal-case","--btn-focus-scale":"0.95"},"colorScheme":"light","otherStyles":{"--tab-border":"1px","--tab-radius":"0.5rem","--rounded-box":"1rem","--rounded-badge":"1.9rem","--animation-input":"0.2s"},"__resolveType":"site/sections/Theme/Theme.tsx","complementaryColors":{"primary":{"primary-content":"#ffffff"}}}
+{
+  "font": {
+    "fonts": [
+      {
+        "family": "Mulish",
+        "variations": [
+          {
+            "weight": "300"
+          },
+          {
+            "weight": "400"
+          },
+          {
+            "weight": "500"
+          },
+          {
+            "weight": "600"
+          },
+          {
+            "weight": "700"
+          }
+        ]
+      }
+    ],
+    "__resolveType": "website/loaders/fonts/googleFonts.ts"
+  },
+  "fonts": [
+    {
+      "fontFamily": "Poppins"
+    }
+  ],
+  "mainColors": {
+    "primary": "#384c53",
+    "base-100": "#FFFFFF",
+    "tertiary": "#5f9a99",
+    "secondary": "#020202"
+  },
+  "buttonStyle": {
+    "--border-btn": "1px",
+    "--rounded-btn": "0.2rem",
+    "--animation-btn": "0.25s",
+    "--btn-text-case": "normal-case",
+    "--btn-focus-scale": "0.95"
+  },
+  "otherStyles": {
+    "--tab-border": "1px",
+    "--tab-radius": "0.5rem",
+    "--rounded-box": "1rem",
+    "--rounded-badge": "1.9rem",
+    "--animation-input": "0.2s"
+  },
+  "__resolveType": "site/sections/Theme/Theme.tsx",
+  "complementaryColors": {
+    "primary": {
+      "primary-content": "#ffffff"
+    }
+  }
+}
diff --git a/.deco/blocks/site.json b/.deco/blocks/site.json
@@ -1 +1,52 @@
-{"seo":{"type":"website","title":"World Tools - Ferramentas e equipamentos para Usinagem","favicon":"https://ozksgdmyrqcxcwhnbepg.supabase.co/storage/v1/object/public/assets/3444/7da31d19-b9ef-4c75-9e68-b65fe87fef1d","titleTemplate":"%s","descriptionTemplate":"%s"},"flavor":{"framework":"fresh"},"global":[{"link":"https://api.whatsapp.com/send?phone=554730271106&text=Contato%20via%20E-commerce%20World%20Tools","phone":"https://api.whatsapp.com/send?phone=554730271106&text=Contato%20via%20E-commerce%20World%20Tools","__resolveType":"site/sections/Social/WhatsApp.tsx"},{"__resolveType":"Analytics Test"}],"routes":[{"__resolveType":"website/loaders/pages.ts"},{"__resolveType":"website/loaders/redirects.ts"}],"caching":{"directives":[]},"commerce":{"token":{},"account":"worldtools","platform":"wake","checkoutUrl":"https://checkout.worldtools.com.br","storefrontToken":{}},"platform":"wake","abTesting":{"replaces":[],"includeScriptsToHead":{"includes":[]}},"__resolveType":"site/apps/site.ts","firstByteThresholdMS":false,"theme":{"__resolveType":"Fashion theme"}}
+{
+  "seo": {
+    "type": "website",
+    "title": "World Tools - Ferramentas e equipamentos para Usinagem",
+    "favicon": "https://ozksgdmyrqcxcwhnbepg.supabase.co/storage/v1/object/public/assets/3444/7da31d19-b9ef-4c75-9e68-b65fe87fef1d",
+    "titleTemplate": "%s",
+    "descriptionTemplate": "%s"
+  },
+  "flavor": {
+    "framework": "fresh"
+  },
+  "global": [
+    {
+      "link": "https://api.whatsapp.com/send?phone=554730271106&text=Contato%20via%20E-commerce%20World%20Tools",
+      "phone": "https://api.whatsapp.com/send?phone=554730271106&text=Contato%20via%20E-commerce%20World%20Tools",
+      "__resolveType": "site/sections/Social/WhatsApp.tsx"
+    },
+    {
+      "__resolveType": "Analytics Test"
+    }
+  ],
+  "routes": [
+    {
+      "__resolveType": "website/loaders/pages.ts"
+    },
+    {
+      "__resolveType": "website/loaders/redirects.ts"
+    }
+  ],
+  "caching": {
+    "directives": []
+  },
+  "commerce": {
+    "token": {},
+    "account": "worldtools",
+    "platform": "wake",
+    "checkoutUrl": "https://checkout.worldtools.com.br",
+    "storefrontToken": {}
+  },
+  "platform": "wake",
+  "abTesting": {
+    "replaces": [],
+    "includeScriptsToHead": {
+      "includes": []
+    }
+  },
+  "__resolveType": "site/apps/site.ts",
+  "firstByteThresholdMS": false,
+  "theme": {
+    "__resolveType": "Fashion theme"
+  }
+}
diff --git a/components/header/Header.tsx b/components/header/Header.tsx
@@ -48,7 +48,7 @@ function Header({
           searchbar={searchbar}
           platform={platform}
         >
-          <div class="bg-base-100 fixed w-full z-50">
+          <div class="bg-white fixed w-full z-50">
             <Alert alerts={alerts} ctaButton={ctaButton} />
             <Navbar
               items={items}

diff --git a/components/header/NavItem.tsx b/components/header/NavItem.tsx
@@ -33,7 +33,7 @@ function NavItem({ item }: { item: SiteNavigationElement }) {
 
       {children && children.length > 0 && (
         <div
-          class="h-[55vh] overflow-hidden overflow-y-auto absolute hidden hover:flex group-hover:flex bg-base-100 z-50 items-start justify-center gap-6 border-t border-b-2 border-base-200 w-screen"
+          class="h-[55vh] overflow-hidden overflow-y-auto absolute hidden hover:flex group-hover:flex bg-white z-50 items-start justify-center gap-6 border-t border-b-2 border-[#E9E9E9] w-screen"
           style={{ top: "0px", left: "0px", marginTop: "60px" }}
         >
           {image?.url && (

diff --git a/components/header/Navbar.tsx b/components/header/Navbar.tsx
@@ -133,7 +133,7 @@ function Navbar({ items, searchbar, logo }: {
           {platform === "nuvemshop" && <CartButtonNuvemshop />}
         </div>
       </div>
-      <div class="relative hidden md:flex flex-row justify-between items-center border-t border-base-200 w-full pl-2 pr-6 py-4">
+      <div class="relative hidden md:flex flex-row justify-between items-center border-t border-[#E9E9E9] w-full pl-2 pr-6 py-4">
         <div class="flex-auto flex justify-center">
           {items.map((item) => <NavItem item={item} />)}
         </div>

diff --git a/components/ui/SectionHeader.tsx b/components/ui/SectionHeader.tsx
@@ -51,7 +51,7 @@ function Header(props: Props) {
                   class={`
                   leading-6 lg:leading-8 text-left
                   ${
-                    props.colorReverse ? "text-neutral" : "text-primary-content"
+                    props.colorReverse ? "text-neutral" : "text-[#737373]"
                   }
                   ${props.fontSize === "Normal" ? "lg:text-sm" : "lg:text-sm"}
                 `}

diff --git a/deno.json b/deno.json
@@ -1,7 +1,7 @@
 {
   "imports": {
     "$store/": "./",
-    "deco/": "https://denopkg.com/deco-cx/deco@1.94.0/",
+    "deco/": "https://denopkg.com/deco-cx/deco@1.95.1/",
     "apps/": "https://denopkg.com/deco-cx/[email protected]/",
     "$fresh/": "https://deno.land/x/[email protected]/",
     "preact": "https://esm.sh/[email protected]",
@@ -55,9 +55,24 @@
     "update": "deno run -Ar jsr:@deco/scripts/update",
     "bundle": "deno run -A jsr:@deco/deco/scripts/bundle site"
   },
-  "githooks": { "pre-commit": "check" },
-  "exclude": ["node_modules", "static/", "README.md", "_fresh", "**/_fresh/*"],
-  "lint": { "rules": { "tags": ["fresh", "recommended"] } },
+  "githooks": {
+    "pre-commit": "check"
+  },
+  "exclude": [
+    "node_modules",
+    "static/",
+    "README.md",
+    "_fresh",
+    "**/_fresh/*"
+  ],
+  "lint": {
+    "rules": {
+      "tags": [
+        "fresh",
+        "recommended"
+      ]
+    }
+  },
   "nodeModulesDir": true,
   "compilerOptions": {
     "jsx": "react-jsx",

diff --git a/routes/_app.tsx b/routes/_app.tsx
@@ -1,23 +1,40 @@
-import { AppProps } from "$fresh/server.ts";
-import GlobalTags from "$store/components/GlobalTags.tsx";
-import Theme from "$store/sections/Theme/Theme.tsx";
+import { asset, Head } from "$fresh/runtime.ts";
+import { defineApp } from "$fresh/server.ts";
+import { Context } from "deco/deco.ts";
 
 const sw = () =>
   addEventListener("load", () =>
     navigator && navigator.serviceWorker &&
     navigator.serviceWorker.register("/sw.js"));
 
-function App(props: AppProps) {
+export default defineApp(async (_req, ctx) => {
+  const revision = await Context.active().release?.revision();
   return (
     <>
       {/* Include default fonts and css vars */}
-      <Theme />
 
-      {/* Include Icons and manifest */}
-      <GlobalTags />
+      <Head>
+        {/* Enable View Transitions API */}
+        <style
+          dangerouslySetInnerHTML={{
+            __html: `@view-transition { navigation: auto; }`,
+          }}
+        />
+
+        {/* Tailwind v3 CSS file */}
+        <link
+          href={asset(`/styles.css?revision=${revision}`)}
+          rel="stylesheet"
+        />
+        {/* Custom CSS */}
+        <link href={asset("/custom.css")} rel="stylesheet" />
+
+        {/* Web Manifest */}
+        <link rel="manifest" href={asset("/site.webmanifest")} />
+      </Head>
 
       {/* Rest of Preact tree */}
-      <props.Component />
+      <ctx.Component />
 
       {/* Include service worker */}
       <script
@@ -26,6 +43,4 @@ function App(props: AppProps) {
       />
     </>
   );
-}
-
-export default App;
+});
diff --git a/sections/Content/Logos.tsx b/sections/Content/Logos.tsx
@@ -72,7 +72,7 @@ function Logos(props: SectionProps<ReturnType<typeof loader>>) {
           {list.map((element, index) => (
             <Slider.Item
               index={index}
-              class="carousel-item w-1/2 md:w-1/5 h-17 lg:h-20 px-2 lg:px-6 py-6 lg:py-4 inline-block align-middle"
+              class="carousel-item w-1/2 md:w-1/5 h-17 lg:h-20 px-2 lg:px-2 lg:justify-center py-6 lg:py-4 inline-block align-middle"
             >
               <div class="flex w-full h-full items-center justify-center">
                 <a href={element?.link}>