@progressio_resources/gravity-design-system 1.0.0

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.
@@ -0,0 +1,3 @@
1
+ The content of this software and of each of the elements that make it up is protected by industrial and intellectual property rights owned by Safebits.
2
+
3
+ Copyright © 2022. All rights reserved.
package/README.md ADDED
@@ -0,0 +1,24 @@
1
+ # GravityDesignSystem
2
+
3
+ This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 15.2.0.
4
+
5
+ ## Code scaffolding
6
+
7
+ Run `ng generate component component-name --project gravity-design-system` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project gravity-design-system`.
8
+ > Note: Don't forget to add `--project gravity-design-system` or else it will be added to the default project in your `angular.json` file.
9
+
10
+ ## Build
11
+
12
+ Run `ng build gravity-design-system` to build the project. The build artifacts will be stored in the `dist/` directory.
13
+
14
+ ## Publishing
15
+
16
+ After building your library with `ng build gravity-design-system`, go to the dist folder `cd dist/gravity-design-system` and run `npm publish`.
17
+
18
+ ## Running unit tests
19
+
20
+ Run `ng test gravity-design-system` to execute the unit tests via [Karma](https://karma-runner.github.io).
21
+
22
+ ## Further help
23
+
24
+ To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
@@ -0,0 +1,10 @@
1
+ {
2
+ "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
3
+ "dest": "../../dist/gravity-design-system",
4
+ "lib": {
5
+ "entryFile": "src/public-api.ts"
6
+ },
7
+ "assets": [
8
+ "src/lib/styles/**/**/**/*.scss"
9
+ ]
10
+ }
package/package.json ADDED
@@ -0,0 +1,14 @@
1
+ {
2
+ "name": "@progressio_resources/gravity-design-system",
3
+ "description": "Gravity Design System",
4
+ "version": "1.0.0",
5
+ "license": "SEE LICENSE IN LIBRARY-LICENSE",
6
+ "peerDependencies": {
7
+ "@angular/common": "^15.2.0",
8
+ "@angular/core": "^15.2.0"
9
+ },
10
+ "dependencies": {
11
+ "tslib": "^2.3.0"
12
+ },
13
+ "sideEffects": false
14
+ }
@@ -0,0 +1,13 @@
1
+ import {Component} from '@angular/core';
2
+
3
+ @Component({
4
+ selector: 'lib-gravity-design-system',
5
+ template: `
6
+ <p>
7
+ gravity-design-system works!
8
+ </p>
9
+ `,
10
+ styles: []
11
+ })
12
+ export class GravityDesignSystemComponent {
13
+ }
@@ -0,0 +1,13 @@
1
+ import {NgModule} from '@angular/core';
2
+ import {GravityDesignSystemComponent} from './gravity-design-system.component';
3
+
4
+ @NgModule({
5
+ declarations: [
6
+ GravityDesignSystemComponent
7
+ ],
8
+ exports: [
9
+ GravityDesignSystemComponent
10
+ ]
11
+ })
12
+ export class GravityDesignSystemModule {
13
+ }
@@ -0,0 +1,5 @@
1
+ import {Injectable} from '@angular/core';
2
+
3
+ @Injectable({providedIn: 'root'})
4
+ export class GravityDesignSystemService {
5
+ }
@@ -0,0 +1,81 @@
1
+ //Primitives variables for hero
2
+ $b100: #04163f;
3
+ $b200: #031a4e;
4
+ $b300: #022575;
5
+ $b400: #073baf;
6
+ $b500: #034fc9;
7
+ $b600: #a3bcdc;
8
+ $b700: #cbe2ff;
9
+ $b800: #e7f1ff;
10
+
11
+ $g100: #004327;
12
+ $g200: #055936;
13
+ $g300: #20662e;
14
+ $g400: #a5d7c2;
15
+ $g500: #ccfae7;
16
+ $g600: #e8fff5;
17
+
18
+ $n100: #151c29;
19
+ $n200: #1e283a;
20
+ $n300: #394c6e;
21
+ $n400: #415881;
22
+ $n500: #97a4bd;
23
+ $n600: #d6dce5;
24
+ $n700: #f4f6f9;
25
+ $n800: #ffffff;
26
+
27
+ $o100: #3c2000;
28
+ $o200: #542503;
29
+ $o300: #ff9d57;
30
+ $o400: #ffb27b;
31
+ $o500: #ffd2b2;
32
+
33
+ $r100: #310101;
34
+ $r200: #7c1111;
35
+ $r300: #a01313;
36
+ $r400: #b01717;
37
+ $r500: #f19999;
38
+ $r600: #ffc3c3;
39
+ $r700: #ffdede;
40
+
41
+ //This class must be only for gallery implementation
42
+ .hero-primitives {
43
+ --b100: #04163f;
44
+ --b200: #031a4e;
45
+ --b300: #022575;
46
+ --b400: #073baf;
47
+ --b500: #034fc9;
48
+ --b600: #a3bcdc;
49
+ --b700: #cbe2ff;
50
+ --b800: #e7f1ff;
51
+
52
+ --g100: #004327;
53
+ --g200: #055936;
54
+ --g300: #20662e;
55
+ --g400: #a5d7c2;
56
+ --g500: #ccfae7;
57
+ --g600: #e8fff5;
58
+
59
+ --n100: #151c29;
60
+ --n200: #1e283a;
61
+ --n300: #394c6e;
62
+ --n400: #415881;
63
+ --n500: #97a4bd;
64
+ --n600: #d6dce5;
65
+ --n700: #f4f6f9;
66
+ --n800: #ffffff;
67
+
68
+ --o100: #3c2000;
69
+ --o200: #542503;
70
+ --o300: #ff9d57;
71
+ --o400: #ffb27b;
72
+ --o500: #ffd2b2;
73
+
74
+ --r100: #310101;
75
+ --r200: #7c1111;
76
+ --r300: #a01313;
77
+ --r400: #b01717;
78
+ --r500: #f19999;
79
+ --r600: #ffc3c3;
80
+ --r700: #ffdede;
81
+ }
@@ -0,0 +1,131 @@
1
+ @import "../primitives/hero.primitives";
2
+
3
+ //button primary
4
+ $text-button-active-primary-light: $n800;
5
+ $bg-button-active-primary-light: $b400;
6
+ $text-button-active-primary-dark: $n100;
7
+ $bg-button-active-primary-dark: $b700;
8
+ $text-button-hover-primary-light: $n800;
9
+ $bg-button-hover-primary-light: $b500;
10
+ $text-button-hover-primary-dark: $b200;
11
+ $bg-button-hover-primary-dark: $b800;
12
+ $text-button-pressed-primary-light: $n800;
13
+ $bg-button-pressed-primary-light: $b300;
14
+ $text-button-pressed-primary-dark: $b200;
15
+ $bg-button-pressed-primary-dark: $b600;
16
+
17
+ //button secondary
18
+ $text-button-active-secondary-light: $b400;
19
+ $outline-button-active-secondary-light: $b400;
20
+ $bg-button-active-secondary-light: $n800;
21
+ $text-button-active-secondary-dark: $b700;
22
+ $outline-button-active-secondary-dark: $b700;
23
+ $bg-button-active-secondary-dark: $n100;
24
+ $text-button-hover-secondary-light: $b500;
25
+ $outline-button-hover-secondary-light: $b500;
26
+ $bg-button-hover-secondary-light: $n800;
27
+ $text-button-hover-secondary-dark: $b800;
28
+ $outline-button-hover-secondary-dark: $b800;
29
+ $bg-button-hover-secondary-dark: $n100;
30
+ $text-button-pressed-secondary-light: $b300;
31
+ $outline-button-pressed-secondary-light: $b300;
32
+ $bg-button-pressed-secondary-light: $n800;
33
+ $text-button-pressed-secondary-dark: $b600;
34
+ $outline-button-pressed-secondary-dark: $b600;
35
+ $bg-button-pressed-secondary-dark: $n100;
36
+
37
+ //button tertiary
38
+ $text-button-active-tertiary-light: $b400;
39
+ $bg-button-active-tertiary-light: $b700;
40
+ $text-button-active-tertiary-dark: $n800;
41
+ $bg-button-active-tertiary-dark: $n300;
42
+ $text-button-hover-tertiary-light: $b400;
43
+ $bg-button-hover-tertiary-light: $b800;
44
+ $text-button-hover-tertiary-dark: $n800;
45
+ $bg-button-hover-tertiary-dark: $n400;
46
+ $text-button-pressed-tertiary-light: $b300;
47
+ $bg-button-pressed-tertiary-light: $b600;
48
+ $text-button-pressed-tertiary-dark: $n800;
49
+ $bg-button-pressed-tertiary-dark: $n200;
50
+
51
+ //button positive
52
+ $text-button-active-positive-light: $g100;
53
+ $bg-button-active-positive-light: $g500;
54
+ $text-button-active-positive-dark: $g100;
55
+ $bg-button-active-positive-dark: $g500;
56
+ $text-button-hover-positive-light: $g100;
57
+ $bg-button-hover-positive-light: $g600;
58
+ $text-button-hover-positive-dark: $g100;
59
+ $bg-button-hover-positive-dark: $g600;
60
+ $text-button-pressed-positive-light: $g100;
61
+ $bg-button-pressed-positive-light: $g400;
62
+ $text-button-pressed-positive-dark: $g100;
63
+ $bg-button-pressed-positive-dark: $g400;
64
+
65
+ //button negative
66
+ $text-button-active-negative-light: $r200;
67
+ $bg-button-active-negative-light: $r600;
68
+ $text-button-active-negative-dark: $r200;
69
+ $bg-button-active-negative-dark: $r600;
70
+ $text-button-hover-negative-light: $r200;
71
+ $bg-button-hover-negative-light: $r700;
72
+ $text-button-hover-negative-dark: $r300;
73
+ $bg-button-hover-negative-dark: $r700;
74
+ $text-button-pressed-negative-light: $r100;
75
+ $bg-button-pressed-negative-light: $r500;
76
+ $text-button-pressed-negative-dark: $r100;
77
+ $bg-button-pressed-negative-dark: $r500;
78
+
79
+ //button alternative
80
+ $text-button-active-alternative-light: $o200;
81
+ $bg-button-active-alternative-light: $o400;
82
+ $text-button-active-alternative-dark: $o200;
83
+ $bg-button-active-alternative-dark: $o400;
84
+ $text-button-hover-alternative-light: $o200;
85
+ $bg-button-hover-alternative-light: $o500;
86
+ $bg-button-hover-alternative-dark: $o500;
87
+ $text-button-hover-alternative-dark: $o200;
88
+ $text-button-pressed-alternative-light: $o100;
89
+ $bg-button-pressed-alternative-light: $o300;
90
+ $text-button-pressed-alternative-dark: $o100;
91
+ $bg-button-pressed-alternative-dark: $o300;
92
+
93
+ //button disabled
94
+ $text-button-disabled-light: $n500;
95
+ $bg-button-disabled-light: $n600;
96
+ $text-button-disabled-dark: $n300;
97
+ $bg-button-disabled-dark: $n200;
98
+
99
+ //surface
100
+ $surface-primary-light: $n700;
101
+ $surface-primary-dark: $n200;
102
+ $surface-secondary-light: $n800;
103
+ $surface-secondary-dark: $n100;
104
+
105
+ //text
106
+ $text-primary-light: $n300;
107
+ $text-primary-dark: $n700;
108
+
109
+ //divider
110
+ $divider-primary-light: $n300;
111
+ $divider-primary-dark: $n700;
112
+
113
+ //logo
114
+ $logo-primary-light: $b400;
115
+ $logo-primary-dark: $b700;
116
+
117
+ //highlight
118
+ $text-highlight-neutro-primary-light: $n300;
119
+ $bg-highlight-neutro-primary-light: $n700;
120
+ $text-highlight-neutro-primary-dark: $n700;
121
+ $bg-highlight-neutro-primary-dark: $n200;
122
+ $text-highlight-neutro-secondary-light: $n800;
123
+ $bg-highlight-neutro-secondary-light: $n200;
124
+ $text-highlight-neutro-secondary-dark: $n100;
125
+ $bg-highlight-neutro-secondary-dark: $n600;
126
+
127
+ //system
128
+ $positive-primary-light: $g300;
129
+ $positive-primary-dark: $g500;
130
+ $negative-primary-light: $r400;
131
+ $negative-primary-dark: $r500;
@@ -0,0 +1,163 @@
1
+ @import "../themes/hero.theme";
2
+
3
+ .hero-light-theme {
4
+ //button primary
5
+ --text-button-active-primary: #{$text-button-active-primary-light};
6
+ --bg-button-active-primary: #{$bg-button-active-primary-light};
7
+ --text-button-hover-primary: #{$text-button-hover-primary-light};
8
+ --bg-button-hover-primary: #{$bg-button-hover-primary-light};
9
+ --text-button-pressed-primary: #{$text-button-pressed-primary-light};
10
+ --bg-button-pressed-primary: #{$bg-button-pressed-primary-light};
11
+
12
+ //button secondary
13
+ --text-button-active-secondary: #{$text-button-active-secondary-light};
14
+ --outline-button-active-secondary: #{$outline-button-active-secondary-light};
15
+ --bg-button-active-secondary: #{$bg-button-active-secondary-light};
16
+ --text-button-hover-secondary: #{$text-button-hover-secondary-light};
17
+ --outline-button-hover-secondary: #{$outline-button-hover-secondary-light};
18
+ --bg-button-hover-secondary: #{$bg-button-hover-secondary-light};
19
+ --text-button-pressed-secondary: #{$text-button-pressed-secondary-light};
20
+ --outline-button-pressed-secondary: #{$outline-button-pressed-secondary-light};
21
+ --bg-button-pressed-secondary: #{$bg-button-pressed-secondary-light};
22
+
23
+ //button tertiary
24
+ --text-button-active-tertiary: #{$text-button-active-tertiary-light};
25
+ --bg-button-active-tertiary: #{$bg-button-active-tertiary-light};
26
+ --text-button-hover-tertiary: #{$text-button-hover-tertiary-light};
27
+ --bg-button-hover-tertiary: #{$bg-button-hover-tertiary-light};
28
+ --text-button-pressed-tertiary: #{$text-button-pressed-tertiary-light};
29
+ --bg-button-pressed-tertiary: #{$bg-button-pressed-tertiary-light};
30
+
31
+ //button positive
32
+ --text-button-active-positive: #{$text-button-active-positive-light};
33
+ --bg-button-active-positive: #{$bg-button-active-positive-light};
34
+ --text-button-hover-positive: #{$text-button-hover-positive-light};
35
+ --bg-button-hover-positive: #{$bg-button-hover-positive-light};
36
+ --text-button-pressed-positive: #{$text-button-pressed-positive-light};
37
+ --bg-button-pressed-positive: #{$bg-button-pressed-positive-light};
38
+
39
+ //button negative
40
+ --text-button-active-negative: #{$text-button-active-negative-light};
41
+ --bg-button-active-negative: #{$bg-button-active-negative-light};
42
+ --text-button-hover-negative: #{$text-button-hover-negative-light};
43
+ --bg-button-hover-negative: #{$bg-button-hover-negative-light};
44
+ --text-button-pressed-negative: #{$text-button-pressed-negative-light};
45
+ --bg-button-pressed-negative: #{$bg-button-pressed-negative-light};
46
+
47
+ //button alternative
48
+ --text-button-active-alternative: #{$text-button-active-alternative-light};
49
+ --bg-button-active-alternative: #{$bg-button-active-alternative-light};
50
+ --text-button-hover-alternative: #{$text-button-hover-alternative-light};
51
+ --bg-button-hover-alternative: #{$bg-button-hover-alternative-light};
52
+ --text-button-pressed-alternative: #{$text-button-pressed-alternative-light};
53
+ --bg-button-pressed-alternative: #{$bg-button-pressed-alternative-light};
54
+
55
+ //button disabled
56
+ --text-button-disabled: #{$text-button-disabled-light};
57
+ --bg-button-disabled: #{$bg-button-disabled-light};
58
+
59
+ //surface
60
+ --surface-primary: #{$surface-primary-light};
61
+ --surface-secondary: #{$surface-secondary-light};
62
+
63
+ //text
64
+ --text-primary: #{$text-primary-light};
65
+
66
+ //divider
67
+ --divider-primary: #{$divider-primary-light};
68
+
69
+ //logo
70
+ --logo-primary: #{$logo-primary-light};
71
+
72
+ //highlight
73
+ --text-highlight-neutro-primary: #{$text-highlight-neutro-primary-light};
74
+ --bg-highlight-neutro-primary: #{$bg-highlight-neutro-primary-light};
75
+ --text-highlight-neutro-secondary: #{$text-highlight-neutro-secondary-light};
76
+ --bg-highlight-neutro-secondary: #{$bg-highlight-neutro-secondary-light};
77
+
78
+ //system
79
+ --positive-primary: #{$positive-primary-light};
80
+ --negative-primary: #{$negative-primary-light};
81
+ --cta-primary: #{$bg-button-active-primary-light};
82
+ }
83
+
84
+ .hero-dark-theme {
85
+ //button primary
86
+ --text-button-active-primary: #{$text-button-active-primary-dark};
87
+ --bg-button-active-primary: #{$bg-button-active-primary-dark};
88
+ --text-button-hover-primary: #{$text-button-hover-primary-dark};
89
+ --bg-button-hover-primary: #{$bg-button-hover-primary-dark};
90
+ --text-button-pressed-primary: #{$text-button-pressed-primary-dark};
91
+ --bg-button-pressed-primary: #{$bg-button-pressed-primary-dark};
92
+
93
+ //button secondary
94
+ --text-button-active-secondary: #{$text-button-active-secondary-dark};
95
+ --outline-button-active-secondary: #{$outline-button-active-secondary-dark};
96
+ --bg-button-active-secondary: #{$bg-button-active-secondary-dark};
97
+ --text-button-hover-secondary: #{$text-button-hover-secondary-dark};
98
+ --outline-button-hover-secondary: #{$outline-button-hover-secondary-dark};
99
+ --bg-button-hover-secondary: #{$bg-button-hover-secondary-dark};
100
+ --text-button-pressed-secondary: #{$text-button-pressed-secondary-dark};
101
+ --outline-button-pressed-secondary: #{$outline-button-pressed-secondary-dark};
102
+ --bg-button-pressed-secondary: #{$bg-button-pressed-secondary-dark};
103
+
104
+ //button tertiary
105
+ --text-button-active-tertiary: #{$text-button-active-tertiary-dark};
106
+ --bg-button-active-tertiary: #{$bg-button-active-tertiary-dark};
107
+ --text-button-hover-tertiary: #{$text-button-hover-tertiary-dark};
108
+ --bg-button-hover-tertiary: #{$bg-button-hover-tertiary-dark};
109
+ --text-button-pressed-tertiary: #{$text-button-pressed-tertiary-dark};
110
+ --bg-button-pressed-tertiary: #{$bg-button-pressed-tertiary-dark};
111
+
112
+ //button positive
113
+ --text-button-active-positive: #{$text-button-active-positive-dark};
114
+ --bg-button-active-positive: #{$bg-button-active-positive-dark};
115
+ --text-button-hover-positive: #{$text-button-hover-positive-dark};
116
+ --bg-button-hover-positive: #{$bg-button-hover-positive-dark};
117
+ --text-button-pressed-positive: #{$text-button-pressed-positive-dark};
118
+ --bg-button-pressed-positive: #{$bg-button-pressed-positive-dark};
119
+
120
+ //button negative
121
+ --text-button-active-negative: #{$text-button-active-negative-dark};
122
+ --bg-button-active-negative: #{$bg-button-active-negative-dark};
123
+ --text-button-hover-negative: #{$text-button-hover-negative-dark};
124
+ --bg-button-hover-negative: #{$bg-button-hover-negative-dark};
125
+ --text-button-pressed-negative: #{$text-button-pressed-negative-dark};
126
+ --bg-button-pressed-negative: #{$bg-button-pressed-negative-dark};
127
+
128
+ //button alternative
129
+ --text-button-active-alternative: #{$text-button-active-alternative-dark};
130
+ --bg-button-active-alternative: #{$bg-button-active-alternative-dark};
131
+ --text-button-hover-alternative: #{$text-button-hover-alternative-dark};
132
+ --bg-button-hover-alternative: #{$bg-button-hover-alternative-dark};
133
+ --text-button-pressed-alternative: #{$text-button-pressed-alternative-dark};
134
+ --bg-button-pressed-alternative: #{$bg-button-pressed-alternative-dark};
135
+
136
+ //button disabled
137
+ --text-button-disabled: #{$text-button-disabled-dark};
138
+ --bg-button-disabled: #{$bg-button-disabled-dark};
139
+
140
+ //surface
141
+ --surface-primary: #{$surface-primary-dark};
142
+ --surface-secondary: #{$surface-secondary-dark};
143
+
144
+ //text
145
+ --text-primary: #{$text-primary-dark};
146
+
147
+ //divider
148
+ --divider-primary: #{$divider-primary-dark};
149
+
150
+ //logo
151
+ --logo-primary: #{$logo-primary-dark};
152
+
153
+ //highlight
154
+ --text-highlight-neutro-primary: #{$text-highlight-neutro-primary-dark};
155
+ --bg-highlight-neutro-primary: #{$bg-highlight-neutro-primary-dark};
156
+ --text-highlight-neutro-secondary: #{$text-highlight-neutro-secondary-dark};
157
+ --bg-highlight-neutro-secondary: #{$bg-highlight-neutro-secondary-dark};
158
+
159
+ //system
160
+ --positive-primary: #{$positive-primary-dark};
161
+ --negative-primary: #{$negative-primary-dark};
162
+ --cta-primary: #{$bg-button-active-primary-dark};
163
+ }
@@ -0,0 +1,155 @@
1
+ body {
2
+ font-family: 'Roboto Flex', sans-serif;
3
+ color: var(--text-primary);
4
+ leading-trim: both;
5
+ text-edge: cap;
6
+ font-style: normal;
7
+ line-height: normal;
8
+ text-transform: capitalize;
9
+ font-optical-sizing: auto;
10
+ }
11
+
12
+ h1.hr-display {
13
+ &.sm-bold {
14
+ font-size: 3.125rem;
15
+ font-weight: 674;
16
+ letter-spacing: 0.03125rem;
17
+ }
18
+
19
+ &.md-bold {
20
+ font-size: 4.1875rem;
21
+ font-weight: 674;
22
+ letter-spacing: 0.04188rem;
23
+ }
24
+
25
+ &.lg-bold {
26
+ font-size: 5.625rem;
27
+ font-weight: 674;
28
+ letter-spacing: 0.05625rem;
29
+ }
30
+ }
31
+
32
+ h2.hr-headline {
33
+ &.sm-bold {
34
+ font-size: 2rem;
35
+ font-weight: 674;
36
+ letter-spacing: 0.02rem;
37
+ }
38
+
39
+ &.md-bold {
40
+ font-size: 2.375rem;
41
+ font-weight: 674;
42
+ letter-spacing: 0.02375rem;
43
+ }
44
+
45
+ &.lg-bold {
46
+ font-size: 2.875rem;
47
+ font-weight: 674;
48
+ letter-spacing: 0.02875rem;
49
+ }
50
+ }
51
+
52
+ h3.hr-title {
53
+ &.sm-bold {
54
+ font-size: 1rem;
55
+ font-weight: 731;
56
+ letter-spacing: 0.02rem;
57
+ }
58
+
59
+ &.md-bold {
60
+ font-size: 1rem;
61
+ font-weight: 731;
62
+ letter-spacing: 0.02rem;
63
+ }
64
+
65
+ &.lg-regular {
66
+ font-size: 1.75rem;
67
+ font-weight: 532;
68
+ letter-spacing: -0.00875rem;
69
+ }
70
+
71
+ &.lg-bold {
72
+ font-size: 1.75rem;
73
+ font-weight: 800;
74
+ letter-spacing: -0.00875rem;
75
+ }
76
+
77
+ }
78
+
79
+ label.hr-label {
80
+ display: block;
81
+
82
+ &.sm-regular {
83
+ font-size: 0.75rem;
84
+ font-weight: 343;
85
+ letter-spacing: 0.01875rem;
86
+ }
87
+
88
+ &.sm-bold {
89
+ font-size: 0.75rem;
90
+ font-weight: 700;
91
+ letter-spacing: 0.01875rem;
92
+ }
93
+
94
+ &.md-regular {
95
+ font-size: 1rem;
96
+ font-weight: 343;
97
+ letter-spacing: 0.025rem;
98
+ }
99
+
100
+ &.md-bold {
101
+ font-size: 1rem;
102
+ font-weight: 554;
103
+ letter-spacing: 0.025rem;
104
+ }
105
+
106
+ &.lg-regular {
107
+ font-size: 1.3325rem;
108
+ font-weight: 343;
109
+ letter-spacing: 0.03331rem;
110
+ }
111
+ }
112
+
113
+ p.hr-body-text {
114
+
115
+ &.sm-regular {
116
+ font-size: 0.75rem;
117
+ font-weight: 400;
118
+ line-height: 156.7%; /* 1.17525rem */
119
+ letter-spacing: 0.01875rem;
120
+ }
121
+
122
+ &.sm-bold {
123
+ font-size: 0.75rem;
124
+ font-weight: 600;
125
+ line-height: 156.7%; /* 1.17525rem */
126
+ letter-spacing: 0.01875rem;
127
+ text-transform: capitalize;
128
+ }
129
+
130
+ &.md-regular {
131
+ font-size: 1rem;
132
+ font-weight: 400;
133
+ line-height: 156.7%; /* 1.567rem */
134
+ letter-spacing: 0.025rem;
135
+ }
136
+
137
+ &.lg-regular {
138
+ font-size: 1.3325rem;
139
+ font-weight: 400;
140
+ line-height: 156.7%; /* 2.088rem */
141
+ letter-spacing: 0.03331rem;
142
+ }
143
+
144
+ &.lg-bold {
145
+ font-size: 1.3325rem;
146
+ font-weight: 700;
147
+ line-height: 156.7%; /* 2.088rem */
148
+ letter-spacing: 0.03331rem;
149
+ }
150
+ }
151
+
152
+ //HELPERS
153
+ .align-text-center {
154
+ text-align: center;
155
+ }
@@ -0,0 +1,7 @@
1
+ /*
2
+ * Public API Surface of gravity-design-system
3
+ */
4
+
5
+ export * from './lib/gravity-design-system.service';
6
+ export * from './lib/gravity-design-system.component';
7
+ export * from './lib/gravity-design-system.module';
@@ -0,0 +1,14 @@
1
+ /* To learn more about this file see: https://angular.io/config/tsconfig. */
2
+ {
3
+ "extends": "../../tsconfig.json",
4
+ "compilerOptions": {
5
+ "outDir": "../../out-tsc/lib",
6
+ "declaration": true,
7
+ "declarationMap": true,
8
+ "inlineSources": true,
9
+ "types": []
10
+ },
11
+ "exclude": [
12
+ "**/*.spec.ts"
13
+ ]
14
+ }
@@ -0,0 +1,10 @@
1
+ /* To learn more about this file see: https://angular.io/config/tsconfig. */
2
+ {
3
+ "extends": "./tsconfig.lib.json",
4
+ "compilerOptions": {
5
+ "declarationMap": false
6
+ },
7
+ "angularCompilerOptions": {
8
+ "compilationMode": "partial"
9
+ }
10
+ }
@@ -0,0 +1,14 @@
1
+ /* To learn more about this file see: https://angular.io/config/tsconfig. */
2
+ {
3
+ "extends": "../../tsconfig.json",
4
+ "compilerOptions": {
5
+ "outDir": "../../out-tsc/spec",
6
+ "types": [
7
+ "jasmine"
8
+ ]
9
+ },
10
+ "include": [
11
+ "**/*.spec.ts",
12
+ "**/*.d.ts"
13
+ ]
14
+ }