mirror of
https://github.com/Hestia-Homes/assessment-model.git
synced 2026-06-30 12:55:02 +00:00
Merge pull request #22 from Hestia-Homes/main
Adding new visuals to dev version of app
This commit is contained in:
KhalimCK
GitHub
commit
05f13db1c4
18 changed files with 6083 additions and 75 deletions
11
package-lock.json
generated
11
package-lock.json
generated
|
|
@ -39,6 +39,7 @@
|
|||
"next": "13.4.3",
|
||||
"next-auth": "^4.22.1",
|
||||
"next-axiom": "^0.17.0",
|
||||
"next-themes": "^0.3.0",
|
||||
"pg": "^8.11.1",
|
||||
"postcss": "8.4.23",
|
||||
"react": "18.2.0",
|
||||
|
|
@ -7334,6 +7335,16 @@
|
|||
"next": "^12.1.4 || ^13"
|
||||
}
|
||||
},
|
||||
"node_modules/next-themes": {
|
||||
"version": "0.3.0",
|
||||
"resolved": "https://registry.npmjs.org/next-themes/-/next-themes-0.3.0.tgz",
|
||||
"integrity": "sha512-/QHIrsYpd6Kfk7xakK4svpDI5mmXP0gfvCoJdGpZQ2TOrQZmsW0QxjaiLn8wbIKjtm4BTSqLoix4lxYYOnLJ/w==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"react": "^16.8 || ^17 || ^18",
|
||||
"react-dom": "^16.8 || ^17 || ^18"
|
||||
}
|
||||
},
|
||||
"node_modules/next-tick": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.1.0.tgz",
|
||||
|
|
|
|||
|
|
@ -45,6 +45,7 @@
|
|||
"next": "13.4.3",
|
||||
"next-auth": "^4.22.1",
|
||||
"next-axiom": "^0.17.0",
|
||||
"next-themes": "^0.3.0",
|
||||
"pg": "^8.11.1",
|
||||
"postcss": "8.4.23",
|
||||
"react": "18.2.0",
|
||||
|
|
|
|||
|
|
@ -1,36 +1,36 @@
|
|||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
viewBox="0 0 511.999 511.999" xml:space="preserve">
|
||||
<path style="fill:#DBE9FD;" d="M416.044,189.217H95.957l-40.304,40.304v22.261v232.391c0,9.223,7.473,16.696,16.696,16.696h367.304
|
||||
c9.223,0,16.696-7.473,16.696-16.696V229.522L416.044,189.217z"/>
|
||||
<path style="fill:#C5DCFD;" d="M416.044,189.217H256v311.652h183.652c9.223,0,16.696-7.473,16.696-16.696V229.522L416.044,189.217z"
|
||||
/>
|
||||
<polygon style="fill:#B1C6E4;" points="89.044,467.478 89.044,243.353 89.044,222.609 422.957,222.609 422.957,243.353
|
||||
422.957,467.478 "/>
|
||||
<polygon style="fill:#9DB0CA;" points="256,467.478 422.957,467.478 422.957,243.353 422.957,222.609 256,222.609 "/>
|
||||
<path style="fill:#875334;" d="M456.348,211.478L356.174,111.304V94.609c0-9.22,7.475-16.696,16.696-16.696h66.783
|
||||
c9.22,0,16.696,7.475,16.696,16.696V211.478z"/>
|
||||
<polygon style="fill:#DBE9FD;" points="427.174,200.348 256,29.174 84.826,200.348 "/>
|
||||
<polygon style="fill:#C5DCFD;" points="427.174,200.348 256,29.174 256,200.348 "/>
|
||||
<path style="fill:#FF6243;" d="M495.305,283.826c-4.272,0-8.544-1.631-11.804-4.892L256,51.435L28.5,278.934
|
||||
c-6.521,6.521-17.087,6.521-23.609,0c-6.521-6.516-6.521-17.092,0-23.609L244.195,16.021c6.521-6.521,17.087-6.521,23.609,0
|
||||
l239.304,239.304c6.521,6.516,6.521,17.092,0,23.609C503.848,282.195,499.576,283.826,495.305,283.826z"/>
|
||||
<g>
|
||||
<path style="fill:#FF3501;" d="M267.804,16.022c-3.26-3.261-7.532-4.892-11.804-4.892v40.304l227.501,227.501
|
||||
c3.261,3.261,7.533,4.892,11.804,4.892s8.544-1.631,11.804-4.892c6.521-6.516,6.521-17.092,0-23.609L267.804,16.022z"/>
|
||||
<rect x="289.392" y="222.609" style="fill:#FF3501;" width="33.391" height="111.304"/>
|
||||
<rect x="356.174" y="222.609" style="fill:#FF3501;" width="33.391" height="111.304"/>
|
||||
<rect x="289.392" y="267.13" style="fill:#FF3501;" width="100.174" height="33.391"/>
|
||||
</g>
|
||||
<rect x="155.826" y="222.609" style="fill:#ECEFF0;" width="33.391" height="111.304"/>
|
||||
<g>
|
||||
<rect x="122.435" y="367.304" style="fill:#FF6243;" width="33.391" height="100.174"/>
|
||||
<rect x="189.218" y="367.304" style="fill:#FF6243;" width="33.391" height="100.174"/>
|
||||
<rect x="122.435" y="400.696" style="fill:#FF6243;" width="100.174" height="33.391"/>
|
||||
</g>
|
||||
<rect x="256" y="367.304" style="fill:#DADFE4;" width="33.391" height="100.174"/>
|
||||
<path style="fill:#60AED5;" d="M356.174,467.478h-66.783v-66.783h50.087c9.22,0,16.696,7.475,16.696,16.696V467.478z"/>
|
||||
<rect x="55.652" y="333.913" style="fill:#DBE9FD;" width="400.696" height="33.391"/>
|
||||
<rect x="256" y="333.913" style="fill:#C5DCFD;" width="200.348" height="33.391"/>
|
||||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
viewBox="0 0 511.999 511.999" xml:space="preserve">
|
||||
<path style="fill:#DBE9FD;" d="M416.044,189.217H95.957l-40.304,40.304v22.261v232.391c0,9.223,7.473,16.696,16.696,16.696h367.304
|
||||
c9.223,0,16.696-7.473,16.696-16.696V229.522L416.044,189.217z"/>
|
||||
<path style="fill:#C5DCFD;" d="M416.044,189.217H256v311.652h183.652c9.223,0,16.696-7.473,16.696-16.696V229.522L416.044,189.217z"
|
||||
/>
|
||||
<polygon style="fill:#B1C6E4;" points="89.044,467.478 89.044,243.353 89.044,222.609 422.957,222.609 422.957,243.353
|
||||
422.957,467.478 "/>
|
||||
<polygon style="fill:#9DB0CA;" points="256,467.478 422.957,467.478 422.957,243.353 422.957,222.609 256,222.609 "/>
|
||||
<path style="fill:#d3b488;" d="M456.348,211.478L356.174,111.304V94.609c0-9.22,7.475-16.696,16.696-16.696h66.783
|
||||
c9.22,0,16.696,7.475,16.696,16.696V211.478z"/>
|
||||
<polygon style="fill:#DBE9FD;" points="427.174,200.348 256,29.174 84.826,200.348 "/>
|
||||
<polygon style="fill:#C5DCFD;" points="427.174,200.348 256,29.174 256,200.348 "/>
|
||||
<path style="fill:#3943b7;" d="M495.305,283.826c-4.272,0-8.544-1.631-11.804-4.892L256,51.435L28.5,278.934
|
||||
c-6.521,6.521-17.087,6.521-23.609,0c-6.521-6.516-6.521-17.092,0-23.609L244.195,16.021c6.521-6.521,17.087-6.521,23.609,0
|
||||
l239.304,239.304c6.521,6.516,6.521,17.092,0,23.609C503.848,282.195,499.576,283.826,495.305,283.826z"/>
|
||||
<g>
|
||||
<path style="fill:#14163d;" d="M267.804,16.022c-3.26-3.261-7.532-4.892-11.804-4.892v40.304l227.501,227.501
|
||||
c3.261,3.261,7.533,4.892,11.804,4.892s8.544-1.631,11.804-4.892c6.521-6.516,6.521-17.092,0-23.609L267.804,16.022z"/>
|
||||
<rect x="289.392" y="222.609" style="fill:#14163d;" width="33.391" height="111.304"/>
|
||||
<rect x="356.174" y="222.609" style="fill:#14163d;" width="33.391" height="111.304"/>
|
||||
<rect x="289.392" y="267.13" style="fill:#14163d;" width="100.174" height="33.391"/>
|
||||
</g>
|
||||
<rect x="155.826" y="222.609" style="fill:#ECEFF0;" width="33.391" height="111.304"/>
|
||||
<g>
|
||||
<rect x="122.435" y="367.304" style="fill:#3943b7;" width="33.391" height="100.174"/>
|
||||
<rect x="189.218" y="367.304" style="fill:#3943b7;" width="33.391" height="100.174"/>
|
||||
<rect x="122.435" y="400.696" style="fill:#3943b7;" width="100.174" height="33.391"/>
|
||||
</g>
|
||||
<rect x="256" y="367.304" style="fill:#DADFE4;" width="33.391" height="100.174"/>
|
||||
<path style="fill:#3e4073;" d="M356.174,467.478h-66.783v-66.783h50.087c9.22,0,16.696,7.475,16.696,16.696V467.478z"/>
|
||||
<rect x="55.652" y="333.913" style="fill:#DBE9FD;" width="400.696" height="33.391"/>
|
||||
<rect x="256" y="333.913" style="fill:#C5DCFD;" width="200.348" height="33.391"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 2.7 KiB |
|
|
@ -54,12 +54,12 @@ const statusColor: {
|
|||
} = {
|
||||
scoping: {
|
||||
class: "bg-emerald-500 hover:bg-emerald-500",
|
||||
text: "scoping",
|
||||
text: "Scoping",
|
||||
hoverText: "This portfolio is currently in scoping",
|
||||
propertyHoverText: "This property is currently in scoping",
|
||||
},
|
||||
assessment: {
|
||||
class: "bg-emerald-400 hover:bg-emerald-500",
|
||||
class: "bg-emerald-400 hover:bg-emerald-500 truncate text-overflow: ellipsis",
|
||||
text: "Non-invasive Assessment",
|
||||
hoverText: "This portfolio is currently in the assessment stage",
|
||||
propertyHoverText: "This property is currently in the assessment stage",
|
||||
|
|
@ -72,7 +72,7 @@ const statusColor: {
|
|||
},
|
||||
tendering: {
|
||||
class: "bg-emerald-500 hover:bg-emerald-500",
|
||||
text: "tendering",
|
||||
text: "Tendering",
|
||||
hoverText: "This portfolio is currently in the tendering stage",
|
||||
propertyHoverText: "This property is currently in tender",
|
||||
},
|
||||
|
|
|
|||
|
|
@ -4,14 +4,14 @@ import NewPortfolioModal from "./NewPortfolioModal";
|
|||
|
||||
const styles = {
|
||||
wrapper:
|
||||
"bg-brandblue hover:bg-hoverblue shadow-xl hover:shadow-none cursor-pointer w-60 rounded-3xl flex flex-col items-center justify-center",
|
||||
header: "relative mt-2 mx-2",
|
||||
"group bg-brandblue hover:bg-hoverblue shadow-xl hover:shadow-none cursor-pointer rounded-3xl flex flex-col items-center justify-center aspect-square",
|
||||
header: "relative mt-2 mx-2 w-full",
|
||||
imageWrapper:
|
||||
"h-56 rounded-2xl overflow-hidden flex justify-center items-center",
|
||||
"relative rounded-2xl overflow-hidden flex justify-center items-center",
|
||||
wrapperAnime: "transition-all duration-500 ease-in-out",
|
||||
image: "object-cover w-8/12 h-8/12 mx-auto fill-white",
|
||||
textWrapper: "pt-10 pb-6 w-full px-4 flex justify-center items-center",
|
||||
text: "font-medium leading-none text-base tracking-wider text-gray-400",
|
||||
textWrapper: "w-full flex justify-center items-center pt-6",
|
||||
text: "pb-6 font-medium leading-none text-base tracking-wider text-gray-400",
|
||||
};
|
||||
|
||||
const AddNewCard = () => {
|
||||
|
|
@ -24,22 +24,24 @@ const AddNewCard = () => {
|
|||
|
||||
return (
|
||||
<a onClick={openModal}>
|
||||
<div className={[styles.wrapper, styles.wrapperAnime].join(" ")}>
|
||||
<div className={styles.header}>
|
||||
<div className={styles.imageWrapper}>
|
||||
<div className="w-1/4">
|
||||
<PlusIcon color="white" />
|
||||
<NewPortfolioModal
|
||||
isOpen={isModalOpen}
|
||||
setIsOpen={setModalIsOpen}
|
||||
/>
|
||||
<div className="flex justify-center">
|
||||
<div className={[styles.wrapper, styles.wrapperAnime].join(" ")}>
|
||||
<div className={styles.header}>
|
||||
<div className={styles.imageWrapper}>
|
||||
<div className="w-1/4">
|
||||
<PlusIcon color="white" />
|
||||
<NewPortfolioModal
|
||||
isOpen={isModalOpen}
|
||||
setIsOpen={setModalIsOpen}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.textWrapper}>
|
||||
<h1 className={styles.text}>{`${title}`}</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.textWrapper}>
|
||||
<h1 className={styles.text}>{`${title}`}</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -5,14 +5,16 @@ import { PortfolioStatus } from "@/app/db/schema/portfolio";
|
|||
import { formatNumber } from "@/app/utils";
|
||||
import Image from "next/image";
|
||||
|
||||
|
||||
const styles = {
|
||||
wrapper:
|
||||
"active:bg-brandmidblue font-medium leading-none text-base tracking-wider text-gray-400 hover:text-gray-300 bg-white hover:bg-hoverblue shadow-xl hover:shadow-none cursor-pointer w-60 rounded-3xl flex flex-col items-center justify-center",
|
||||
header: "relative mt-2 mx-2 border-red",
|
||||
imageWrapper: "h-56 rounded-2xl overflow-hidden flex items-center",
|
||||
"group py-2 px-3 active:bg-brandmidblue font-medium leading-none text-base tracking-wider text-gray-400 hover:text-white-300 bg-white hover:bg-hoverblue shadow-2xl hover:shadow-none cursor-pointer aspect-square rounded-3xl flex flex-col items-center justify-center",
|
||||
header: "relative mt-2 w-full border-brandblue",
|
||||
budgetWrapper: "min-h-7 pr-4 flex justify-end w-full text-right max-h-16 my-auto text-gray-700 group-hover:text-white transition-all duration-500 ease-in-out relative",
|
||||
imageWrapper: "rounded-2xl overflow-hidden flex justify-center items-center",
|
||||
wrapperAnime: "transition-all duration-500 ease-in-out",
|
||||
image: "object-cover mx-auto",
|
||||
textWrapper: "pt-6 pb-3 w-full px-4 flex justify-between items-center",
|
||||
textWrapper: "pb-3 w-full px-4 flex justify-center items-center max-h-16 my-auto text-gray-700 text-center group-hover:text-white transition-all duration-500 ease-in-out",
|
||||
};
|
||||
|
||||
interface CardProps {
|
||||
|
|
@ -21,7 +23,7 @@ interface CardProps {
|
|||
image: string;
|
||||
budget: number | null;
|
||||
status: (typeof PortfolioStatus)[number];
|
||||
}
|
||||
};
|
||||
|
||||
const Card = ({ id, title, image, budget, status }: CardProps) => {
|
||||
const router = useRouter();
|
||||
|
|
@ -36,9 +38,10 @@ const Card = ({ id, title, image, budget, status }: CardProps) => {
|
|||
<div>
|
||||
<div
|
||||
onClick={handleClick}
|
||||
className={[styles.wrapper, styles.wrapperAnime].join(" ")}
|
||||
className={[styles.wrapper, styles.wrapperAnime].join(" ")}
|
||||
>
|
||||
<div className={styles.header}>
|
||||
<div className={styles.budgetWrapper} >{budgetFormatted}</div>
|
||||
<div className={styles.imageWrapper}>
|
||||
<Image
|
||||
src={image}
|
||||
|
|
@ -51,10 +54,9 @@ const Card = ({ id, title, image, budget, status }: CardProps) => {
|
|||
</div>
|
||||
<div className={styles.textWrapper}>
|
||||
<h1>{`${title}`}</h1>
|
||||
<div>{budgetFormatted}</div>
|
||||
</div>
|
||||
<div className="mb-2 flex justify-end w-full">
|
||||
<div className="flex justify-end w-full pr-4">
|
||||
<div className="mb-4 flex justify-end w-full">
|
||||
<div className="flex justify-center w-full">
|
||||
<StatusBadge status={status} />
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -22,9 +22,10 @@ export default function CardTiles({
|
|||
key={portfolio.id.toString()}
|
||||
id={portfolio.id}
|
||||
title={portfolio.name}
|
||||
image={`house-icon-${image_idx}.svg`}
|
||||
image={`house-icon.svg`}
|
||||
budget={portfolio.budget}
|
||||
status={portfolio.status}
|
||||
|
||||
/>
|
||||
);
|
||||
})}
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ interface ToolbarProps {
|
|||
}
|
||||
|
||||
const navigationMenuTriggerStyle = cva(
|
||||
"bg-gray-50 cursor-pointer group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-gray-200 hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-accent/50 data-[state=open]:bg-gray-200"
|
||||
"bg-gray-50 cursor-pointer group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-gray-200 hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-accent/50 data-[state=open]:bg-gray-200 "
|
||||
);
|
||||
|
||||
export function Toolbar({ portfolioId }: ToolbarProps) {
|
||||
|
|
|
|||
6
src/app/db/migrations/0097_pale_demogoblin.sql
Normal file
6
src/app/db/migrations/0097_pale_demogoblin.sql
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
ALTER TABLE "property_details_epc" ADD COLUMN "heating_cost_current" real;--> statement-breakpoint
|
||||
ALTER TABLE "property_details_epc" ADD COLUMN "hot_water_cost_current" real;--> statement-breakpoint
|
||||
ALTER TABLE "property_details_epc" ADD COLUMN "lighting_cost_current" real;--> statement-breakpoint
|
||||
ALTER TABLE "property_details_epc" ADD COLUMN "appliances_cost_current" real;--> statement-breakpoint
|
||||
ALTER TABLE "property_details_epc" ADD COLUMN "gas_standing_charge" real;--> statement-breakpoint
|
||||
ALTER TABLE "property_details_epc" ADD COLUMN "electricity_standing_charge" real;
|
||||
1
src/app/db/migrations/0098_grey_vector.sql
Normal file
1
src/app/db/migrations/0098_grey_vector.sql
Normal file
|
|
@ -0,0 +1 @@
|
|||
ALTER TABLE "recommendation" ADD COLUMN "measure_type" text;
|
||||
2975
src/app/db/migrations/meta/0097_snapshot.json
Normal file
2975
src/app/db/migrations/meta/0097_snapshot.json
Normal file
File diff suppressed because it is too large
Load diff
2981
src/app/db/migrations/meta/0098_snapshot.json
Normal file
2981
src/app/db/migrations/meta/0098_snapshot.json
Normal file
File diff suppressed because it is too large
Load diff
|
|
@ -680,6 +680,20 @@
|
|||
"when": 1725897920431,
|
||||
"tag": "0096_married_umar",
|
||||
"breakpoints": true
|
||||
},
|
||||
{
|
||||
"idx": 97,
|
||||
"version": "5",
|
||||
"when": 1727945843077,
|
||||
"tag": "0097_pale_demogoblin",
|
||||
"breakpoints": true
|
||||
},
|
||||
{
|
||||
"idx": 98,
|
||||
"version": "5",
|
||||
"when": 1727949671527,
|
||||
"tag": "0098_grey_vector",
|
||||
"breakpoints": true
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -175,6 +175,14 @@ export const propertyDetailsEpc = pgTable("property_details_epc", {
|
|||
"current_energy_demand_heating_hotwater"
|
||||
),
|
||||
estimated: boolean("estimated").default(false),
|
||||
// Include current estimates for energy bills, across the different types of energy
|
||||
// These predictions are based on the EPC predicted consumptions + current energy prices
|
||||
heatingEnergyCostCurrent: real("heating_cost_current"),
|
||||
hotWaterEnergyCostCurrent: real("hot_water_cost_current"),
|
||||
lightingEnergyCostCurrent: real("lighting_cost_current"),
|
||||
appliancesEnergyCostCurrent: real("appliances_cost_current"),
|
||||
gasStandingCharge: real("gas_standing_charge"),
|
||||
electricityStandingCharge: real("electricity_standing_charge"),
|
||||
});
|
||||
|
||||
export const propertyDetailsSpatial = pgTable("property_details_spatial", {
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ export const recommendation = pgTable("recommendation", {
|
|||
.references(() => property.id),
|
||||
createdAt: timestamp("created_at").notNull().defaultNow(),
|
||||
type: text("type").notNull(),
|
||||
measureType: text("measure_type"),
|
||||
description: text("description").notNull(),
|
||||
estimatedCost: real("estimated_cost"),
|
||||
// default will indicate whether a mtaterial is currently being used in a recommendation and we will use this boolean to switch
|
||||
|
|
|
|||
|
|
@ -4,8 +4,10 @@ import { AuthOptions } from "@/app/api/auth/[...nextauth]/route";
|
|||
import { getServerSession } from "next-auth";
|
||||
import { redirect } from "next/navigation";
|
||||
|
||||
|
||||
const Home = async () => {
|
||||
const user = await getServerSession(AuthOptions);
|
||||
|
||||
|
||||
if (!user?.user) {
|
||||
console.error("User not found");
|
||||
|
|
@ -14,12 +16,15 @@ const Home = async () => {
|
|||
|
||||
const portfolios = await getPortfolios(user.user.dbId);
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="flex justify-center">
|
||||
<h1 className="text-3xl font-bold mt-3 mb-5"> Your Portfolios </h1>
|
||||
<h1 className="text-3xl font-bold mt-3 mb-5 text-gray-700"> Your Portfolios </h1>
|
||||
</div>
|
||||
<div className="px-5">
|
||||
<CardTiles Portfolios={portfolios} />
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ const NavigationMenu = React.forwardRef<
|
|||
<NavigationMenuPrimitive.Root
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"relative z-10 flex max-w-max flex-1 items-center justify-center",
|
||||
"relative z-10 flex max-w-max flex-1 items-center justify-center ",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
|
|
@ -60,7 +60,7 @@ const NavigationMenuTrigger = React.forwardRef<
|
|||
>
|
||||
{children}{" "}
|
||||
<ChevronDown
|
||||
className="relative top-[1px] ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180"
|
||||
className="relative top-[1px] ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180 "
|
||||
aria-hidden="true"
|
||||
/>
|
||||
</NavigationMenuPrimitive.Trigger>
|
||||
|
|
@ -74,7 +74,7 @@ const NavigationMenuContent = React.forwardRef<
|
|||
<NavigationMenuPrimitive.Content
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"left-0 top-0 w-full data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 md:absolute md:w-auto ",
|
||||
"left-0 top-0 w-full data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 md:absolute md:w-auto",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
|
|
@ -91,7 +91,7 @@ const NavigationMenuViewport = React.forwardRef<
|
|||
<div className={cn("absolute left-0 top-full flex justify-center")}>
|
||||
<NavigationMenuPrimitive.Viewport
|
||||
className={cn(
|
||||
"origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]",
|
||||
"origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)] ",
|
||||
className
|
||||
)}
|
||||
ref={ref}
|
||||
|
|
@ -109,7 +109,7 @@ const NavigationMenuIndicator = React.forwardRef<
|
|||
<NavigationMenuPrimitive.Indicator
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in",
|
||||
"top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in ",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"allowSyntheticDefaultImports": true,
|
||||
// "target": "es5",
|
||||
"target": "ESNext",
|
||||
"target": "es5",
|
||||
// "target": "ESNext",
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue