Softanic CSS Base

Our css base package on which all of our themes are build

🚩 Table of contents

• Built with
• Usage

Built with

| Name | Version | Description | | -------------------------------------------------- | ------- | ------------- | | @sass | 3.6.5 | CSS framework | | @softanic/icons | 1.0.1 | Icon library |

Usage

:wrench: Setup

$ npm i @softanic/styles

If you are using npm 8 or above you might need to add --legacy-peer-deps when running npm install

SCSS

In order to use this package import the package in your main.scss file.

Importing the styles

// @/theme/vendors/_softanic.scss

@import '@softanic/styles';

Overriding the imported styles

// @/theme/vendors/_softanic.scss

@use '@softanic/styles' with (
  $primary: (
    light: (
      900: #00359E,
      800: #0040C1,
      700: #004EEB,
      600: #155EEF,
      500: #2970FF,
      400: #528BFF,
      300: #84ADFF,
      200: #B2CCFF,
      100: #D1E0FF,
      50: #EFF4FF,
      25: #F5F8FF
    ),
    dark: (
      900: #00359E,
      800: #0040C1,
      700: #004EEB,
      600: #155EEF,
      500: #2970FF,
      400: #528BFF,
      300: #84ADFF,
      200: #B2CCFF,
      100: #D1E0FF,
      50: #EFF4FF,
      25: #F5F8FF
    )
  )
);