fix import declaration conflicts

src/components/navbar/dropdown.astro

@@ -1,10 +1,10 @@
 ---
-import { Dropdown, DropdownItems } from "astro-navbar";
+import { Dropdown as DropdownContainer, DropdownItems } from "astro-navbar";
 const { title, lastItem, children } = Astro.props;
 ---
 
 <li class="relative">
-  <Dropdown class="group">
+  <DropdownContainer class="group">
     <button
       class="flex items-center gap-1 w-full lg:w-auto lg:px-3 py-2 text-gray-600 hover:text-gray-900">
       <span>{title}</span>
@@ -43,5 +43,5 @@ const { title, lastItem, children } = Astro.props;
         </div>
       </div>
     </DropdownItems>
-  </Dropdown>
+  </DropdownContainer>
 </li>

src/pages/pricing.astro

@@ -2,7 +2,7 @@
 import Layout from "@layouts/Layout.astro";
 import Container from "@components/container.astro";
 import Sectionhead from "@components/sectionhead.astro";
-import Pricing from "@components/pricing.astro";
+import PricingCard from "@components/pricing.astro";
 
 const pricing = [
   {
@@ -68,13 +68,13 @@ const pricing = [
   <Container>
     <Sectionhead>
       <Fragment slot="title">Pricing</Fragment>
-      <Fragment slot="desc"
+      <Fragment slot="desc">
-        >Simple & Predictable pricing. No Surprises.</Fragment
+        Simple & Predictable pricing. No Surprises.
-      >
+      </Fragment>
     </Sectionhead>
 
     <div class="grid md:grid-cols-3 gap-10 mx-auto max-w-screen-lg mt-12">
-      {pricing.map((item) => <Pricing plan={item} />)}
+      {pricing.map((item) => <PricingCard plan={item} />)}
     </div>
   </Container>
 </Layout>