@greatapps/common 1.1.115 → 1.1.116
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/layouts/AppMobileNavBar.mjs +2 -2
- package/dist/components/layouts/AppMobileNavBar.mjs.map +1 -1
- package/dist/components/layouts/NavBar.mjs +38 -5
- package/dist/components/layouts/NavBar.mjs.map +1 -1
- package/package.json +1 -1
- package/src/components/layouts/AppMobileNavBar.tsx +2 -2
- package/src/components/layouts/NavBar.tsx +28 -7
|
@@ -74,7 +74,7 @@ function AppMobileNavBar({
|
|
|
74
74
|
) : /* @__PURE__ */ jsx(
|
|
75
75
|
"div",
|
|
76
76
|
{
|
|
77
|
-
className: `size-10 flex items-center justify-center rounded-lg transition-colors duration-300 bg-
|
|
77
|
+
className: `size-10 flex items-center justify-center rounded-lg transition-colors duration-300 bg-gray-100 ${onAppIconClick ? "cursor-pointer hover:opacity-80" : ""}`,
|
|
78
78
|
onClick: onAppIconClick,
|
|
79
79
|
children: /* @__PURE__ */ jsx(
|
|
80
80
|
Image,
|
|
@@ -89,7 +89,7 @@ function AppMobileNavBar({
|
|
|
89
89
|
) }),
|
|
90
90
|
/* @__PURE__ */ jsx(TooltipContent, { side: "bottom", children: "GreatPages" })
|
|
91
91
|
] }),
|
|
92
|
-
isGpagesActive && /* @__PURE__ */ jsx("div", { className: "absolute -bottom-[17px] left-1/2 -translate-x-1/2 w-5 h-[3px]
|
|
92
|
+
isGpagesActive && /* @__PURE__ */ jsx("div", { className: "absolute -bottom-[17px] left-1/2 -translate-x-1/2 w-5 h-[3px] rounded-t-xl", style: { backgroundColor: "#6ADCFF" } })
|
|
93
93
|
] }),
|
|
94
94
|
extraLeftSlot
|
|
95
95
|
] }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/layouts/AppMobileNavBar.tsx"],"sourcesContent":["\"use client\";\n\nimport { ReactNode } from \"react\";\nimport Image from \"next/image\";\nimport { ProfilePopover } from \"./ProfilePopover\";\nimport { useAccountModals } from \"../../store/useAccountModals\";\nimport type { ProfileMenuItem } from \"./ProfilePopover\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../ui/overlay/Tooltip\";\n\nexport interface AppMobileNavBarProps {\n /** Which app is currently active — controls which icon gets the indicator */\n activeApp?: \"gapps\" | \"gpages\";\n /** Called when the GreatApps logo is clicked */\n onLogoClick?: () => void;\n /** Called when the app icon (e.g. GreatPages) is clicked */\n onAppIconClick?: () => void;\n /** Extra slot rendered after the app icon (e.g. project selector) */\n extraLeftSlot?: ReactNode;\n /** Required: the right-side action element (toggle button, sheet button, etc.) */\n rightActionSlot: ReactNode;\n menuItems?: ProfileMenuItem[];\n onCreditsClick?: () => void;\n}\n\nexport function AppMobileNavBar({\n activeApp,\n onLogoClick,\n onAppIconClick,\n extraLeftSlot,\n rightActionSlot,\n menuItems = [],\n onCreditsClick,\n}: AppMobileNavBarProps) {\n const { openConfigurations } = useAccountModals();\n\n const isGpagesActive = activeApp === \"gpages\";\n const isGappsActive = activeApp === \"gapps\";\n\n return (\n <div className=\"fixed top-0 left-0 right-0 flex md:hidden items-center justify-between p-4 bg-white z-50 border-b border-gray-200\">\n <div className=\"flex items-center gap-1.5\">\n <Tooltip>\n <TooltipTrigger asChild>\n <div\n className={`relative size-10 flex items-center justify-center rounded-lg transition-colors ${onLogoClick ? \"cursor-pointer hover:bg-gray-100\" : \"\"}`}\n onClick={onLogoClick}\n >\n <Image\n src=\"/icons/great-icon.svg\"\n alt=\"GreatApps\"\n width={28}\n height={28}\n />\n {isGappsActive && (\n <div className=\"absolute bottom-[-17px] left-1/2 -translate-x-1/2 w-5 h-[3px] bg-gray-950 rounded-t-xl\" />\n )}\n </div>\n </TooltipTrigger>\n <TooltipContent side=\"bottom\">GreatApps</TooltipContent>\n </Tooltip>\n <div className=\"relative\">\n <Tooltip>\n <TooltipTrigger asChild>\n {isGpagesActive ? (\n <div\n className=\"size-10 rounded-xl cursor-pointer p-[2px]\"\n style={{\n border: \"1.5px solid rgba(153,234,255,0.75)\",\n background: \"white\",\n boxShadow:\n \"0 0 8px rgba(153,234,255,0.5), 0 0 18px rgba(153,234,255,0.2)\",\n }}\n onClick={onAppIconClick}\n >\n <div\n className=\"w-full h-full rounded-lg flex items-center justify-center\"\n style={{\n background:\n \"radial-gradient(circle at center, rgba(255,255,255,0.95) 0%, rgba(153,234,255,0.45) 100%)\",\n }}\n >\n <Image\n src=\"/icons/icon-navbar.svg\"\n alt=\"GreatPages\"\n width={24}\n height={24}\n />\n </div>\n </div>\n ) : (\n <div\n className={`size-10 flex items-center justify-center rounded-lg transition-colors duration-300 bg-
|
|
1
|
+
{"version":3,"sources":["../../../src/components/layouts/AppMobileNavBar.tsx"],"sourcesContent":["\"use client\";\n\nimport { ReactNode } from \"react\";\nimport Image from \"next/image\";\nimport { ProfilePopover } from \"./ProfilePopover\";\nimport { useAccountModals } from \"../../store/useAccountModals\";\nimport type { ProfileMenuItem } from \"./ProfilePopover\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../ui/overlay/Tooltip\";\n\nexport interface AppMobileNavBarProps {\n /** Which app is currently active — controls which icon gets the indicator */\n activeApp?: \"gapps\" | \"gpages\";\n /** Called when the GreatApps logo is clicked */\n onLogoClick?: () => void;\n /** Called when the app icon (e.g. GreatPages) is clicked */\n onAppIconClick?: () => void;\n /** Extra slot rendered after the app icon (e.g. project selector) */\n extraLeftSlot?: ReactNode;\n /** Required: the right-side action element (toggle button, sheet button, etc.) */\n rightActionSlot: ReactNode;\n menuItems?: ProfileMenuItem[];\n onCreditsClick?: () => void;\n}\n\nexport function AppMobileNavBar({\n activeApp,\n onLogoClick,\n onAppIconClick,\n extraLeftSlot,\n rightActionSlot,\n menuItems = [],\n onCreditsClick,\n}: AppMobileNavBarProps) {\n const { openConfigurations } = useAccountModals();\n\n const isGpagesActive = activeApp === \"gpages\";\n const isGappsActive = activeApp === \"gapps\";\n\n return (\n <div className=\"fixed top-0 left-0 right-0 flex md:hidden items-center justify-between p-4 bg-white z-50 border-b border-gray-200\">\n <div className=\"flex items-center gap-1.5\">\n <Tooltip>\n <TooltipTrigger asChild>\n <div\n className={`relative size-10 flex items-center justify-center rounded-lg transition-colors ${onLogoClick ? \"cursor-pointer hover:bg-gray-100\" : \"\"}`}\n onClick={onLogoClick}\n >\n <Image\n src=\"/icons/great-icon.svg\"\n alt=\"GreatApps\"\n width={28}\n height={28}\n />\n {isGappsActive && (\n <div className=\"absolute bottom-[-17px] left-1/2 -translate-x-1/2 w-5 h-[3px] bg-gray-950 rounded-t-xl\" />\n )}\n </div>\n </TooltipTrigger>\n <TooltipContent side=\"bottom\">GreatApps</TooltipContent>\n </Tooltip>\n <div className=\"relative\">\n <Tooltip>\n <TooltipTrigger asChild>\n {isGpagesActive ? (\n <div\n className=\"size-10 rounded-xl cursor-pointer p-[2px]\"\n style={{\n border: \"1.5px solid rgba(153,234,255,0.75)\",\n background: \"white\",\n boxShadow:\n \"0 0 8px rgba(153,234,255,0.5), 0 0 18px rgba(153,234,255,0.2)\",\n }}\n onClick={onAppIconClick}\n >\n <div\n className=\"w-full h-full rounded-lg flex items-center justify-center\"\n style={{\n background:\n \"radial-gradient(circle at center, rgba(255,255,255,0.95) 0%, rgba(153,234,255,0.45) 100%)\",\n }}\n >\n <Image\n src=\"/icons/icon-navbar.svg\"\n alt=\"GreatPages\"\n width={24}\n height={24}\n />\n </div>\n </div>\n ) : (\n <div\n className={`size-10 flex items-center justify-center rounded-lg transition-colors duration-300 bg-gray-100 ${onAppIconClick ? \"cursor-pointer hover:opacity-80\" : \"\"}`}\n onClick={onAppIconClick}\n >\n <Image\n src=\"/icons/icon-navbar.svg\"\n alt=\"GreatPages\"\n width={24}\n height={24}\n />\n </div>\n )}\n </TooltipTrigger>\n <TooltipContent side=\"bottom\">GreatPages</TooltipContent>\n </Tooltip>\n {isGpagesActive && (\n <div className=\"absolute -bottom-[17px] left-1/2 -translate-x-1/2 w-5 h-[3px] rounded-t-xl\" style={{ backgroundColor: \"#6ADCFF\" }} />\n )}\n </div>\n {extraLeftSlot}\n </div>\n <div className=\"flex items-center gap-1.5\">\n <ProfilePopover\n side=\"bottom\"\n align=\"end\"\n contentClassName=\"\"\n onEditProfile={() => openConfigurations()}\n onCreditsClick={onCreditsClick}\n menuItems={menuItems}\n />\n {rightActionSlot}\n </div>\n </div>\n );\n}\n"],"mappings":";AA2CY,SAIE,KAJF;AAxCZ,OAAO,WAAW;AAClB,SAAS,sBAAsB;AAC/B,SAAS,wBAAwB;AAEjC,SAAS,SAAS,gBAAgB,sBAAsB;AAiBjD,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY,CAAC;AAAA,EACb;AACF,GAAyB;AACvB,QAAM,EAAE,mBAAmB,IAAI,iBAAiB;AAEhD,QAAM,iBAAiB,cAAc;AACrC,QAAM,gBAAgB,cAAc;AAEpC,SACE,qBAAC,SAAI,WAAU,qHACb;AAAA,yBAAC,SAAI,WAAU,6BACb;AAAA,2BAAC,WACC;AAAA,4BAAC,kBAAe,SAAO,MACrB;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,kFAAkF,cAAc,qCAAqC,EAAE;AAAA,YAClJ,SAAS;AAAA,YAET;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,KAAI;AAAA,kBACJ,KAAI;AAAA,kBACJ,OAAO;AAAA,kBACP,QAAQ;AAAA;AAAA,cACV;AAAA,cACC,iBACC,oBAAC,SAAI,WAAU,0FAAyF;AAAA;AAAA;AAAA,QAE5G,GACF;AAAA,QACA,oBAAC,kBAAe,MAAK,UAAS,uBAAS;AAAA,SACzC;AAAA,MACA,qBAAC,SAAI,WAAU,YACb;AAAA,6BAAC,WACC;AAAA,8BAAC,kBAAe,SAAO,MACpB,2BACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAO;AAAA,gBACL,QAAQ;AAAA,gBACR,YAAY;AAAA,gBACZ,WACE;AAAA,cACJ;AAAA,cACA,SAAS;AAAA,cAET;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAU;AAAA,kBACV,OAAO;AAAA,oBACL,YACE;AAAA,kBACJ;AAAA,kBAEA;AAAA,oBAAC;AAAA;AAAA,sBACC,KAAI;AAAA,sBACJ,KAAI;AAAA,sBACJ,OAAO;AAAA,sBACP,QAAQ;AAAA;AAAA,kBACV;AAAA;AAAA,cACF;AAAA;AAAA,UACF,IAEA;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,kGAAkG,iBAAiB,oCAAoC,EAAE;AAAA,cACpK,SAAS;AAAA,cAET;AAAA,gBAAC;AAAA;AAAA,kBACC,KAAI;AAAA,kBACJ,KAAI;AAAA,kBACJ,OAAO;AAAA,kBACP,QAAQ;AAAA;AAAA,cACV;AAAA;AAAA,UACF,GAEJ;AAAA,UACA,oBAAC,kBAAe,MAAK,UAAS,wBAAU;AAAA,WAC1C;AAAA,QACC,kBACC,oBAAC,SAAI,WAAU,8EAA6E,OAAO,EAAE,iBAAiB,UAAU,GAAG;AAAA,SAEvI;AAAA,MACC;AAAA,OACH;AAAA,IACA,qBAAC,SAAI,WAAU,6BACb;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,OAAM;AAAA,UACN,kBAAiB;AAAA,UACjB,eAAe,MAAM,mBAAmB;AAAA,UACxC;AAAA,UACA;AAAA;AAAA,MACF;AAAA,MACC;AAAA,OACH;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -25,7 +25,23 @@ function NavBar({
|
|
|
25
25
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 items-center mt-[6.5px]", children: [
|
|
26
26
|
/* @__PURE__ */ jsxs("div", { className: "relative", children: [
|
|
27
27
|
/* @__PURE__ */ jsxs(Tooltip, { children: [
|
|
28
|
-
/* @__PURE__ */ jsx(
|
|
28
|
+
/* @__PURE__ */ jsx(
|
|
29
|
+
TooltipTrigger,
|
|
30
|
+
{
|
|
31
|
+
className: "cursor-pointer",
|
|
32
|
+
asChild: true,
|
|
33
|
+
onClick: onLogoClick,
|
|
34
|
+
children: /* @__PURE__ */ jsx(
|
|
35
|
+
Image,
|
|
36
|
+
{
|
|
37
|
+
src: "/icons/great-icon.svg",
|
|
38
|
+
alt: "Great Icon",
|
|
39
|
+
width: 28,
|
|
40
|
+
height: 28
|
|
41
|
+
}
|
|
42
|
+
)
|
|
43
|
+
}
|
|
44
|
+
),
|
|
29
45
|
/* @__PURE__ */ jsx(TooltipContent, { side: "right", children: "GreatApps" })
|
|
30
46
|
] }),
|
|
31
47
|
/* @__PURE__ */ jsx(
|
|
@@ -70,20 +86,37 @@ function NavBar({
|
|
|
70
86
|
style: {
|
|
71
87
|
background: "radial-gradient(circle at center, rgba(255,255,255,0.95) 0%, rgba(153,234,255,0.45) 100%)"
|
|
72
88
|
},
|
|
73
|
-
children: /* @__PURE__ */ jsx(
|
|
89
|
+
children: /* @__PURE__ */ jsx(
|
|
90
|
+
Image,
|
|
91
|
+
{
|
|
92
|
+
src: "/icons/icon-navbar.svg",
|
|
93
|
+
alt: "GreatPages",
|
|
94
|
+
width: 24,
|
|
95
|
+
height: 24
|
|
96
|
+
}
|
|
97
|
+
)
|
|
74
98
|
}
|
|
75
99
|
)
|
|
76
100
|
}
|
|
77
|
-
) : /* @__PURE__ */ jsx("div", { className: "size-10 flex items-center justify-center rounded-lg cursor-pointer hover:bg-
|
|
101
|
+
) : /* @__PURE__ */ jsx("div", { className: "size-10 flex items-center justify-center rounded-lg cursor-pointer hover:bg-gray-100 transition-colors duration-300", children: /* @__PURE__ */ jsx(
|
|
102
|
+
Image,
|
|
103
|
+
{
|
|
104
|
+
src: "/icons/icon-navbar.svg",
|
|
105
|
+
alt: "GreatPages",
|
|
106
|
+
width: 28,
|
|
107
|
+
height: 28
|
|
108
|
+
}
|
|
109
|
+
) }) }),
|
|
78
110
|
/* @__PURE__ */ jsx(TooltipContent, { side: "right", children: "GreatPages" })
|
|
79
111
|
] }),
|
|
80
112
|
/* @__PURE__ */ jsx(
|
|
81
113
|
"div",
|
|
82
114
|
{
|
|
83
115
|
className: cn(
|
|
84
|
-
"absolute -left-
|
|
116
|
+
"absolute -left-[22px] top-1/2 -translate-y-1/2 w-[3px] h-5 rounded-r-xl transition-opacity duration-300",
|
|
85
117
|
activeApp === "gpages" ? "opacity-100" : "opacity-0"
|
|
86
|
-
)
|
|
118
|
+
),
|
|
119
|
+
style: { backgroundColor: "#6ADCFF" }
|
|
87
120
|
}
|
|
88
121
|
)
|
|
89
122
|
] }) })
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/layouts/NavBar.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport Image from \"next/image\";\nimport { ChevronRight } from \"lucide-react\";\nimport { Separator } from \"../ui/data-display/Separator\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../ui/overlay/Tooltip\";\nimport { cn } from \"../../infra/utils/clsx\";\n\ntype NavBarProps = {\n onLogoClick: () => void;\n onAppIconClick?: () => void;\n activeApp?: \"gapps\" | \"gpages\";\n showExpandButton?: boolean;\n onExpandClick?: () => void;\n children?: React.ReactNode;\n className?: string;\n};\n\nfunction NavBar({\n onLogoClick,\n onAppIconClick,\n activeApp,\n showExpandButton = false,\n onExpandClick,\n children,\n className,\n}: NavBarProps) {\n return (\n <div\n className={cn(\n \"hidden md:flex flex-col justify-between h-screen p-4 border-r border-gray-200 overflow-visible z-40 bg-white\",\n className,\n )}\n >\n <div className=\"flex flex-col gap-4 items-center mt-[6.5px]\">\n {/* GreatApps logo */}\n <div className=\"relative\">\n <Tooltip>\n <TooltipTrigger
|
|
1
|
+
{"version":3,"sources":["../../../src/components/layouts/NavBar.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport Image from \"next/image\";\nimport { ChevronRight } from \"lucide-react\";\nimport { Separator } from \"../ui/data-display/Separator\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../ui/overlay/Tooltip\";\nimport { cn } from \"../../infra/utils/clsx\";\n\ntype NavBarProps = {\n onLogoClick: () => void;\n onAppIconClick?: () => void;\n activeApp?: \"gapps\" | \"gpages\";\n showExpandButton?: boolean;\n onExpandClick?: () => void;\n children?: React.ReactNode;\n className?: string;\n};\n\nfunction NavBar({\n onLogoClick,\n onAppIconClick,\n activeApp,\n showExpandButton = false,\n onExpandClick,\n children,\n className,\n}: NavBarProps) {\n return (\n <div\n className={cn(\n \"hidden md:flex flex-col justify-between h-screen p-4 border-r border-gray-200 overflow-visible z-40 bg-white\",\n className,\n )}\n >\n <div className=\"flex flex-col gap-4 items-center mt-[6.5px]\">\n {/* GreatApps logo */}\n <div className=\"relative\">\n <Tooltip>\n <TooltipTrigger\n className=\"cursor-pointer\"\n asChild\n onClick={onLogoClick}\n >\n <Image\n src=\"/icons/great-icon.svg\"\n alt=\"Great Icon\"\n width={28}\n height={28}\n />\n </TooltipTrigger>\n <TooltipContent side=\"right\">GreatApps</TooltipContent>\n </Tooltip>\n <div\n className={cn(\n \"absolute -left-[22px] top-1/2 -translate-y-1/2 w-[3px] h-5 bg-gray-950 rounded-r-xl transition-opacity duration-300\",\n activeApp === \"gapps\" ? \"opacity-100\" : \"opacity-0\",\n )}\n />\n </div>\n\n <div className=\"relative w-full mt-[7.5px]\">\n <Separator />\n {showExpandButton && (\n <Tooltip>\n <TooltipTrigger asChild>\n <button\n onClick={onExpandClick}\n className=\"lg:hidden absolute top-1/2 -translate-y-1/2 right-0 translate-x-[calc(50%+1rem)] size-8 flex items-center justify-center rounded-full border border-gray-200 bg-white hover:bg-gray-100 cursor-pointer transition-colors z-10\"\n >\n <ChevronRight size={16} className=\"text-gray-500\" />\n </button>\n </TooltipTrigger>\n <TooltipContent side=\"right\">Expandir menu</TooltipContent>\n </Tooltip>\n )}\n </div>\n\n {/* GreatPages icon */}\n <div className=\"flex flex-col gap-2\">\n <div className=\"relative\">\n <Tooltip>\n <TooltipTrigger asChild onClick={onAppIconClick}>\n {activeApp === \"gpages\" ? (\n <div\n className=\"size-10 rounded-xl cursor-pointer p-[2px]\"\n style={{\n border: \"1.5px solid rgba(153,234,255,0.75)\",\n background: \"white\",\n boxShadow:\n \"0 0 8px rgba(153,234,255,0.5), 0 0 18px rgba(153,234,255,0.2)\",\n }}\n >\n <div\n className=\"w-full h-full rounded-lg flex items-center justify-center\"\n style={{\n background:\n \"radial-gradient(circle at center, rgba(255,255,255,0.95) 0%, rgba(153,234,255,0.45) 100%)\",\n }}\n >\n <Image\n src=\"/icons/icon-navbar.svg\"\n alt=\"GreatPages\"\n width={24}\n height={24}\n />\n </div>\n </div>\n ) : (\n <div className=\"size-10 flex items-center justify-center rounded-lg cursor-pointer hover:bg-gray-100 transition-colors duration-300\">\n <Image\n src=\"/icons/icon-navbar.svg\"\n alt=\"GreatPages\"\n width={28}\n height={28}\n />\n </div>\n )}\n </TooltipTrigger>\n <TooltipContent side=\"right\">GreatPages</TooltipContent>\n </Tooltip>\n <div\n className={cn(\n \"absolute -left-[22px] top-1/2 -translate-y-1/2 w-[3px] h-5 rounded-r-xl transition-opacity duration-300\",\n activeApp === \"gpages\" ? \"opacity-100\" : \"opacity-0\",\n )}\n style={{ backgroundColor: \"#6ADCFF\" }}\n />\n </div>\n </div>\n </div>\n\n <div className=\"flex flex-col items-center gap-2\">{children}</div>\n </div>\n );\n}\n\nexport { NavBar };\nexport type { NavBarProps };\n"],"mappings":";AAsCU,SAMI,KANJ;AAnCV,OAAO,WAAW;AAClB,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAC1B,SAAS,SAAS,gBAAgB,sBAAsB;AACxD,SAAS,UAAU;AAYnB,SAAS,OAAO;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AACF,GAAgB;AACd,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEA;AAAA,6BAAC,SAAI,WAAU,+CAEb;AAAA,+BAAC,SAAI,WAAU,YACb;AAAA,iCAAC,WACC;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAU;AAAA,kBACV,SAAO;AAAA,kBACP,SAAS;AAAA,kBAET;AAAA,oBAAC;AAAA;AAAA,sBACC,KAAI;AAAA,sBACJ,KAAI;AAAA,sBACJ,OAAO;AAAA,sBACP,QAAQ;AAAA;AAAA,kBACV;AAAA;AAAA,cACF;AAAA,cACA,oBAAC,kBAAe,MAAK,SAAQ,uBAAS;AAAA,eACxC;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW;AAAA,kBACT;AAAA,kBACA,cAAc,UAAU,gBAAgB;AAAA,gBAC1C;AAAA;AAAA,YACF;AAAA,aACF;AAAA,UAEA,qBAAC,SAAI,WAAU,8BACb;AAAA,gCAAC,aAAU;AAAA,YACV,oBACC,qBAAC,WACC;AAAA,kCAAC,kBAAe,SAAO,MACrB;AAAA,gBAAC;AAAA;AAAA,kBACC,SAAS;AAAA,kBACT,WAAU;AAAA,kBAEV,8BAAC,gBAAa,MAAM,IAAI,WAAU,iBAAgB;AAAA;AAAA,cACpD,GACF;AAAA,cACA,oBAAC,kBAAe,MAAK,SAAQ,2BAAa;AAAA,eAC5C;AAAA,aAEJ;AAAA,UAGA,oBAAC,SAAI,WAAU,uBACb,+BAAC,SAAI,WAAU,YACb;AAAA,iCAAC,WACC;AAAA,kCAAC,kBAAe,SAAO,MAAC,SAAS,gBAC9B,wBAAc,WACb;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAU;AAAA,kBACV,OAAO;AAAA,oBACL,QAAQ;AAAA,oBACR,YAAY;AAAA,oBACZ,WACE;AAAA,kBACJ;AAAA,kBAEA;AAAA,oBAAC;AAAA;AAAA,sBACC,WAAU;AAAA,sBACV,OAAO;AAAA,wBACL,YACE;AAAA,sBACJ;AAAA,sBAEA;AAAA,wBAAC;AAAA;AAAA,0BACC,KAAI;AAAA,0BACJ,KAAI;AAAA,0BACJ,OAAO;AAAA,0BACP,QAAQ;AAAA;AAAA,sBACV;AAAA;AAAA,kBACF;AAAA;AAAA,cACF,IAEA,oBAAC,SAAI,WAAU,uHACb;AAAA,gBAAC;AAAA;AAAA,kBACC,KAAI;AAAA,kBACJ,KAAI;AAAA,kBACJ,OAAO;AAAA,kBACP,QAAQ;AAAA;AAAA,cACV,GACF,GAEJ;AAAA,cACA,oBAAC,kBAAe,MAAK,SAAQ,wBAAU;AAAA,eACzC;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW;AAAA,kBACT;AAAA,kBACA,cAAc,WAAW,gBAAgB;AAAA,gBAC3C;AAAA,gBACA,OAAO,EAAE,iBAAiB,UAAU;AAAA;AAAA,YACtC;AAAA,aACF,GACF;AAAA,WACF;AAAA,QAEA,oBAAC,SAAI,WAAU,oCAAoC,UAAS;AAAA;AAAA;AAAA,EAC9D;AAEJ;","names":[]}
|
package/package.json
CHANGED
|
@@ -89,7 +89,7 @@ export function AppMobileNavBar({
|
|
|
89
89
|
</div>
|
|
90
90
|
) : (
|
|
91
91
|
<div
|
|
92
|
-
className={`size-10 flex items-center justify-center rounded-lg transition-colors duration-300 bg-
|
|
92
|
+
className={`size-10 flex items-center justify-center rounded-lg transition-colors duration-300 bg-gray-100 ${onAppIconClick ? "cursor-pointer hover:opacity-80" : ""}`}
|
|
93
93
|
onClick={onAppIconClick}
|
|
94
94
|
>
|
|
95
95
|
<Image
|
|
@@ -104,7 +104,7 @@ export function AppMobileNavBar({
|
|
|
104
104
|
<TooltipContent side="bottom">GreatPages</TooltipContent>
|
|
105
105
|
</Tooltip>
|
|
106
106
|
{isGpagesActive && (
|
|
107
|
-
<div className="absolute -bottom-[17px] left-1/2 -translate-x-1/2 w-5 h-[3px]
|
|
107
|
+
<div className="absolute -bottom-[17px] left-1/2 -translate-x-1/2 w-5 h-[3px] rounded-t-xl" style={{ backgroundColor: "#6ADCFF" }} />
|
|
108
108
|
)}
|
|
109
109
|
</div>
|
|
110
110
|
{extraLeftSlot}
|
|
@@ -37,8 +37,17 @@ function NavBar({
|
|
|
37
37
|
{/* GreatApps logo */}
|
|
38
38
|
<div className="relative">
|
|
39
39
|
<Tooltip>
|
|
40
|
-
<TooltipTrigger
|
|
41
|
-
|
|
40
|
+
<TooltipTrigger
|
|
41
|
+
className="cursor-pointer"
|
|
42
|
+
asChild
|
|
43
|
+
onClick={onLogoClick}
|
|
44
|
+
>
|
|
45
|
+
<Image
|
|
46
|
+
src="/icons/great-icon.svg"
|
|
47
|
+
alt="Great Icon"
|
|
48
|
+
width={28}
|
|
49
|
+
height={28}
|
|
50
|
+
/>
|
|
42
51
|
</TooltipTrigger>
|
|
43
52
|
<TooltipContent side="right">GreatApps</TooltipContent>
|
|
44
53
|
</Tooltip>
|
|
@@ -78,7 +87,8 @@ function NavBar({
|
|
|
78
87
|
style={{
|
|
79
88
|
border: "1.5px solid rgba(153,234,255,0.75)",
|
|
80
89
|
background: "white",
|
|
81
|
-
boxShadow:
|
|
90
|
+
boxShadow:
|
|
91
|
+
"0 0 8px rgba(153,234,255,0.5), 0 0 18px rgba(153,234,255,0.2)",
|
|
82
92
|
}}
|
|
83
93
|
>
|
|
84
94
|
<div
|
|
@@ -88,12 +98,22 @@ function NavBar({
|
|
|
88
98
|
"radial-gradient(circle at center, rgba(255,255,255,0.95) 0%, rgba(153,234,255,0.45) 100%)",
|
|
89
99
|
}}
|
|
90
100
|
>
|
|
91
|
-
<Image
|
|
101
|
+
<Image
|
|
102
|
+
src="/icons/icon-navbar.svg"
|
|
103
|
+
alt="GreatPages"
|
|
104
|
+
width={24}
|
|
105
|
+
height={24}
|
|
106
|
+
/>
|
|
92
107
|
</div>
|
|
93
108
|
</div>
|
|
94
109
|
) : (
|
|
95
|
-
<div className="size-10 flex items-center justify-center rounded-lg cursor-pointer hover:bg-
|
|
96
|
-
<Image
|
|
110
|
+
<div className="size-10 flex items-center justify-center rounded-lg cursor-pointer hover:bg-gray-100 transition-colors duration-300">
|
|
111
|
+
<Image
|
|
112
|
+
src="/icons/icon-navbar.svg"
|
|
113
|
+
alt="GreatPages"
|
|
114
|
+
width={28}
|
|
115
|
+
height={28}
|
|
116
|
+
/>
|
|
97
117
|
</div>
|
|
98
118
|
)}
|
|
99
119
|
</TooltipTrigger>
|
|
@@ -101,9 +121,10 @@ function NavBar({
|
|
|
101
121
|
</Tooltip>
|
|
102
122
|
<div
|
|
103
123
|
className={cn(
|
|
104
|
-
"absolute -left-
|
|
124
|
+
"absolute -left-[22px] top-1/2 -translate-y-1/2 w-[3px] h-5 rounded-r-xl transition-opacity duration-300",
|
|
105
125
|
activeApp === "gpages" ? "opacity-100" : "opacity-0",
|
|
106
126
|
)}
|
|
127
|
+
style={{ backgroundColor: "#6ADCFF" }}
|
|
107
128
|
/>
|
|
108
129
|
</div>
|
|
109
130
|
</div>
|