TigersWay / svelte-reading-bar

Reading progress bar (Svelte/Web Component/Custom Element)

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

reading-bar GitHub tag (latest by date) GitHub last commit GitHub issues

Usage

via CDN jsDelivr hits (npm)

<!doctype html>
<html class="no-js" lang="en">
<head>
...
<body>
  <reading-bar selector="article" height=".4em" background="linear-gradient(to right, green, lime)"></reading-bar>
...
  <script src="https://cdn.jsdelivr.net/npm/@tigersway/reading-bar@1.0.0" type="module"></script>
</body>
</html>

via npm/pnpm/yarn npm

... and your bundler!

import '@tigersway/reading-bar';

Options

  • selector: (default body) CSS selector for the readable part of that page,
  • height: (default 4px) CSS height of the bar,
  • background: (default linear-gradient(to right, #4169e1, #c6d2f6)) CSS background as color, gradient, etc

CHANGELOG

  • v1.0.0
    • First public release

About

Reading progress bar (Svelte/Web Component/Custom Element)

License:MIT License


Languages

Language:Svelte 61.7%Language:JavaScript 38.3%