@morphosium/xcelsior NPM

Attention: This project will not be maintained anymore and i have no relationship with that organisation. You can follow me on Linkedin, Github (huseyincangunduz) or instagram (hcangunduz.dev) for fore open source libraries and etc.

xcelsior (alpha)

Xcelsior helps creating user interfaces containers and it makes developing views with sidebar easier.

Demonstration

How to use?

Install xcelsior by downloading files or using package manager:
```
  npm i @morphosium/xcelsior
```
or
```
  yarn add @morphosium/xcelsior
```

Import CSS and JS files (if you want make sidebars mobile safe)

  <head>
      <link rel="stylesheet" href="../build/css/index.css">
  </head>
  <body>
      <!-- UI Elements -->
      <script src="../build/js/bundle/xcelsior.js"></script>
      <!-- another scripts -->
  </body>

If you consider use at a module, import necessary modules by:

  import { MobileSidebarUtil } from "@morphosium/xcelsior";

And import styles by (if you using webpack or something)
```
  @import "~@morphosium/xcelsior/index.css";
```

All element definitions must be at
```
  <xcelsior-root>

  </xcelsior-root>
```

Grids

<xcelsior-root>
     <xcelsior-grid-view class="main-sidebar mobile-view-safe">
        <div class="sidebar" style="width: 300px;" section-name="right">
            <h1>Right</h1>
        </div>
        <div class="content">
            <h1>content</h1>
        </div>
        <div class="sidebar" style="width: 300px;" section-name="left">
            <h1>Left</h1>
        </div>
    </xcelsior-grid-view>
</xcelsior-root>