Merge version_13_1777217249800 into main #11

Merged
bender merged 2 commits from version_13_1777217249800 into main 2026-04-26 15:29:47 +00:00
2 changed files with 103 additions and 96 deletions

View File

@@ -1,89 +1,92 @@
import FooterSimple from '@/components/sections/footer/FooterSimple';
import NavbarCentered from '@/components/ui/NavbarCentered';
import { Outlet } from 'react-router-dom';
import { Outlet } from "react-router-dom";
import NavbarCentered from "@/components/ui/NavbarCentered";
import FooterSimple from "@/components/sections/footer/FooterSimple";
export default function Layout() {
const navItems = [
{
"name": "About",
"href": "#about"
},
{
"name": "Features",
"href": "#features"
},
{
"name": "Products",
"href": "#products"
},
{
"name": "Pricing",
"href": "#pricing"
}
];
{
name: "About",
href: "#about",
},
{
name: "Features",
href: "#features",
},
{
name: "Products",
href: "#products",
},
{
name: "Pricing",
href: "#pricing",
},
];
return (
<>
<NavbarCentered
logo="EmotioSaaS"
ctaButton={{
text: "Get Started",
href: "#contact",
}}
navItems={navItems} />
<div className="flex flex-col min-h-screen">
<header className="sticky top-0 w-full z-50 bg-[var(--background)] shadow-md">
<NavbarCentered
logo="EmotioSaaS"
ctaButton={{
text: "Get Started",
href: "#contact",
}}
navItems={navItems}
/>
</header>
<main className="flex-grow">
<Outlet />
</main>
<FooterSimple
brand="EmotioSaaS"
columns={[
{
title: "Platform",
items: [
{
label: "Marketplace",
href: "#products",
},
{
label: "Pricing",
href: "#pricing",
},
{
label: "Security",
href: "#",
},
],
},
{
title: "Company",
items: [
{
label: "About",
href: "#about",
},
{
label: "Careers",
href: "#",
},
{
label: "Contact",
href: "#contact",
},
],
},
]}
copyright="© 2024 EmotioSaaS Inc. All rights reserved."
links={[
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
]}
/>
</>
brand="EmotioSaaS"
columns={[
{
title: "Platform",
items: [
{
label: "Marketplace",
href: "#products",
},
{
label: "Pricing",
href: "#pricing",
},
{
label: "Security",
href: "#",
},
],
},
{
title: "Company",
items: [
{
label: "About",
href: "#about",
},
{
label: "Careers",
href: "#",
},
{
label: "Contact",
href: "#contact",
},
],
},
]}
copyright="© 2024 EmotioSaaS Inc. All rights reserved."
links={[
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
]}
/>
</div>
);
}
}

View File

@@ -5,13 +5,13 @@
:root {
/* @colorThemes/lightTheme/magento */
--background: #ffffff;
--card: #f5f5f5;
--foreground: #333333;
--primary-cta: #f26322;
--background: #F8F8F8;
--card: #ffffff;
--foreground: #2C2C2C;
--primary-cta: #EF6C00;
--primary-cta-text: #ffffff;
--secondary-cta: #ffffff;
--secondary-cta-text: #f26322;
--secondary-cta-text: #EF6C00;
--accent: #e0e0e0;
--background-accent: #cccccc;
@@ -160,26 +160,30 @@ h6 {
}
/* WEBILD_PRIMARY_BUTTON */
/* @primaryButtons/radial-glow */
/* @primaryButtons/solid */
.primary-button {
background:
radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--color-background) 32.5%, transparent) 0%, transparent 45%),
radial-gradient(circle at 100% 100%, color-mix(in srgb, var(--color-background) 32.5%, transparent) 0%, transparent 45%),
var(--color-primary-cta);
box-shadow: 2.10837px 3.16256px 9.48767px color-mix(in srgb, var(--color-accent) 30%, transparent);
background-color: var(--color-primary-cta);
color: var(--color-primary-cta-text);
}
/* WEBILD_SECONDARY_BUTTON */
/* @secondaryButtons/radial-glow */
/* @secondaryButtons/outline */
.secondary-button {
background:
radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--color-accent) 15%, transparent) 0%, transparent 40%),
radial-gradient(circle at 100% 100%, color-mix(in srgb, var(--color-accent) 15%, transparent) 0%, transparent 40%),
var(--color-secondary-cta);
box-shadow: 2.10837px 3.16256px 9.48767px color-mix(in srgb, var(--color-accent) 10%, transparent);
background-color: var(--color-secondary-cta);
color: var(--color-secondary-cta-text);
border: 1px solid var(--color-primary-cta);
}
@layer utilities {
.hover-lift {
transition-property: all;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 200ms;
}
.hover-lift:hover {
transform: translateY(-0.25rem);
box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
}
.perspective-1000 {
perspective: 1000px;
}