Neolithic Psychedelic Mushrooms

    @aotearoan/neon
    TypeScript icon, indicating that this package has built-in type declarations

    5.1.0 • Public • Published

    GitHub package.json version npm bundle size (scoped) GitHub last commit npm GitHub

    Documentation & Demo

    Full documentation is available on the demo site.

    Installation

    Install with NPM:

    npm install @aotearoan/neon

    or yarn:

    yarn add @aotearoan/neon

    Usage

    Javascript/Typescript

    Import components and supporting classes like so:

    import { Component, Vue } from 'vue-property-decorator';
    import { NeonLogo } from '@aotearoan/neon';
    
    @Component({
      components: {
        NeonLogo,
      },
    })
    export default class App extends Vue {}
    

    SASS

    First select a theme:

    • smooth
    • classic
    • sharp

    To use a theme without any customization simply import the basic theme file, e.g. to import the classic theme:

    @import '~@aotearoan/neon/themes/classic';
    

    If, however you would like to override/customize the theme then you need to include the following:

    .app {
      &.neon-theme--classic {
        // override colors, palettes and other basic variables here BEFORE importing the theme, e.g. $neon-color-primary: #bada55
        @import '~@aotearoan/neon/themes/classic/theme';
        // include custom app SASS here (you can use neon's defined variables, mixins and functions)
        &.neon-mode--dark {
          // override dark mode specific variables here, e.g. $neon-border-color: #bada55
          @import '~@aotearoan/neon/themes/classic/dark';
          // include custom app dark mode SASS here (you can use neon's defined variables, mixins and functions)
        }
        &.neon-mode--light {
          // override light mode specific variables here, e.g. $neon-border-color: #bada55
          @import '~@aotearoan/neon/themes/classic/light';
          // include custom app light mode SASS here (you can use neon's defined variables, mixins and functions)
        }
      }
    }
    

    Finally, the theme and mode (light/dark) need to be set on the document, e.g. to set the classic theme and dark mode:

    <html class="app neon neon-theme--classic neon-mode--dark">

    Stargazers repo roster for @aotearoan/neon

    Forkers repo roster for @aotearoan/neon

    Install

    npm i @aotearoan/neon

    DownloadsWeekly Downloads

    6

    Version

    5.1.0

    License

    MIT

    Unpacked Size

    2.03 MB

    Total Files

    314

    Last publish

    Collaborators

    • aotearoan