0.7.138 • Published 2 years ago

@rxdi/ui-kit v0.7.138

Weekly downloads
94
License
MIT
Repository
github
Last release
2 years ago

@rxdi/ui-kit

DEMO

Installation

npm i @rxdi/ui-kit

Usage

Import ReactiveUiModule inside AppModule, this step will inject for us default providers

import { Module } from '@rxdi/core';
import { ReactiveUiModule } from '@rxdi/ui-kit';

@Module({
  imports: [
    ReactiveUiModule.forRoot()
  ]
})
export class AppModule {}

Using Components

import { Module } from '@rxdi/core';
import { AppComponent } from './app.component';
import { AccordionComponent } from '@rxdi/ui-kit/accordion';
import { MarkdownReaderComponent } from '@rxdi/ui-kit/markdown-reader';
import { RxImageComponent } from '@rxdi/ui-kit/image';
import { ReactiveUiModule } from '@rxdi/ui-kit';
import { GridComponent } from '@rxdi/ui-kit/grid';
import { BadgeComponent } from '@rxdi/ui-kit/badge';

@Module({
  components: [
    MarkdownReaderComponent,
    AccordionComponent,
    RxImageComponent,
    GridComponent,
    BadgeComponent
  ],
  imports: [
    ReactiveUiModule.forRoot({
      palettes: {
        root: css`
          :root {
            --bp-s: 640px;
            --bp-m: 960px;
            --bp-l: 1200px;
            --bp-xl: 1600px;
          }
        `,
        danger: css`
          :root {
            --danger-bg-color: #f0506e;
            --danger-color: #fff;
            --danger-border: 1px solid transparent;
            --danger-hover-color: #ee395b;
            --danger-active-color: #ec2147;
          }
        `,
        default: css`
          :root {
            --default-bg-color: transparent;
            --default-color: #222;
            --default-border: 1px solid #e5e5e5;
            --default-hover-color: transparent;
            --default-hover-border: 1px solid #999;
          }
        `,
        primary: css`
          :root {
            --primary-bg-color: #1e87f0;
            --primary-color: #fff;
            --primary-border: 1px solid transparent;
            --primary-hover-color: #0f7ae5;
            --primary-active-color: #0e6dcd;
          }
        `, 
        secondary: css`
          :root {
            --secondary-bg-color: #222;
            --secondary-color: #fff;
            --secondary-border: 1px solid transparent;
            --secondary-hover-color: #333;
            --secondary-active-color: #000;
          }
        `, 
        warning: css`
          :root {
            --warning-bg-color: #faa05a;
            --warning-color: #fff;
            --warning-border: 1px solid transparent;
            --warning-hover-color: #e19457;
            --warning-active-color: #ef9a56;
          }
        `
      }
    }),
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

Components

Ready

In Progress

Services

0.7.138

2 years ago

0.7.137

2 years ago

0.7.136

2 years ago

0.7.135

3 years ago

0.7.130

3 years ago

0.7.132

3 years ago

0.7.131

3 years ago

0.7.134

3 years ago

0.7.133

3 years ago

0.7.129

4 years ago

0.7.128

4 years ago

0.7.127

4 years ago

0.7.121

4 years ago

0.7.123

4 years ago

0.7.122

4 years ago

0.7.125

4 years ago

0.7.124

4 years ago

0.7.126

4 years ago

0.7.120

4 years ago

0.7.119

5 years ago

0.7.118

5 years ago

0.7.117

5 years ago

0.7.116

5 years ago

0.7.115

5 years ago

0.7.114

5 years ago

0.7.113

5 years ago

0.7.112

5 years ago

0.7.110

5 years ago

0.7.111

5 years ago

0.7.109

5 years ago

0.7.108

5 years ago

0.7.107

5 years ago

0.7.106

5 years ago

0.7.105

5 years ago

0.7.104

5 years ago

0.7.101

5 years ago

0.7.103

5 years ago

0.7.102

5 years ago

0.7.100

5 years ago

0.7.99

5 years ago

0.7.98

5 years ago

0.7.97

5 years ago

0.7.96

5 years ago

0.7.95

5 years ago

0.7.94

5 years ago

0.7.93

5 years ago

0.7.92

5 years ago

0.7.91

5 years ago

0.7.90

5 years ago

0.7.89

5 years ago

0.7.88

5 years ago

0.7.87

5 years ago

0.7.86

5 years ago

0.7.85

5 years ago

0.7.84

5 years ago

0.7.83

5 years ago

0.7.82

5 years ago

0.7.79

5 years ago

0.7.78

5 years ago

0.7.80

5 years ago

0.7.81

5 years ago

0.7.77

5 years ago

0.7.76

5 years ago

0.7.75

5 years ago

0.7.74

5 years ago

0.7.73

5 years ago

0.7.72

5 years ago

0.7.71

5 years ago

0.7.70

5 years ago

0.7.69

5 years ago

0.7.68

5 years ago

0.7.67

5 years ago

0.7.66

5 years ago

0.7.65

5 years ago

0.7.64

5 years ago

0.7.63

5 years ago

0.7.62

5 years ago

0.7.61

5 years ago

0.7.59

5 years ago

0.7.58

5 years ago

0.7.55

5 years ago

0.7.54

5 years ago

0.7.57

5 years ago

0.7.56

5 years ago

0.7.53

5 years ago

0.7.51

5 years ago

0.7.50

5 years ago

0.7.52

5 years ago

0.7.49

6 years ago

0.7.48

6 years ago

0.7.47

6 years ago

0.7.46

6 years ago

0.7.45

6 years ago

0.7.44

6 years ago

0.7.43

6 years ago

0.7.42

6 years ago

0.7.41

6 years ago

0.7.39

6 years ago

0.7.38

6 years ago

0.0.6

6 years ago

0.0.5

6 years ago

0.0.4

6 years ago

0.0.3

6 years ago

0.0.2

6 years ago

0.0.1

6 years ago

0.0.0

6 years ago