@funish/css

Funish CSS

A concise front-end CSS framework.

Funish CSS is Thus.Fun As part of the Funish project developed by the team, one of the development components of the web front-end interface was developed to CSS exists in a simple form, designed to implement Funish in a way that utilizes pure CSS code. Front-end design concepts.

Components

Layouts

• Flex
• Grid
• Position
• Visibility

Box model

• Margin
• Padding
• Width
• Height

Text

• Text
• Markdown

Controls

• Background
• Button
• Card
• Dropdown
• Form
• Menu
• Navbar
• Utility

Usage

CDN

Recommended for faster global response times from the Jsdelivr CDN.

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@funish/css@latest/dist/funish.min.css"
/>

NPM / Yarn

# npm
$ npm install @funish/css

# Or yarn
$ yarn add @funish/css

You can import the @funish/css style files from the node_modules directory.

@import '@funish/src/funish.scss';

Build

# install dependencies
$ yarn install

# serve with hot reload at localhost:3000
$ yarn dev

# build for production and launch server
$ yarn build
$ yarn start

# generate static website
$ yarn generate

# output final file
$ yarn output

For a detailed description of how it works, see nuxt.js docs and dart-sass.

Reference

• Material Components for the web - under the MIT license
• UIKit - under the MIT license
• Primer CSS - under the MIT license

License

• Code - MIT © Funish.net
• Documentation - CC-BY-NC-SA-4.0 © Funish.net