Svelte component to display time distances in a human readable format.

Overview

Time Distance

Display time distances in a human readable format.

  • Based on date-fns
  • Updates every 60 seconds

View demo

Usage

Install package:

pnpm i -D svelte-time-distance

Add to your UI:

<!-- Example.svelte -->
<script>
  import { TimeDistance } from 'svelte-time-distance'

  let timestamp = new Date()
</script>

<TimeDistance {timestamp} class="jumbo" />

License

MIT

You might also like...

A ✨light✨ and magical Svelte component for CSS media queries🐹

Svelte CSS media queries 🐥 Demo - Svelte REPL Lightweight, comfortable, like Svelte 🐣 how to install npm i svelte-media-queries What can I do? quer

Dec 26, 2022

👇 Bread n butter utility for component-tied mouse/touch gestures in Svelte.

👇 Bread n butter utility for component-tied mouse/touch gestures in Svelte.

svelte-gesture svelte-gesture is a library that lets you bind richer mouse and touch events to any component or view. With the data you receive, it be

Dec 21, 2022

CodePlay is a Web App that helps the user to input HTML,CSS and JS code in the Code editors and display the resultant web page in real-time

CodePlay is a Web App that helps the user to input HTML,CSS and JS code in the Code editors and display the resultant web page in real-time

CodePlay A codepen clone Setup Clone repository Create and go to the directory where you want to place the repository cd my-directory Clone the proj

Sep 24, 2022

Render readable & responsive tables in the terminal

terminal-columns Readable tables for the terminal. Tables can be automatically responsive! Features Content wrapped to fit column width Column widths

Oct 28, 2022

⛲ Sort import declarations into a pleasing and readable cascade.

⛲ eslint-plugin-cascading-imports This plugin allows to automatically enforce a visual "cascading" order for import declarations. Imports in each bloc

Jan 20, 2022

A compiled-away, type-safe, readable RegExp alternative

🦄 magic-regexp A compiled-away, type-safe, readable RegExp alternative ✨ Changelog 📖 Documentation ▶️ Online playground Features Runtime is zero-dep

Jan 8, 2023

Library for readable and manageable Next.js middleware

🧵 Next Compose Middleware This is a library for building Next.js complex middleware declaratively. You can create highly readable and manageable midd

Dec 19, 2022

Minimalistic configuration for TS to only extend JS with types. No TS features, no bundling. Readable maintainable code after compilation.

Minimalistic configuration for TS to only extend JS with types. No TS features, no bundling. Readable maintainable code after compilation.

ts-guideline Minimalistic configuration for TS to only extend JS with types. No TS-scpecific features, no bundling. Readable maintainable code after c

Dec 22, 2022

Wrap zod validation errors in user-friendly readable messages

zod-validation-error Wrap zod validation errors in user-friendly readable messages. Features User-friendly readable messages, configurable via options

Dec 23, 2022
Owner
Joshua Nussbaum
Joshua Nussbaum
Enhanced interval features for Node.js, such as promisified interval and human readable time parsing.

Interval-next Interval-next is a package that extends Javascript's built-in setInterval() capabilities. You have a plain and promisified interval meth

Snowy 5 Jul 28, 2022
Send encrypted and decrypted messages with verifiable keys and human readable names.

zooko-msg Encrypt and decrypt messages using AES with a preshared ECDH key generated using keys associated with Handshake names. I noticed that there

Publius Federalist 31 Jul 27, 2022
Convert JSON to human readable HTML

json.human.js: Json Formatting for Human Beings A small library to convert a JSON object into a human readable HTML representation that is easy to sty

Mariano Guerra 955 Dec 3, 2022
parses human-readable strings for JavaScript's Temporal API

?? temporal-parse What is the temporal-parse? Temporal is the next generation of JavaScript's standard Date API. It's currently proposed to TC39 (see:

Eser Ozvataf 22 Jan 2, 2023
Module to convert units for distances, weights and temperatures!

Unit Converter (Distance, Temperature, Weights) Every unit you can see in this file can be transformed into any of the other units. The Calculator wor

Niklas Koch 8 Jan 27, 2022
this is a single-page web application. we built a book website where the user can add , remove and display books. we used modules to implement these functionalities. also, we used the Date class to display the date and time.

Awsome Books In this Project, we have built A Books websites. Built With ?? HTML CSS javascript Git & Github Live Demo Here you can find the live Demo

Nedjwa Bouraiou 10 Aug 3, 2022
An npm package for demonstration purposes using TypeScript to build for both the ECMAScript Module format (i.e. ESM or ES Module) and CommonJS Module format. It can be used in Node.js and browser applications.

An npm package for demonstration purposes using TypeScript to build for both the ECMAScript Module format (i.e. ESM or ES Module) and CommonJS Module format. It can be used in Node.js and browser applications.

Snyk Labs 57 Dec 28, 2022
A Svelte parser that compiles to Mitosis JSON, allowing you to write Svelte components once and compile to every framework.

Sveltosis Still in development A Svelte parser that compiles to Mitosis JSON, allowing you to write Svelte components once and compile to every framew

sveltosis 70 Nov 24, 2022
A public board for all the Computer Society and Students to display their profile. An online year-book for you to display your profile in the most creative manner

Student's Yearbook by IEEE Computer Society Student's yearbook is an open-source project which intends to dispaly the students who will be graduating

IEEE Computer Society 11 Dec 18, 2022
Svelte component to render markdown.

svelte-exmarkdown Svelte component to render markdown. Motivation svelte-markdown is a good component package. However, it is not extensible. You cann

Sotaro Tommykawa 43 Jan 6, 2023