From 6a5ffe965c5f141a9d83b0d8067e545b7e81f95a Mon Sep 17 00:00:00 2001 From: spwoodcock Date: Wed, 11 Sep 2024 10:10:52 +0100 Subject: [PATCH] docs: update readme with top center alignment, reword slightly --- README.md | 88 ++++++++++++++++++++++++++++++++++++++++--------------- 1 file changed, 65 insertions(+), 23 deletions(-) diff --git a/README.md b/README.md index 01955b8..3acfee9 100644 --- a/README.md +++ b/README.md @@ -1,28 +1,68 @@ - - -[![Release](https://github.com/hotosm/ui/actions/workflows/publish.yml/badge.svg?event=release)](https://github.com/hotosm/ui/actions/workflows/publish.yml/) -[![CDN Deploy](https://github.com/hotosm/ui/actions/workflows/cdn_deploy.yml/badge.svg?branch=main)](https://github.com/hotosm/ui/actions/workflows/cdn_deploy.yml) -[![Docs](https://github.com/hotosm/ui/actions/workflows/docs.yml/badge.svg)](https://github.com/hotosm/ui/actions/workflows/docs.yml) -[![Package Version](https://img.shields.io/npm/v/%40hotosm/ui?color=334D058)](https://www.npmjs.com/package/@hotosm/ui) -[![Downloads](https://img.shields.io/npm/dm/%40hotosm%2Fui)](https://npmtrends.com/@hotosm/ui) -[![License](https://img.shields.io/github/license/hotosm/ui.svg)](https://github.com/hotosm/ui/blob/main/LICENSE.md) - -# HOT UI - -## Shared UI components with HOT theming - -### HOT themed UI components to reduce code duplication and make live easier for developers, available as [Web Components](https://developer.mozilla.org/en-US/docs/Web/API/Web_components) with support for usage in [almost all](https://custom-elements-everywhere.com) modern web frameworks. - -The main goal of this project is not to re-invent the wheel, or add an extra burden of development and maintenance. +# HOT Shared UI + + +

+ HOT +

+

+ Shared Web Components with theming for use across HOTOSM tools. +

+

+ + Publish + + + CDN Deploy + + + Publish Docs + + + Package version + + + Downloads + + + License + +

+ +

+ 📖 Documentation: + https://hotosm.github.io/ui/
+

+ +

+ 🖥️ Source Code: + https://github.com/hotosm/ui
+

+ +

+ 🎯 Roadmap / Tasks: + https://github.com/orgs/hotosm/projects/37/views/3 +

+ + + +--- -📖 **Documentation**: https://hotosm.github.io/ui/ +## Shared UI Components with HOT Theming -🖥️ **Source Code**: https://github.com/hotosm/ui +This repository contains HOT themed UI components to reduce code duplication +and simplify the lives of developers needing to prototype and develop well +designed web applications quickly. -🎯 **Roadmap / Tasks**: https://github.com/orgs/hotosm/projects/37/views/3 +They are available as +[Web Components](https://developer.mozilla.org/en-US/docs/Web/API/Web_components) +with support for usage in [almost all](https://custom-elements-everywhere.com) +modern web frameworks. ---- +The main goal of this project is not to re-invent the wheel, or add an extra burden +of development and maintenance. ## Quick start @@ -97,7 +137,7 @@ import '@hotosm/ui/components/button/button'; Can't Click Me ``` -### React +### React Shoelace Wrappers ```js import { Button } from '@hotosm/ui/components'; @@ -109,7 +149,8 @@ import { Button } from '@hotosm/ui/components'; ### Examples -You can found examples for HTML and also all common frameworks (React, Svelte, Vue) under `/examples`. +You can found examples for HTML and also all common frameworks +(React, Svelte, Vue) under `/examples`. ### Development @@ -143,4 +184,5 @@ For **styling**, we have 2 important files under `/theme`: ### License -HOT UI is free and open source software! you may use any HOT UI project under the terms of the GNU Affero General Public License (AGPL) Version 3. +HOT UI is free and open source software! you may use any HOT UI project under the +terms of the GNU Affero General Public License (AGPL) Version 3.