Dev test

components/header/Header.tsx

@@ -104,7 +104,10 @@ function Header({
           platform={platform}
           logoMobile={logoMobile}
         >
-          <div class="fixed w-full z-50 n1-header__desktop">
+          <div
+            class="fixed w-full z-50 n1-header__desktop"
+            style={{ height: headerHeight }}
+          >
             <div
               class={"grid grid-cols-2-auto md:n1-container md:px-[120px] items-center portatil:max-w-[90%] portatil:px-0"}
             >

components/header/Menu.tsx

@@ -51,10 +51,10 @@ function MenuItem({ item }: PropsMenuItem) {
             }
             {existsChildren && item && item.children &&
               item.children.map((node) => {
-                console.log("node -------> ", node);
                 return (
-                  <li>
+                  <li class="mb-[10px]">
                     <a
+                      class="n1-sublink block px-[5px] py-[5px]"
                       href={`${node?.url ? node?.url : "javascript:void(0)"}`}
                       style={{ pointerEvents: `${node?.url ? "all" : "none"}` }}
                     >
@@ -77,7 +77,13 @@ function Menu({ items, whatsapp }: Props) {
       <ul class="flex-grow flex flex-col divide-y divide-neutral-300 ">
         {items.map((item) => {
           return (
-            <li class="pt-[16px]">
+            <li
+              class={`pt-[16px] ${
+                item.name === "Blog" || item.name === "Ferramentas"
+                  ? "hidden"
+                  : ""
+              }`}
+            >
               <a
                 href={`${item?.url ? item?.url : "javascript:void(0)"}`}
                 style={{ pointerEvents: `${item?.url ? "all" : "none"}` }}
@@ -87,7 +93,8 @@ function Menu({ items, whatsapp }: Props) {
             </li>
           );
         })}
-        <Legend nameItemScape={itemLegend} mobile={true} />
+        {/* menu legenda */}
+        {/* <Legend nameItemScape={itemLegend} mobile={true} /> */}
       </ul>
       <div class="n1-menu-mobile__whatsapp w-[90%] mx-auto">
         {whatsapp && (

components/header/Navbar.tsx

@@ -15,6 +15,7 @@ import NavItem from "./NavItem.tsx";
 import { navbarHeight } from "./constants.ts";
 import { Buttons, Logo } from "$store/components/header/Header.tsx";
 import Legend from "$store/components/header/Legend.tsx";
+import { headerHeight } from "./constants.ts";
 
 interface Props {
   items: SiteNavigationElement[];
@@ -75,7 +76,10 @@ function Navbar({
       </div>
 
       {/* Desktop Version */}
-      <div class="hidden lg:grid gap-x-[70px] portatil:gap-x-[20px] lg:grid-cols-2-auto items-center w-full py-6">
+      <div
+        class={`hidden lg:grid gap-x-[70px] portatil:gap-x-[20px] lg:grid-cols-2-auto items-center w-full`}
+        style={{ height: headerHeight ? headerHeight : "" }}
+      >
         <ul
           class={`flex py-[18px] gap-x-[32px] col-span-1 portatil:gap-x-[10px] ${
             logoPosition === "left" ? "justify-between" : "justify-start"
@@ -91,7 +95,8 @@ function Navbar({
             );
           })}
 
-          <Legend nameItemScape={itemLegend} />
+          {/* menu legenda */}
+          {/* <Legend nameItemScape={itemLegend} /> */}
         </ul>
         <div
           class={`flex ${

components/header/constants.ts

@@ -1,3 +1,3 @@
-export const headerHeight = "110px";
+export const headerHeight = "86px";
 
 export const navbarHeight = "75px";

components/ui/CasesComponentDesktop.tsx

@@ -53,6 +53,20 @@ function CasesComponentDesktop({ settingsImage }: Props) {
 
     if (target && target instanceof HTMLElement) {
       const cardElement = target?.closest(".n1-cases-card");
+      const allCardElement = cardElement &&
+        cardElement.parentElement?.getElementsByClassName("n1-cases-card");
+
+      allCardElement && Array.from(allCardElement).forEach((e) => {
+        e?.classList.remove("is-active");
+        e?.setAttribute("style", "width: 300px");
+      });
+      // console.log('cardElement --> ', cardElement?.parentElement?.getElementsByClassName('n1-cases-card'))
+
+      // if(){
+      //   cardElement?.classList.remove('is-active')
+      // }
+      // cardElement?.classList.contains('is-active') ?? cardElement?.classList.remove('is-active');
+
       const bgWidth = cardElement?.querySelector<HTMLElement>(".bg-width")
         ?.dataset.bgwidth;
       const bgWidthHover = cardElement?.querySelector<HTMLElement>(
@@ -196,21 +210,25 @@ function CasesComponentDesktop({ settingsImage }: Props) {
           heightImageBackgroundHover,
           iconHover,
           tagProps,
-        }) => {
+        }, index) => {
           const nameScape = alt?.replaceAll(/\s/g, "-").toLowerCase();
-
           return (
             <>
               <a
                 href={`${href ? href : "javascript:void(0)"}`}
-                class="relative n1-cases-card cursor-grab [transition:all_.375s_linear] md:w-0 mobile:mb-[10px]"
+                class={`relative n1-cases-card ${
+                  index === 0 ? "is-active" : ""
+                } ${
+                  href ? "cursor-pointer" : "cursor-grab"
+                } [transition:all_.375s_linear] md:w-0 mobile:mb-[10px]`}
                 onMouseLeave={handleMouserHover}
                 style={{
                   height: `${
                     heightImageBackgroundHover
                       ? heightImageBackgroundHover + "px"
                       : "500px"
                   }`,
+                  width: index === 0 ? "500px" : "",
                   pointerEvents: `${href ? "all" : "grab"}`,
                 }}
               >
@@ -337,6 +355,9 @@ function CasesComponentDesktop({ settingsImage }: Props) {
                     {imageLogoHover && (
                       <img
                         src={`${imageLogoHover}`}
+                        style={{
+                          width: index === 0 ? widthLogoHover + "px" : "",
+                        }}
                         class="n1-cases-card__logo--hover duration-200 h-auto"
                       />
                     )}

components/ui/CasesComponentMobile.tsx

@@ -68,7 +68,9 @@ function CasesComponentMobile({ settingsImage }: Props) {
                 >
                   <a
                     href={`${href ? href : "javascript:void(0)"}`}
-                    class="relative n1-cases-card cursor-grab h-[342px] w-full [transition:all_.375s_linear]"
+                    class={`relative n1-cases-card ${
+                      href ? "cursor-pointer" : "cursor-grab"
+                    } h-[342px] w-full [transition:all_.375s_linear]`}
                     style={{ pointerEvents: `${href ? "all" : "grab"}` }}
                   >
                     <div

sections/Content/TextWithImage.tsx

@@ -67,6 +67,8 @@ export interface Props {
   /** @title Mostrar pontos */
   /** @description (mostre pontos para navegar pelas imagens) */
   dots?: boolean;
+  /** @title Ocultar Seção toda?*/
+  noneSection?: boolean;
 }
 
 function ImageCarouselItem(
@@ -197,11 +199,15 @@ function Buttons() {
 
 function TextTopWidthCarousel(props: SectionProps<ReturnType<typeof loader>>) {
   const id = useId();
-  const { images, preload, title, texto, textLink, link, device } = props;
+  const { images, preload, title, texto, textLink, link, noneSection, device } =
+    props;
 
   return (
     <>
-      <div id={id} class="relative mobile:pb-[60px]">
+      <div
+        id={id}
+        class={`${noneSection ? "hidden" : ""} relative mobile:pb-[60px]`}
+      >
         <div class=" md:n1-container md:px-[120px] z-10 md:mb-[40px] relative">
           <div class="mobile:my-[24px] mt-[120px] mb-[43px] text-[#ffffff] flex items-center justify-between flex-wrap">
             <div class="mobile:px-[20px]">

tailwind.css

@@ -165,7 +165,7 @@
     padding-left: 5px !important;
     color:  #585858;
     font-family: "Noto Sans";
-    font-size: 14px;
+    font-size: 16px;
     font-style: normal;
     font-weight: 400;
     line-height: 21px;