PipUI

Начало работы

Фреймворк PipUI использует несколько внешних библиотек, которые дополняют фреймворк иконкми, скриптами и эффектами. А именно: Font Awesome(v6), JQuery, JQuery Easing

Для начала работы, требуется подключение всех необходимых скриптов и стилей между тегами <head>. Скачать фреймворк PipUI можно на странице скачивания

Подключение скриптов

HTML

<!-- Font Awesome -->

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/js/all.min.js"></script>

<!-- JQuery -->

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<!-- JQuery Easing -->

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>

<!-- PipUI CDN -->

<link rel="stylesheet" href="https://cdn.pipui.ru/latest/dist/css/bundles/pipui.min.css" />

<link rel="stylesheet" href="https://cdn.pipui.ru/latest/dist/css/bundles/pipui-responsive.min.css" />

<script src="https://cdn.pipui.ru/latest/dist/js/bundles/pipui.min.js"></script>

Если вы желаете использовать компоненты по отдельности, то для работы потребуется подключить основной базовый компонент
HTML

<!-- PipUI Base Component -->

<link rel="stylesheet" href="https://cdn.pipui.ru/latest/src/css/base.css" />

<link rel="stylesheet" href="https://cdn.pipui.ru/latest/src/css/base-responsive.css" />

<script src="https://cdn.pipui.ru/latest/src/js/base.js"></script>

<!-- Other Components Here -->

Шаблон базовой разметки PipUI

HTML

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>PipUI</title>

    <!-- Font Awesome -->

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" />

    <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/js/all.min.js"></script>

    <!-- JQuery -->

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

    <!-- JQuery Easing -->

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>

    <!-- PipUI CDN -->

    <link rel="stylesheet" href="https://cdn.pipui.ru/latest/src/css/base.css" />

    <link rel="stylesheet" href="https://cdn.pipui.ru/latest/src/css/base-responsive.css" />

    <script src="https://cdn.pipui.ru/latest/src/js/base.js"></script>

</head>

<body>

    <!-- Your code here -->

</body>

</html>