-
Notifications
You must be signed in to change notification settings - Fork 0
Home
Jnicocom edited this page Nov 5, 2021
·
18 revisions
m- es una librería CSS/JS creada por Jnico que facilita la maquetación de contenidos para la web de Movistar Colombia. 👊
Asegúrate de conocer esto antes de empezar.
- Botón
- Carrusel
- Tab
- Modal (próximamente)
- Acordeón (próximamente)
- Descubre API (próximamente)
- Escaleras (próximamente)
- Incluye las siguientes líneas antes de la etiqueta
</head>
:
HTML
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick-theme.css">
<link rel="stylesheet" href="https://descubre.movistar.co/m-/1.0.0.css">
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.js"></script>
- Después, incluye la siguiente línea justo antes de la etiqueta
</body>
:
HTML
<script href="https://descubre.movistar.co/m-/1.0.0.js">
(próximamente)
Para empezar a usar m- solo necesitas clases CSS que definen objetos y modificadores.
- Usa un objeto para crear la base:
HTML
<div class="m-objeto">
<!-- ... -->
</div>
- Luego, añade uno o varios modificadores para modificar sus características:
HTML
<div class="m-objeto m--modificador">
<!-- ... -->
</div>
- Los objetos siempre inician con
m-
mientras que los modificadores conm--
. - Los modificadores no deben ser usados sin primero definir su objeto.