@baianat/base.framework

    0.0.18 • Public • Published

    Base

    A solid base to establish your favorite websites with user experience in mind.

    Inspired by the user's own experience needs, we decided to implement a design system to serve as a solid basis for very simple, yet elegant websites to deliver a complexity-free environment.

    Main Features

    • Supports native CSS variables.
    • Works well with SVG out of the box.
    • Offers some of the simplistic UI elements out there.
    • Intelligent grid system based on Flex-box.
    • Built using Stylus preprocessor.
    • User-friendly documentation with editable code snippets.

    Getting Started

    Installation

    Using npm

    npm install @baianat/Base.framework --save
    #or using yarn 
    yarn add @baianat/Base.framework

    HTML Layout

    <!doctype html>
    <html lang="en">
      <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
     
        <!-- Base -->
        <link rel="stylesheet" href="./@baianat/framework/dist/css/base.css">
     
        <!-->Or if you want to use cssVar version <-->
        <link rel="stylesheet" href="./@baianat/framework/dist/css/Base.cssvar.css">
     
        <title>Base</title>
      </head>
      <body>
     
      ...
     
      </body>
    </html>

    Webpack Configuration

    Add the following rule to the Webpack configuration file

    {
      test: /.styl$/,
      loader: 'style-loader!css-loader!stylus-loader?resolve url'
    }

    Working with styles

    In your main styling file app.styl, before including the Base main file, make sure to add the needed variables, according to your customization preferences.

    $margin = 2px
    $red    = #E13C31
    @import "~@baianat/Base.framework/base"

    License

    MIT

    Copyright (c) 2017 Baianat

    Install

    npm i @baianat/base.framework

    DownloadsWeekly Downloads

    28

    Version

    0.0.18

    License

    MIT

    Unpacked Size

    1.01 MB

    Total Files

    156

    Last publish

    Collaborators

    • baianaters