Comenzando

Importaciones necesarias

Después de instalar Obelisco V2 o hacer el llamado a través de la CDN, es necesario importar ciertos complementos esenciales para asegurar el correcto funcionamiento y el estilo de los componentes de Obelisco V2. A continuación, se detallan los recursos que debes incluir en tu proyecto:

Estilos

Se deben importar los estilos provenientes del paquete de Obelisco v2.

<link rel="stylesheet" href="ruta/al/proyecto/dist/styles.css">

O puedes importarlo en tu hoja de estilos global.

@import "@gcba/obelisco-v2/dist/styles.css";

Tipografías Utilizadas

Obelisco V2 utiliza las tipografías Open Sans y Nunito para asegurar una apariencia moderna y profesional. Puedes incluirlas en tu proyecto utilizando los siguientes enlaces:

Open Sans:

<link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,600;0,700;1,400&display=swap" rel="stylesheet" />

Nunito:

<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700&display=swap" rel="stylesheet" />

Iconografía Utilizada

Obelisco V2 hace uso de la iconografía provista por Material Symbols y Boxicons. A continuación se detallan los recursos necesarios:

Boxicons:

npm install boxicons

O puedes utilizar la CDN:

<link href="https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css" rel="stylesheet" />

Material Symbols:

npm install material-symbols@latest

O puedes utilizar la CDN:

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@24,400,1,0"/>

Scripts Necesarios

Para asegurar el correcto funcionamiento de los componentes basados en Bootstrap 5, es necesario incluir los siguientes scripts:

<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js" integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" crossOrigin="anonymous"></script>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js" integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy" crossOrigin="anonymous"></script>