Vue Simple

website·Indexed 29 days ago

https://vuesimple.netlify.app/

A collection of lightweight Vue packages and components including UI elements like Autocomplete, Accordion, Datepicker, Modal, and Timeline, as well as utility classes for colors, spacing, typography, and grid layouts.

Tokens
14.4K
Snippets
100
Records
130
Agent score
73%

What's inside Vue Simple

  1. Use @vuesimple/vs-accordion via CDN

    Include the library via jsDelivr and register the plugin in your Vue application entry file.
    <!-- HTML -->
    <script src="https://cdn.jsdelivr.net/npm/@vuesimple/vs-accordion@3.1.7/dist/index.min.js"></script>
    // Main/Entry file
    app.use(VsAccordion.plugin);
  2. Include @vuesimple/vs-toast via CDN

    You can include the toast library directly in your HTML using the jsDelivr CDN.
    <script src="https://cdn.jsdelivr.net/npm/@vuesimple/vs-toast@3.1.7/dist/index.min.js"></script>
  3. Integrate @vuesimple/vs-loader via CDN

    Include the loader via a script tag and register the plugin in your main entry file using app.use(VsLoader.plugin).
    <!-- Script tag -->
    <script src="https://cdn.jsdelivr.net/npm/@vuesimple/vs-loader@3.1.7/dist/index.min.js"></script>
    // Main/Entry file
    app.use(VsLoader.plugin);
    <!-- Template usage -->
    <template>
      <vs-loader variant="pulse"></vs-loader>
    </template>
  4. Install @vuesimple/vs-tooltip

    Install the tooltip component via npm or include it via CDN.
    npm i @vuesimple/vs-tooltip
    <!-- CDN Option -->
    <script src="https://cdn.jsdelivr.net/npm/@vuesimple/vs-tooltip@3.1.7/dist/index.min.js"></script>
  5. Use @vuesimple/vs-modal via CDN

    Include the vs-modal script via jsDelivr and register the plugin in your Vue application entry file.
    <!-- HTML -->
    <script src="https://cdn.jsdelivr.net/npm/@vuesimple/vs-modal@3.1.7/dist/index.min.js"></script>
    // Main/Entry file
    app.use(VsModal.plugin);