bromero
/
OliviaMIA-Web-Astro


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
							---
import "../styles/global.css";
import Navbar from "../components/Navbar.astro";

interface Props {
  title: string;
  ogTitle?: string;
  ogImage?: string;
  ogUrl?: string;
  ogDescription?: string;
}

const { title, ogTitle, ogImage, ogUrl, ogDescription } = Astro.props;
---

<!doctype html>
<html lang="en" class="scroll-smooth">
  <head>
    <meta charset="UTF-8" />
    <meta name="description" content="Astro description" />
    <!-- <meta name="viewport" content="width=device-width" /> -->
    <meta property="og:title" content={ogTitle} />
    <meta property="og:image" content={ogImage} />
    <meta property="og:url" content={ogUrl} />
    <meta property="og:description" content={ogDescription} />
    <link rel="icon" type="image/ico+xml" href="/favicon.ico" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.1/css/all.min.css" integrity="sha512-5Hs3dF2AEPkpNAR7UiOHba+lRSJNeM2ECkwxUIxC1Q/FLycGTbNapWXB4tP889k5T5Ju8fs4b1P5z/iB4nMfSQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <meta name="generator" content={Astro.generator} />
    <title>{title}</title>
  </head>
  <body class="bg-amber-50">
   <header>
    <nav class="flex w-full h-16 justify-center">
        <a href="/"><img src="/img/logo oliva mia sin fondo.png" class="mt-4 h-16 w-56" alt="Logo Oliva Mia"></a>
        <ul class="flex space-x-6 text-base space-y-10 font-sans text-slate-800 md:space-x-16 md:text-xl">
           <li></li>
            <li class="text-slate-800 hover:text-gray-600"><a href="/Menu/">Menú</a></li>
            <li class="text-slate-800 hover:text-gray-600"><a href="/Productos/">Productos</a></li>
            <li class="text-slate-800 hover:text-gray-600"><a href="/Nosotros/">Nosotros</a></li>
            <li class="text-slate-800 hover:text-gray-600"><a href="/Contacto/">Contacto</a></li>
            <li>
              <a href="/Pedidos/">
                <i class="fa-solid fa-cart-shopping fa-lg"></i>
              </a>
            </li>
            <div class="flex space-x-3 md:space-x-2">
              <a href="https://www.instagram.com/olivamiadeli/" target="_blank" class="md:mb-2">
                <i class="fa-brands fa-square-instagram"></i>
              </a>

              <a href="#" class=" md:mb-3">
                <i class="fa-brands fa-facebook"></i>
              </a>
              <p class="text-base md:text-xl text-slate-800">@oliviamiadeli</p>
            </div>
        </ul>
    </nav>
    <hr class="my-7 w-full h-0.5 bg-lime-700 "/>
  </header>
    
    <main>
      <slot />
    </main>

    
    <footer class="bg-slate-800 w-full py-10 px-6">


      <div class="grid grid-cols-3 gap-4 items-center">

        <div class="text-white text-lg mx-24">
          <ul class="space-y-2">
            <li class="underline underline-offset-4 hover:ease-out transition-all duration-500 hover:scale-105 hover:no-underline">
              <a href="Nosotros/">Nosotros</a>
            </li>
            <li class="underline underline-offset-4 hover:ease-out transition-all duration-500 hover:scale-105 hover:no-underline">
              <a href="/Nosotros/#Equipo">Equipo</a>
            </li>
            <li class="underline underline-offset-4 hover:ease-out transition-all duration-500 hover:scale-105 hover:no-underline">
              <a href="/Nosotros/#Mision">Misión</a>
            </li>
            <li class="underline underline-offset-4 hover:ease-out transition-all duration-500 hover:scale-105 hover:no-underline">
              <a href="/Nosotros/#Vision">Visión</a>
            </li>
          </ul>
        </div>
    

        <div class="flex justify-center">
          <img src="/img/LogoOlivaMiaBlanco.png" alt="Logo Oliva Mia" class="w-52 h-36">
        </div>
    

        <div class="text-white text-lg flex justify-end mx-24">
          <ul class="space-y-2">
            <li class="underline underline-offset-4 hover:ease-out transition-all duration-500 hover:scale-105 hover:no-underline">
              <a href="TerminosCondiciones/">Términos y condiciones</a>
            </li>
            <li class="underline underline-offset-4 hover:ease-out transition-all duration-500 hover:scale-105 hover:no-underline">
              <a href="/TerminosCondiciones/#Privacidad">Aviso de privacidad</a>
            </li>
            <li class="underline underline-offset-4 hover:ease-out transition-all duration-500 hover:scale-105 hover:no-underline">
              <a href="/Nosotros/#Comentarios">Comentarios</a>
            </li>
            <li class="underline underline-offset-4 hover:ease-out transition-all duration-500 hover:scale-105 hover:no-underline">
              <a href="/TrabajaConNosotros/">Trabaja con nosotros</a>
            </li>
          </ul>
        </div>
      </div>
    

      <hr class="w-64 mx-auto my-8 border-gray-600" />
    

      <div class="flex justify-center space-x-6 mb-6">
        <a href="#" class="text-3xl text-white"><i class="fa-brands fa-facebook-f"></i></a>
        <a href="https://www.instagram.com/olivamiadeli" target="_blank" class="text-3xl text-white"><i class="fa-brands fa-instagram"></i></a>
        <a href="#" class="text-3xl text-white"><i class="fa-solid fa-phone"></i></a>
      </div>
    
      <p class="text-white text-center font-bold text-md">
        BLVD. NAVARRETE 512 ESQ. SAN BERNARDINO PLAZA CATALUNYA COL. CAPISTRANO HERMOSILLO, SONORA
      </p>
    
    </footer>
     
  </body>

  <style is:global>
    :root {
      --accent: 136, 58, 234;
      --accent-light: 224, 204, 250;
      --accent-dark: 49, 10, 101;
      --accent-gradient: linear-gradient(
        45deg,
        rgb(var(--accent)),
        rgb(var(--accent-light)) 30%,
        white 60%
      );
    }
    html {
      font-family: system-ui, sans-serif;
      scroll-behavior: smooth;
    }
    code {
      font-family:
        Menlo,
        Monaco,
        Lucida Console,
        Liberation Mono,
        DejaVu Sans Mono,
        Bitstream Vera Sans Mono,
        Courier New,
        monospace;
    }
  </style>
</html>