fixed colors

stcalica · May 8, 2024 · 34cac93 · 34cac93
1 parent 04329c0
commit 34cac93
Show file tree

Hide file tree

Showing 27 changed files with 4,108 additions and 2,281 deletions.
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -26,7 +26,7 @@ const libreBodoni = Libre_Bodoni({
 
 export const metadata: Metadata = {
   title: "Hidden Oasis",
-  description: "Hidden Oasis - Hotel & Resort Website Coded Template",
+  description: "Advance Camp for Scouts of America 2024",
 };
 
 export default function RootLayout({
@@ -40,25 +40,25 @@ export default function RootLayout({
         {/* Description no longer than 155 characters */}
         <meta
           name="description"
-          content="Hidden Oasis - Hotel & Resort Website Coded Template"
+          content="Advance Camp for Scouts of America 2024"
         />
 
         {/* Product Name */}
         <meta
           name="product-name"
-          content="Hidden Oasis - Hotel & Resort Website Coded Template"
+          content="Advance Camp for Scouts of America 2024"
         />
 
         {/* Twitter Card data */}
         <meta name="twitter:card" content="summary" />
         <meta name="twitter:site" content="@ui8" />
         <meta
           name="twitter:title"
-          content="Hidden Oasis - Hotel & Resort Website Coded Template"
+          content="Advance Camp for Scouts of America 2024"
         />
         <meta
           name="twitter:description"
-          content="Hotel & Resort Website Template | 90+ High Premium Screens"
+          content="Advance Camp | Scouts of America | 2024"
         />
         <meta name="twitter:creator" content="@ui8" />
         {/* Twitter Summary card images must be at least 120x120px */}
@@ -70,68 +70,66 @@ export default function RootLayout({
         {/* Open Graph data for Facebook */}
         <meta
           property="og:title"
-          content="Hidden Oasis - Hotel & Resort Website Coded Template"
+          content="Advance Camp for Scouts of America 2024"
         />
         <meta property="og:type" content="Article" />
-        <meta
-          property="og:url"
-          content="https://ui8.net/jos-creative/products/hidden-oasis---hotel--resort-website-coded-template"
-        />
+
         <meta
           property="og:image"
           content="https://ui8-oasis-9c5d8ffa82b1.herokuapp.com/fb-og-image.png"
         />
         <meta
           property="og:description"
-          content="Hotel & Resort Website Template | 90+ High Premium Screens"
+          content="Advance Camp for Scouts of America - 2024."
         />
         <meta
           property="og:site_name"
-          content="Hidden Oasis - Hotel & Resort Website Coded Template"
+          content="Advance Camp 2024"
         />
         <meta property="fb:admins" content="132951670226590" />
 
         {/* Open Graph data for LinkedIn */}
         <meta
           property="og:title"
-          content="Hidden Oasis - Hotel & Resort Website Coded Template"
-        />
-        <meta
-          property="og:url"
-          content="https://ui8.net/jos-creative/products/hidden-oasis---hotel--resort-website-coded-template"
+          content="Advance Camp 2024"
         />
+
         <meta
           property="og:image"
           content="https://ui8-oasis-9c5d8ffa82b1.herokuapp.com/img/linkedin-og-image.png"
         />
         <meta
           property="og:description"
-          content="Hotel & Resort Website Template | 90+ High Premium Screens"
+          content="Advance Camp 2024"
         />
 
         {/* Open Graph data for Pinterest */}
         <meta
           property="og:title"
-          content="Hidden Oasis - Hotel & Resort Website Coded Template"
-        />
-        <meta
-          property="og:url"
-          content="https://ui8.net/jos-creative/products/hidden-oasis---hotel--resort-website-coded-template"
-        />
-        <meta
-          property="og:image"
-          content="https://ui8-oasis-9c5d8ffa82b1.herokuapp.com/img/pinterest-og-image.png"
+          content="Advance Camp for Scouts of America 2024"
         />
+
         <meta
           property="og:description"
-          content="Hotel & Resort Website Template | 90+ High Premium Screens"
+          content="Advance Camp | Scouts of America | 2024"
         />
       </head>
       <body
-        className={`${dmSans.variable} ${dmSerif.variable} ${libreBodoni.variable} font-sans antialiased text-14r text-orange-500`}
+        className={`${dmSans.variable} ${dmSerif.variable} ${libreBodoni.variable} font-sans antialiased text-14r text-white bg-secondary-500`}
       >
         {children}
       </body>
     </html>
   );
 }
+
+//TODO: REPLACE back in code with advance camp badge
+/* <meta
+property="og:image"
+content="https://ui8-oasis-9c5d8ffa82b1.herokuapp.com/img/pinterest-og-image.png"
+/> */
+
+/* <meta
+property="og:url"
+content="https://ui8.net/jos-creative/products/hidden-oasis---hotel--resort-website-coded-template"
+/> */
diff --git a/components/Field/index.tsx b/components/Field/index.tsx
@@ -28,7 +28,7 @@ const Field = ({
                 {textarea ? (
                     <textarea
                         className={twMerge(
-                            `w-full h-[15.5rem] px-4 py-2.5 bg-white border border-n-100 font-sans text-base text-n-600 resize-none placeholder:text-n-600 transition-colors focus:border-n-200 outline-none ${
+                            `w-full h-[15.5rem] px-4 py-2.5 bg-secondary-500 border border-n-100 font-sans text-base text-n-600 resize-none placeholder:text-n-600 transition-colors focus:border-n-200 outline-none ${
                                 classInput || ""
                             }`
                         )}
@@ -37,7 +37,7 @@ const Field = ({
                 ) : (
                     <input
                         className={twMerge(
-                            `w-full h-13.5 px-4 bg-white border border-n-100 font-sans text-base text-n-600 placeholder:text-n-600 transition-colors focus:border-n-200 outline-none ${
+                            `w-full h-13.5 px-4 bg-secondary-500 border border-n-100 font-sans text-base text-n-600 placeholder:text-n-600 transition-colors focus:border-n-200 outline-none ${
                                 classInput || ""
                             }`
                         )}

diff --git a/components/Footer/index.tsx b/components/Footer/index.tsx
@@ -12,7 +12,7 @@ type FooterProps = {};
 
 const Footer = ({}: FooterProps) => {
   return (
-    <footer className="bg-white">
+    <footer className="bg-secondary-500">
       <div className="py-8 border-b border-n-100">
         <div className="container flex justify-between items-center md:block">
           <div className="flex md:justify-center md:mb-6">
@@ -36,7 +36,7 @@ const Footer = ({}: FooterProps) => {
       <div className="py-8 border-b border-n-100">
         <div className="container flex justify-between lg:flex-wrap md:block md:space-y-6">
           <div className="lg:w-full lg:mt-12">
-            <div className="mb-4 text-16m text-black">Contact Us</div>
+            <div className="mb-4 text-16m text-font-header">Contact Us</div>
             <div className="mb-14 md:mb-8 text-black">
               <p>ADVANCECAMP, INC.</p>
               <p>1169 Sentinel Court, Merced, CA 95340-0677</p>

diff --git a/components/Gallery/index.tsx b/components/Gallery/index.tsx
@@ -56,7 +56,7 @@ const Gallery = ({ images, index }: GalleryProps) => {
                 </Swiper>
                 <div className="md:flex md:justify-center md:mt-5 md:space-x-6">
                     <button
-                        className="absolute top-1/2 -left-20 w-14 h-14 -translate-y-1/2 transition-opacity outline-none hover:opacity-80 lg:z-3 lg:left-0 lg:w-10 lg:h-10 lg:bg-white md:static md:translate-y-0"
+                        className="absolute top-1/2 -left-20 w-14 h-14 -translate-y-1/2 transition-opacity outline-none hover:opacity-80 lg:z-3 lg:left-0 lg:w-10 lg:h-10 lg:bg-primary-500 md:static md:translate-y-0"
                         onClick={() => swiperRef.current?.slidePrev()}
                     >
                         <Icon
@@ -65,7 +65,7 @@ const Gallery = ({ images, index }: GalleryProps) => {
                         />
                     </button>
                     <button
-                        className="absolute top-1/2 -right-20 w-14 h-14 -translate-y-1/2 transition-opacity outline-none hover:opacity-80 lg:z-3 lg:right-0 lg:w-10 lg:h-10 lg:bg-white md:static md:translate-y-0"
+                        className="absolute top-1/2 -right-20 w-14 h-14 -translate-y-1/2 transition-opacity outline-none hover:opacity-80 lg:z-3 lg:right-0 lg:w-10 lg:h-10 lg:bg-primary-500 md:static md:translate-y-0"
                         onClick={() => swiperRef.current?.slideNext()}
                     >
                         <Icon

diff --git a/components/Header/index.tsx b/components/Header/index.tsx
@@ -9,7 +9,7 @@ type HeaderProps = {
 
 const Header = ({ onClick }: HeaderProps) => {
   return (
-    <header className="relative z-10  bg-neutral-700">
+    <header className="relative z-10  bg-tertiary-500">
       <div className="py-4">
         <div className="container relative flex items-center h-[4.8125rem] lg:flex-row-reverse">
           <button

diff --git a/components/Language/index.tsx b/components/Language/index.tsx
@@ -43,7 +43,7 @@ const Language = ({ className, fullName, up }: LanguageProps) => {
                 leaveTo="opacity-0"
             >
                 <Listbox.Options
-                    className={`absolute -left-2 -right-2 py-1 bg-white ${
+                    className={`absolute -left-2 -right-2 py-1 bg-secondary-500 ${
                         up ? "bottom-full mb-1 shadow-md" : "top-full mt-1"
                     }`}
                 >

diff --git a/components/Modal/index.tsx b/components/Modal/index.tsx
@@ -59,7 +59,7 @@ const Modal = ({
                 >
                     <Dialog.Panel
                         className={twMerge(
-                            `relative z-10 max-w-[53.13rem] w-full m-auto bg-white ${
+                            `relative z-10 max-w-[53.13rem] w-full m-auto bg-secondary-500 ${
                                 video
                                     ? "max-w-[64rem] aspect-video bg-black"
                                     : ""
@@ -82,7 +82,7 @@ const Modal = ({
                             className={twMerge(
                                 `absolute top-3 right-3 w-10 h-10 text-0 fill-n-700 hover:!fill-color-5 dark:fill-n-3 ${
                                     video
-                                        ? "top-0 right-0 bg-white fill-n-700"
+                                        ? "top-0 right-0 bg-secondary-500 fill-n-700"
                                         : ""
                                 } ${classButtonClose || ""}`
                             )}

diff --git a/components/MyDatePicker/index.tsx b/components/MyDatePicker/index.tsx
@@ -24,7 +24,7 @@ const MyDatePicker = ({
             <div className="relative">
                 <DatePicker
                     wrapperClassName="!block"
-                    className="w-full h-13.5 pl-4 pr-12 bg-white border border-n-100 font-sans text-16r text-n-600 placeholder:text-n-600 transition-colors focus:border-n-200 outline-none"
+                    className="w-full h-13.5 pl-4 pr-12 bg-secondary-500 border border-n-100 font-sans text-16r text-n-600 placeholder:text-n-600 transition-colors focus:border-n-200 outline-none"
                     dateFormat="MMM dd, yyyy"
                     selected={selected}
                     minDate={today}

diff --git a/components/NewsItem/index.tsx b/components/NewsItem/index.tsx
@@ -14,7 +14,7 @@ type NewsItemProps = {
 };
 
 const NewsItem = ({ className, item }: NewsItemProps) => (
-    <div className={`flex flex-col bg-white ${className || ""}`}>
+    <div className={`flex flex-col bg-secondary-500 ${className || ""}`}>
         <div className="h-[20.625rem]">
             <Image
                 className="w-full h-full object-cover"

diff --git a/components/PackageItem/index.tsx b/components/PackageItem/index.tsx
@@ -14,7 +14,7 @@ type PackageItemProps = {
 };
 
 const PackageItem = ({ className, item }: PackageItemProps) => (
-    <div className={`flex flex-col bg-white ${className || ""}`}>
+    <div className={`flex flex-col bg-secondary-500 ${className || ""}`}>
         <div className="h-[20.625rem]">
             <Image
                 className="w-full h-full object-cover"

diff --git a/components/PricingTiers/index.tsx b/components/PricingTiers/index.tsx
@@ -8,10 +8,10 @@ type tierType = {
 };
 
 const PricingTier = ({tier}: {tier: tierType}) => (
-    <figure className="flex flex-col items-center justify-center p-4 bg-white rounded-lg shadow-lg transition-all hover:shadow-xl
-    w-full xl:min-w-[400px] h-[250px]">
-            <h1 className="text-8xl font-extrabold text-sans leading-none mb-2 text-gray-800">${tier.price}</h1>
-        <figcaption className="text-xl font-semibold text-gray-600">{tier.title}</figcaption>
+    <figure className="flex flex-col items-center justify-center p-4 bg-tertiary-500 rounded-lg shadow-lg transition-all hover:shadow-xl
+    w-full xl:min-w-[400px] h-[250px] text-white">
+            <h1 className="text-8xl font-extrabold text-sans leading-none mb-2 text-white">${tier.price}</h1>
+        <figcaption className="text-xl font-semibold text-white">{tier.title}</figcaption>
     </figure>
 );
 export default PricingTier;
diff --git a/components/Select/index.tsx b/components/Select/index.tsx
@@ -33,7 +33,7 @@ const Select = ({
             className={`justify-between items-center text-n-600 outline-none ${
                 simple
                     ? "inline-flex text-14r"
-                    : "flex w-full h-13.5 px-4 border border-n-100 bg-white text-16r transition-colors ui-open:border-n-200"
+                    : "flex w-full h-13.5 px-4 border border-n-100 bg-secondary-500 text-16r transition-colors ui-open:border-n-200"
             }`}
         >
             <div className="truncate">{value ? value.title : placeholder}</div>
@@ -51,7 +51,7 @@ const Select = ({
             leaveTo="transform scale-95 opacity-0"
         >
             <Listbox.Options
-                className={`absolute top-full z-2 bg-white outline-none ${
+                className={`absolute top-full z-2 bg-secondary-500 outline-none ${
                     simple
                         ? "-left-6 min-w-[14rem] mt-2 p-6 space-y-4 shadow-[0.0625rem_0.3125rem_0.75rem_0_rgba(0,0,0,0.30)]"
                         : "left-0 right-0 mt-0.5 border border-n-200"

diff --git a/components/Sidebar/index.tsx b/components/Sidebar/index.tsx
@@ -11,7 +11,7 @@ type SidebarProps = {
 
 const Sidebar = ({ className, onClick }: SidebarProps) => (
   <div
-    className={`fixed top-0 left-0 bottom-0 z-30 w-full sm:w-[34.7rem] p-4 sm:p-14 overflow-auto scrollbar-none 2xl:w-[28rem] 2xl:p-10 lg:p-8 lg:pt-7 md:flex md:flex-col bg-neutral-700 ${
+    className={`fixed top-0 left-0 bottom-0 z-30 w-full sm:w-[34.7rem] p-4 sm:p-14 overflow-auto scrollbar-none 2xl:w-[28rem] 2xl:p-10 lg:p-8 lg:pt-7 md:flex md:flex-col bg-tertiary-500 ${
       className || ""
     }`}
   >
@@ -35,7 +35,7 @@ const Sidebar = ({ className, onClick }: SidebarProps) => (
     <div className="flex flex-col items-start space-y-6">
       {navigation.map((link) => (
           <Link
-            className="py-1 text-h4-libre text-orange-500 transition-colors hover:text-white"
+            className="py-1 text-h4-libre text-white transition-colors hover:text-orange-500"
             href={link.url}
             key={link.id}
           >

diff --git a/components/Team/team.tsx b/components/Team/team.tsx
@@ -21,11 +21,11 @@ const Member = ({ member }: MemberProps) => {
         <div className="container-lg">
             <div className="flex flex-col  lg:flex-row justify-center items-start">
                 <figure className="flex flex-col items-center space-y-2 w-full md:w-[500px]">
-                    <figcaption className="text-lg font-semibold text-center">{member.title}</figcaption>
+                    <figcaption className="text-lg font-semibold text-center text-font-header">{member.title}</figcaption>
                     <img src={member.image} alt={`Image of ${member.name}`} className="w-32 h-32 rounded-full object-cover" />
-                    <h3 className="text-sm text-gray-600">{member.name}</h3>
+                    <h3 className="text-sm text-font-header">{member.name}</h3>
                     <div>
-                        <h4 className="text-sm text-gray-600">{member.email}</h4>
+                        <h4 className="text-sm text-black">{member.email}</h4>
                     </div>
                 </figure>
                 <div className="hidden lg:block flex-1 space-y-2 w-full md:w-[700px]">
@@ -71,7 +71,7 @@ const Member = ({ member }: MemberProps) => {
 };
 
 const Team = ({ team }: { team: TeamMember[] }) => (
-    <div className="flex flex-col space-y-8 w-full">
+    <div className="flex flex-col space-y-8 w-full text-font-primary">
         {team.map(member => (
             <Member key={member.id} member={member} />
         ))}

diff --git a/components/Сommunication/index.tsx b/components/Сommunication/index.tsx
@@ -4,7 +4,7 @@ type СommunicationProps = {
 
 const Сommunication = ({ className }: СommunicationProps) => (
     <div
-        className={`p-6 border border-n-700 bg-white text-center ${
+        className={`p-6 border border-n-700 bg-secondary-500 text-center text-black ${
             className || ""
         }`}
     >
@@ -16,7 +16,7 @@ const Сommunication = ({ className }: СommunicationProps) => (
             dedicated to making it smooth, flawless and memorable. It’s what we
             live for, really.
         </div>
-        <div className="mb-5">Contact us for more information</div>
+        <div className="mb-5 text-black">Contact us for more information</div>
         <a
             className="btn-secondary btn-lg min-w-[13.5rem] text-16m"
             href="tel:+84654343543"

diff --git a/next.config.mjs b/next.config.mjs
@@ -1,9 +1,16 @@
-// next.config.js
+const isProd = process.env.NODE_ENV === 'production';
 
 const nextConfig = {
-    output: "export",  // <=== enables static exports
-    reactStrictMode: true,
-  };
-
-  export default nextConfig;
-
+  // Enables static exports
+  output: "export",
+  reactStrictMode: true,
+  images: {
+    unoptimized: true // Disable Image Optimization
+  }
+
+  // Conditionally set basePath and assetPrefix for GitHub Pages in production
+  // basePath: isProd ? '/advance-camp-' : '',
+  // assetPrefix: isProd ? '/your-repo-name/' : '',
+};
+
+export default nextConfig;