cardano-lsd

If youd like to show us some support to do this more often. You can send ADA or gifts to our ADA Handle

| Statements | Branches | Functions | Lines | | --------------------------- | ----------------------- | ------------------------- | ----------------- | | | | | |

Reusable cardano frontend components focused on animations. (Frontend Agnostic) With the whole idea of making everything built on cardano, way more visually appealing.

For more documentation please go to Documents

Must Know Dependencies

Must adhere to licensing requirements in internal packages. https://greensock.com/licensing/

Standard "No Charge" GreenSock License Copyright 2006-2021, GreenSock, Inc. Plain English Summary: You may use the code at no charge in commercial or non-commercial apps, web sites, games, components, and other software as long as end users are not charged a fee of any kind to use your product or gain access to any part of it. If your client pays you a one-time fee to create the site/product, that's perfectly fine and qualifies under the "no charge" license. If end users are charged a usage/access/license fee, please sign up for a "Business Green" Club GreenSock membership which comes with a comprehensive commercial license. See https://greensock.com/club/ for details. Use at your own risk. No warranties are offered. Please respect the copyright.

Table of contents

• Features
• Installation
• Documentation
• Examples
  • animated cardano spinner (React Functional)
• Development
  • Workspace setup
  • Test
  • Test coverage
• Style guidelines
• Docs generation

Features

• [X] CardaNostraAdaSpinner
• [ ] To be added

Installation

Install the library using npm:

npm install cardano-lsd

Documentation

Examples

animated cardano spinner

import React, { useEffect } from "react";
import "./App.css";
import { CardaNostraAdaSpinner } from "cardano-lsd";
const App = () => {
  let spinner;
  useEffect(() => {
    // eslint-disable-next-line react-hooks/exhaustive-deps
    spinner = new CardaNostraAdaSpinner({id:"ada-spinning"});
    spinner.attachSVG();
  },[]);
    return (
      <div id="App">
        
      <div style={{display: "flex", margin: "0px", padding: "0px", width: "100%", backgroundColor: "pink", opacity: "50%" }} id={"ada-spinning"}></div>
      </div>
    );
}

export default App;

import { CardaNostraAdaSpinner } from "cardano-lsd";

spinner = new CardaNostraAdaSpinner({id:"ada-spinning", color:"", delay:0.2, duration:4});
spinner.attachSVG();

<div id={"ada-spinning"}></div>

Development

Clone from git ``git clone https://github.com/CardanoGoat-io/cardano-lsd.git

Install dependencies: ``npm install

Build: ``npm run build

Build package with watcher: ``npm start

Workspace setup

Clone the repository:

git clone https://github.com/CardanoGoat-io/cardano-lsd.git

Test

cardano-lsd uses [package](jest, jsdom, pupeteer) for unit testing.

Run all tests: ``npm test

Test coverage

We use Package to calculate the test coverage.

Run all tests and get coverage: ``npm run coverage

Style guidelines

Docs generation

The majority of package documentation is created by the docstrings in python files. We use sphinx with Read the Docs theme to generate the html pages.

Build docs and open the docs in browser:

make html