Instalación

Introducción

Introducción al Kit Digital Finis para desarrolladores

Para comenzar a usar los componentes del kit, se debe cargar la librería de componentes:

CSS

Copia y pega la hoja de estilos <link> dentro de la etiqueta <head> antes que cualquier otro estilo.


        
<link rel="stylesheet" href="https://kitdigital.finis.cl/recursos/css/main.css" />

Con el archivo enlazado ya puedes empezar a usar los componentes.

Javascript

Para activar la funcionalidad de los componentes interactivos (Collapses, modal, accordion, dropdown, etc.) debes agregar además el archivo Javascript antes del final de la etiqueta <body>


        <script src="https://kitdigital.finis.cl/recursos/js/main.js"></script>

Plantilla base

Agregando ambas etiquetas, puedes comenzar la construcción de un sitio usando los componentes. El HTML inicial debería lucir de la siguiente forma:


        


<!DOCTYPE html>


<html lang="es">


  <head>


    <meta charset="UTF-8" />


    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />


    <meta http-equiv="X-UA-Compatible" content="ie=edge" />


    <link rel="icon" type="image/png" href="URL/favicon.png"/>


    <link rel="stylesheet" href="https://kitdigital.finis.cl/recursos/css/main.css" />


    <title>Kit Digital UFT</title>


  </head>


  <body>


    <main class="container">


      <h1>Contenido</h1>


    </main>


  </body>


  <script src="https://kitdigital.finis.cl/recursos/js/main.js"></script>


</html>