@lumston/ds-angular 0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/lumston-ds-angular.mjs +3219 -0
- package/fesm2022/lumston-ds-angular.mjs.map +1 -0
- package/package.json +34 -0
- package/src/styles/_base.css +10 -0
- package/src/styles/_tokens.css +72 -0
- package/src/styles/index.css +25 -0
- package/types/lumston-ds-angular.d.ts +595 -0
- package/types/lumston-ds-angular.d.ts.map +1 -0
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
/* Lumston Design System — Design Tokens */
|
|
2
|
+
|
|
3
|
+
:root {
|
|
4
|
+
/* Primary */
|
|
5
|
+
--ls-color-primary: #4361ee;
|
|
6
|
+
--ls-color-primary-light: #eaf1ff;
|
|
7
|
+
--ls-color-primary-dark-light: rgba(67, 97, 238, 0.15);
|
|
8
|
+
|
|
9
|
+
/* Secondary */
|
|
10
|
+
--ls-color-secondary: #805dca;
|
|
11
|
+
--ls-color-secondary-light: #ebe4f7;
|
|
12
|
+
--ls-color-secondary-dark-light: rgb(128 93 202 / 15%);
|
|
13
|
+
|
|
14
|
+
/* Success */
|
|
15
|
+
--ls-color-success: #00ab55;
|
|
16
|
+
--ls-color-success-light: #ddf5f0;
|
|
17
|
+
--ls-color-success-dark-light: rgba(0, 171, 85, 0.15);
|
|
18
|
+
|
|
19
|
+
/* Danger */
|
|
20
|
+
--ls-color-danger: #e7515a;
|
|
21
|
+
--ls-color-danger-light: #fff5f5;
|
|
22
|
+
--ls-color-danger-dark-light: rgba(231, 81, 90, 0.15);
|
|
23
|
+
|
|
24
|
+
/* Error (alias of Danger) */
|
|
25
|
+
--ls-color-error: #e7515a;
|
|
26
|
+
--ls-color-error-light: #fff5f5;
|
|
27
|
+
--ls-color-error-dark-light: rgba(231, 81, 90, 0.15);
|
|
28
|
+
|
|
29
|
+
/* Warning */
|
|
30
|
+
--ls-color-warning: #e2a03f;
|
|
31
|
+
--ls-color-warning-light: #fff9ed;
|
|
32
|
+
--ls-color-warning-dark-light: rgba(226, 160, 63, 0.15);
|
|
33
|
+
|
|
34
|
+
/* Info */
|
|
35
|
+
--ls-color-info: #2196f3;
|
|
36
|
+
--ls-color-info-light: #e7f7ff;
|
|
37
|
+
--ls-color-info-dark-light: rgba(33, 150, 243, 0.15);
|
|
38
|
+
|
|
39
|
+
/* Dark */
|
|
40
|
+
--ls-color-dark: #3b3f5c;
|
|
41
|
+
--ls-color-dark-light: #eaeaec;
|
|
42
|
+
--ls-color-dark-dark-light: rgba(59, 63, 92, 0.15);
|
|
43
|
+
|
|
44
|
+
/* Black */
|
|
45
|
+
--ls-color-black: #0e1726;
|
|
46
|
+
--ls-color-black-light: #e3e4eb;
|
|
47
|
+
--ls-color-black-dark-light: rgba(14, 23, 38, 0.15);
|
|
48
|
+
|
|
49
|
+
/* White */
|
|
50
|
+
--ls-color-white: #ffffff;
|
|
51
|
+
--ls-color-white-light: #e0e6ed;
|
|
52
|
+
--ls-color-white-dark: #888ea8;
|
|
53
|
+
|
|
54
|
+
/* Typography */
|
|
55
|
+
--ls-font-family: 'Nunito', sans-serif;
|
|
56
|
+
|
|
57
|
+
/* Transitions */
|
|
58
|
+
--ls-transition-duration: 300ms;
|
|
59
|
+
|
|
60
|
+
/* Border radius */
|
|
61
|
+
--ls-border-radius-md: 0.375rem;
|
|
62
|
+
--ls-border-radius-lg: 0.5rem;
|
|
63
|
+
--ls-border-radius-full: 9999px;
|
|
64
|
+
|
|
65
|
+
/* Modal */
|
|
66
|
+
--ls-modal-z-index: 1000;
|
|
67
|
+
--ls-modal-backdrop-bg: rgba(0, 0, 0, 0.5);
|
|
68
|
+
|
|
69
|
+
/* Gradient */
|
|
70
|
+
--ls-gradient-start: #ef1262;
|
|
71
|
+
--ls-gradient-end: #4361ee;
|
|
72
|
+
}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/* Lumston Design System — All Styles */
|
|
2
|
+
|
|
3
|
+
@import './_tokens.css';
|
|
4
|
+
@import './_base.css';
|
|
5
|
+
@import '../inputs/button/button.styles.css';
|
|
6
|
+
@import '../inputs/checkbox/checkbox.styles.css';
|
|
7
|
+
@import '../inputs/icon-button/icon-button.styles.css';
|
|
8
|
+
@import '../inputs/radio-button/radio-button.styles.css';
|
|
9
|
+
@import '../inputs/slider/slider.styles.css';
|
|
10
|
+
@import '../inputs/switch/switch.styles.css';
|
|
11
|
+
@import '../typography/text/text.styles.css';
|
|
12
|
+
@import '../typography/tag/tag.styles.css';
|
|
13
|
+
@import '../typography/link/link.styles.css';
|
|
14
|
+
@import '../feedback/loader/loader.styles.css';
|
|
15
|
+
@import '../overlay/tooltip/tooltip.styles.css';
|
|
16
|
+
@import '../media/avatar/avatar.styles.css';
|
|
17
|
+
@import '../media/avatar-group/avatar-group.styles.css';
|
|
18
|
+
@import '../media/logo/logo.styles.css';
|
|
19
|
+
@import '../data-display/badge/badge.styles.css';
|
|
20
|
+
@import '../data-display/chip/chip.styles.css';
|
|
21
|
+
@import '../feedback/progress-bar/progress-bar.styles.css';
|
|
22
|
+
@import '../feedback/alert/alert.styles.css';
|
|
23
|
+
@import '../overlay/modal/modal.styles.css';
|
|
24
|
+
@import '../overlay/popover/popover.styles.css';
|
|
25
|
+
@import '../navigation/pagination/pagination.styles.css';
|