apeax-stylesheet

Code your Styles in new Way

Quick Start

npm install apeax-stylesheet

In Vanila Js or Ts

import { Styles } from "apeax-stylesheet";
import { Colors } from "apeax-colors";

new Styles() // -> returns Style object that can directly put to style on DOM
  .color("white")
  .background(Colors.CSS.green.hex)
  .background.Color("")
  .background.Clip("")
  .width("100vh")
  .height("")
  .max.Height("100rem")
  .display("flex")
  .flex.Content("center");

// More features will be added soon.....

In React Js or Ts

import { Styles } from "apeax-stylesheet";
import { Colors } from "apeax-colors";

function App() {
  return (
    <>
      <div style={style}></div>
    </>
  );
}

const style = new Styles()
  .color("white")
  .background(Colors.CSS.green.hex)
  .background.Color("")
  .background.Clip("")
  .width("100vh")
  .height("")
  .max.Height("100rem")
  .display("flex")
  .flex.Content("center").END as any;

// More features will be added soon.....

or for React Js row Stylesheet

import { Styles } from "apeax-stylesheet";
import { Colors } from "apeax-colors";

function App() {
  return (
    <>
      <div style={style.apps as any}></div>
    </>
  );
}

const styles = {
  apps: new Styles()
    .color("white")
    .background(Colors.CSS.green.hex)
    .background.Color("")
    .background.Clip("")
    .width("100vh")
    .height("")
    .max.Height("100rem")
    .display("flex")
    .flex.Content("center").END,
};

// More features will be added soon.....

Solid js styles also added

const style = new Styles()
    .color("white")
    .background(Colors.CSS.green.hex)
    .background.Color("")
    .background.Clip("")
    .width("100vh")
    .height("")
    .max.Height("100rem")
    .display("flex")
    .flex.Content("center")
    .compile_solid_js
    .END

// compile_solid_js will compile styles into solid styles

after 0.0.1 we will update row Stylesheet and create new Stylesheet that also provide animations and many more features in 0.0.2

This Package is in building mode any problem please inform me

• EMAIL: [email protected]