Fix console errors

matt765 · Jun 3, 2024 · 957e2e4 · 957e2e4
1 parent 1e725d0
commit 957e2e4
Show file tree

Hide file tree

Showing 7 changed files with 20 additions and 19 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,8 +1,14 @@
 # Changelog
 
-## 1.0.0 (03-06-2024)
+## 1.0.0 (02-06-2024)
 
 - add changelog
 - add first tag and Github release
 - update package.json & readme
 
+## 1.0.1 (03-06-2024)
+
+- update all packages
+- add contributing guidelines
+- fix console errors
+- hide feature divider
diff --git a/src/components/FAQ.jsx b/src/components/FAQ.jsx
@@ -43,7 +43,7 @@ export const FAQ = () => (
           </h2>
           <div className="mb-11 flex flex-wrap -m-1">
             {FAQData.map((item, index) => (
-              <div className="w-full p-1">
+              <div className="w-full p-1" key={`${item.question}-${index}`}>
                 <FAQBox
                   title={item.question}
                   content={item.answer}
@@ -72,7 +72,7 @@ const FAQBox = ({ defaultOpen, title, content }) => {
           {title}
         </h3>
         <p
-          className={`text-customGrayText pt-4 transition-all duration-300 overflow-hidden ${
+          className={`text-customGrayText pt-4 transition-all duration-200 overflow-hidden ${
             isOpen ? "max-h-96" : "max-h-0"
           }`}
         >

diff --git a/src/components/Features1.jsx b/src/components/Features1.jsx
@@ -9,7 +9,7 @@ import { CheckArrowIcon } from "../assets/icons/CheckArrowIcon";
 export const Features1 = () => {
   return (
     <section
-      className="w-full bg-customDarkBg2 mt-20 mb-8 sm:mt-16 sm:mb-16 xl:mt-0  xl:m pt-[2rem]  md:pt-[12vw] lg:pt-0"
+      className="w-full bg-customDarkBg2 mt-20 mb-8 sm:mt-16 sm:mb-16 xl:mt-0  xl:m pt-[2rem]  md:pt-[12vw] lg:pt-4"
       id="features"
     >
       <motion.div

diff --git a/src/components/Features2.jsx b/src/components/Features2.jsx
@@ -5,7 +5,7 @@ import feature6 from "../assets/images/feature6.jpg";
 import { CheckArrowIcon } from "../assets/icons/CheckArrowIcon";
 
 export const Features2 = () => (
-  <section className="w-full bg-customDarkBg2 mt-12 sm:mt-20 mb-10 lg:my-20 pt-4">
+  <section className="w-full bg-customDarkBg2 mt-12 sm:mt-24 mb-12 lg:my-20 pt-4">
     <motion.div
       initial={{ opacity: 0 }}
       whileInView={{ opacity: 1 }}

diff --git a/src/components/Footer.jsx b/src/components/Footer.jsx
@@ -28,7 +28,7 @@ const footerData = [
 export const Footer = () => {
   return (
     <footer>
-      <div className="pt-10  lg:pt-20 lg:pb-12 bg-customDarkBg1 radius-for-skewed ">
+      <div className="pt-10  lg:pt-20 lg:pb-16 bg-customDarkBg1 radius-for-skewed ">
         <div className="container mx-auto px-4 w-4/5 md:w-11/12 lg:w-10/12 xl:w-4/5 2xl:w-2/3">
           <div className="flex flex-wrap">
             <div className="w-full lg:w-1/3 mb-16 lg:mb-0">
@@ -77,8 +77,8 @@ export const Footer = () => {
               <div className="w-full md:w-1/3 lg:w-auto mb-16 md:mb-0">
                 <h3 className="mb-6 text-2xl font-bold text-white">Products</h3>
                 <ul>
-                  {footerData[0].items.map((item, i) => (
-                    <li key={i} className="mb-4">
+                  {footerData[0].items.map((item, index) => (
+                    <li key={`${item}-${index}`} className="mb-4">
                       <a
                         className="text-gray-400 hover:text-gray-300"
                         href="#"
@@ -95,8 +95,8 @@ export const Footer = () => {
                   Important Links
                 </h3>
                 <ul>
-                  {footerData[1].items.map((item, i) => (
-                    <li key={i} className="mb-4">
+                  {footerData[1].items.map((item, index) => (
+                    <li key={`${item}-${index}`} className="mb-4">
                       <a
                         className="text-gray-400 hover:text-gray-300"
                         href="#"
@@ -111,8 +111,8 @@ export const Footer = () => {
               <div className="w-full md:w-1/3 lg:w-auto">
                 <h3 className="mb-6 text-2xl font-bold text-white">Company</h3>
                 <ul>
-                  {footerData[2].items.map((item, i) => (
-                    <li key={i} className="mb-4">
+                  {footerData[2].items.map((item, index) => (
+                    <li key={`${item}-${index}`} className="mb-4">
                       <a
                         className="text-gray-400 hover:text-gray-300"
                         href="#"
@@ -125,10 +125,7 @@ export const Footer = () => {
                 </ul>
               </div>
             </div>
-          </div>
-          <p className="lg:text-center text-sm text-gray-400 border-t border-[rgb(255,255,255,0.2)] pt-12 mt-16 hidden lg:block">
-            &copy; 2022. MIT license.
-          </p>
+          </div>          
         </div>
       </div>
     </footer>

diff --git a/src/components/Pricing.jsx b/src/components/Pricing.jsx
@@ -58,7 +58,7 @@ export const Pricing = () => {
                   >
                     Monthly
                   </div>
-                  <div className={isMonthly && "text-gray-400"}>Yearly</div>
+                  <div className={isMonthly ? "text-gray-400" : ""}>Yearly</div>
                 </div>
               </label>
             </div>
@@ -76,7 +76,6 @@ export const Pricing = () => {
                       {isMonthly ? "/ month" : "/ year"}
                     </div>
                   </div>
-
                   <p className="mt-4 mb-6 2xl:mb-10 text-gray-500 leading-loose text-left">
                     The perfect way to get started and get used to our tools.
                   </p>

diff --git a/src/pages/index.astro b/src/pages/index.astro
@@ -21,7 +21,6 @@ import "../styles/Diagonals.css";
   <Navbar client:load />
   <Hero client:load />
   <Features1 client:load />
-  <Divider />
   <Features2 client:load />
   <Testimonials client:load />
   <FeaturesDiagonal client:load />