https://github.com/darlanmendonca/minimalist

a complete and responsive interface for web
https://github.com/darlanmendonca/minimalist

custom-elements-v1 ui-kit web-components

Last synced: 3 months ago
JSON representation

a complete and responsive interface for web

• Host: GitHub
• URL: https://github.com/darlanmendonca/minimalist
• Owner: darlanmendonca
• Created: 2018-01-10T15:54:10.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2019-07-17T20:35:53.000Z (almost 7 years ago)
• Last Synced: 2025-02-23T10:24:36.382Z (over 1 year ago)
• Topics: custom-elements-v1, ui-kit, web-components
• Language: JavaScript
• Homepage: https://darlanmendonca.github.io/minimalist/
• Size: 3.38 MB
• Stars: 3
• Watchers: 2
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
[![Build Status](https://travis-ci.org/darlanmendonca/minimalist.svg?branch=master)](https://travis-ci.org/darlanmendonca/minimalist)

[![MIT Licence](https://badges.frapsoft.com/os/mit/mit.svg?v=103)](https://opensource.org/licenses/mit-license.php)

## minimalist-ui

A UI Kit for Web, based in web components (using Custom Elements), ready to be used with or without any framework.

```sh

npm install minimalist-ui

```

##### forms

- [form](./src/form)

- [input-text](./src/input-text)

- [input-password](./src/input-password)

- [input-email](./src/input-email)

- [input-number](./src/input-number)

- [button](./src/button)

##### content

- [sidenav](./src/sidenav)

- [dialog](./src/dialog)

##### styles

- [layout](./src/layout)

- [backdrop](./src/backdrop)

- [section](./src/section)

### How it works

Each component in minimalist, has a single core writed with a ES6 class, following the Custom Elements API v1 and providing a complete style ready to be used or customized using CSS Variables.

All is designed to allow inheritance between components, e.g. `` defines a input text in appearance and behaviors like a disabled state. But if you need a input number, `` extends `mn-input-text` style and common behaviors, but implements new features like increment/decrement using arrow keys, or min/max parameters.

Each feature is built with three things in mind

- keep it simple

- respect different framework architectures

- identity can be changed totally