aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--angular.json26
-rw-r--r--package.json9
-rw-r--r--src/app/app.component.css0
-rw-r--r--src/app/app.component.ts2
-rw-r--r--src/scss/base/_initialize.scss42
-rw-r--r--src/scss/main.scss35
-rw-r--r--src/scss/objects/_container.scss56
-rw-r--r--src/scss/objects/_grid.scss81
-rw-r--r--src/scss/objects/_list.scss78
-rw-r--r--src/scss/objects/_media.scss89
-rw-r--r--src/scss/objects/_type.scss19
-rw-r--r--src/scss/settings/_core.scss97
-rw-r--r--src/scss/tools/_breakpoint.scss1
-rw-r--r--src/scss/tools/_core.scss1
-rw-r--r--src/scss/tools/_ms.scss29
-rw-r--r--src/scss/tools/_rtl.scss1
-rw-r--r--src/scss/tools/_type.scss1
-rw-r--r--src/scss/utilities/_align-items.scss31
-rw-r--r--src/scss/utilities/_align.scss32
-rw-r--r--src/scss/utilities/_bgcolor.scss19
-rw-r--r--src/scss/utilities/_clearfix.scss10
-rw-r--r--src/scss/utilities/_color.scss19
-rw-r--r--src/scss/utilities/_display.scss33
-rw-r--r--src/scss/utilities/_flex-direction.scss32
-rw-r--r--src/scss/utilities/_float.scss32
-rw-r--r--src/scss/utilities/_justify-content.scss31
-rw-r--r--src/scss/utilities/_margin.scss54
-rw-r--r--src/scss/utilities/_opacity.scss19
-rw-r--r--src/scss/utilities/_padding.scss54
-rw-r--r--src/scss/utilities/_position.scss33
-rw-r--r--src/scss/utilities/_pull.scss47
-rw-r--r--src/scss/utilities/_push.scss47
-rw-r--r--src/scss/utilities/_size.scss47
-rw-r--r--src/scss/utilities/_text.scss31
-rw-r--r--src/scss/utilities/_transform.scss32
-rw-r--r--src/scss/utilities/_weight.scss19
-rw-r--r--src/styles.scss (renamed from src/styles.css)0
-rw-r--r--yarn.lock6
38 files changed, 1178 insertions, 17 deletions
diff --git a/angular.json b/angular.json
index 15117b1..b396b5d 100644
--- a/angular.json
+++ b/angular.json
@@ -3,17 +3,21 @@
3 "version": 1, 3 "version": 1,
4 "newProjectRoot": "projects", 4 "newProjectRoot": "projects",
5 "projects": { 5 "projects": {
6 "hello-world-app": { 6 "gnunet-webui": {
7 "root": "", 7 "root": "",
8 "sourceRoot": "src", 8 "sourceRoot": "src",
9 "projectType": "application", 9 "projectType": "application",
10 "prefix": "app", 10 "prefix": "app",
11 "schematics": {}, 11 "schematics": {
12 "@schematics/angular:component": {
13 "styleext": "scss"
14 }
15 },
12 "architect": { 16 "architect": {
13 "build": { 17 "build": {
14 "builder": "@angular-devkit/build-angular:browser", 18 "builder": "@angular-devkit/build-angular:browser",
15 "options": { 19 "options": {
16 "outputPath": "dist/hello-world-app", 20 "outputPath": "dist/gnunet-webui",
17 "index": "src/index.html", 21 "index": "src/index.html",
18 "main": "src/main.ts", 22 "main": "src/main.ts",
19 "polyfills": "src/polyfills.ts", 23 "polyfills": "src/polyfills.ts",
@@ -23,7 +27,7 @@
23 "src/assets" 27 "src/assets"
24 ], 28 ],
25 "styles": [ 29 "styles": [
26 "src/styles.css" 30 "src/styles.scss"
27 ], 31 ],
28 "scripts": [] 32 "scripts": []
29 }, 33 },
@@ -50,18 +54,18 @@
50 "serve": { 54 "serve": {
51 "builder": "@angular-devkit/build-angular:dev-server", 55 "builder": "@angular-devkit/build-angular:dev-server",
52 "options": { 56 "options": {
53 "browserTarget": "hello-world-app:build" 57 "browserTarget": "gnunet-webui:build"
54 }, 58 },
55 "configurations": { 59 "configurations": {
56 "production": { 60 "production": {
57 "browserTarget": "hello-world-app:build:production" 61 "browserTarget": "gnunet-webui:build:production"
58 } 62 }
59 } 63 }
60 }, 64 },
61 "extract-i18n": { 65 "extract-i18n": {
62 "builder": "@angular-devkit/build-angular:extract-i18n", 66 "builder": "@angular-devkit/build-angular:extract-i18n",
63 "options": { 67 "options": {
64 "browserTarget": "hello-world-app:build" 68 "browserTarget": "gnunet-webui:build"
65 } 69 }
66 }, 70 },
67 "test": { 71 "test": {
@@ -95,7 +99,7 @@
95 } 99 }
96 } 100 }
97 }, 101 },
98 "hello-world-app-e2e": { 102 "gnunet-webui-e2e": {
99 "root": "e2e/", 103 "root": "e2e/",
100 "projectType": "application", 104 "projectType": "application",
101 "architect": { 105 "architect": {
@@ -103,7 +107,7 @@
103 "builder": "@angular-devkit/build-angular:protractor", 107 "builder": "@angular-devkit/build-angular:protractor",
104 "options": { 108 "options": {
105 "protractorConfig": "e2e/protractor.conf.js", 109 "protractorConfig": "e2e/protractor.conf.js",
106 "devServerTarget": "hello-world-app:serve" 110 "devServerTarget": "gnunet-webui:serve"
107 } 111 }
108 }, 112 },
109 "lint": { 113 "lint": {
@@ -118,5 +122,5 @@
118 } 122 }
119 } 123 }
120 }, 124 },
121 "defaultProject": "hello-world-app" 125 "defaultProject": "gnunet-webui"
122} \ No newline at end of file 126}
diff --git a/package.json b/package.json
index e1441cb..eae394d 100644
--- a/package.json
+++ b/package.json
@@ -22,14 +22,14 @@
22 "@angular/platform-browser-dynamic": "^6.0.0", 22 "@angular/platform-browser-dynamic": "^6.0.0",
23 "@angular/router": "^6.0.0", 23 "@angular/router": "^6.0.0",
24 "core-js": "^2.5.4", 24 "core-js": "^2.5.4",
25 "iotacss": "^1.6.0",
25 "rxjs": "^6.0.0", 26 "rxjs": "^6.0.0",
26 "zone.js": "^0.8.26" 27 "zone.js": "^0.8.26"
27 }, 28 },
28 "devDependencies": { 29 "devDependencies": {
29 "@angular/compiler-cli": "^6.0.0",
30 "@angular-devkit/build-angular": "~0.6.1", 30 "@angular-devkit/build-angular": "~0.6.1",
31 "typescript": "~2.7.2", 31 "@angular/cli": "^6.0.1",
32 "@angular/cli": "~6.0.1", 32 "@angular/compiler-cli": "^6.0.0",
33 "@angular/language-service": "^6.0.0", 33 "@angular/language-service": "^6.0.0",
34 "@types/jasmine": "~2.8.6", 34 "@types/jasmine": "~2.8.6",
35 "@types/jasminewd2": "~2.0.3", 35 "@types/jasminewd2": "~2.0.3",
@@ -44,6 +44,7 @@
44 "karma-jasmine-html-reporter": "^0.2.2", 44 "karma-jasmine-html-reporter": "^0.2.2",
45 "protractor": "~5.3.0", 45 "protractor": "~5.3.0",
46 "ts-node": "~5.0.1", 46 "ts-node": "~5.0.1",
47 "tslint": "~5.9.1" 47 "tslint": "~5.9.1",
48 "typescript": "~2.7.2"
48 } 49 }
49} 50}
diff --git a/src/app/app.component.css b/src/app/app.component.css
deleted file mode 100644
index e69de29..0000000
--- a/src/app/app.component.css
+++ /dev/null
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 7b0f672..bff8c82 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -3,7 +3,7 @@ import { Component } from '@angular/core';
3@Component({ 3@Component({
4 selector: 'app-root', 4 selector: 'app-root',
5 templateUrl: './app.component.html', 5 templateUrl: './app.component.html',
6 styleUrls: ['./app.component.css'] 6 styleUrls: ['./../scss/main.scss']
7}) 7})
8export class AppComponent { 8export class AppComponent {
9 title = 'app'; 9 title = 'app';
diff --git a/src/scss/base/_initialize.scss b/src/scss/base/_initialize.scss
new file mode 100644
index 0000000..6185613
--- /dev/null
+++ b/src/scss/base/_initialize.scss
@@ -0,0 +1,42 @@
1/**
2 * Global box sizing option
3 *
4 * Type: String
5 */
6
7$iota-base-initialize-box-sizing: 'border-box';
8
9
10/**
11 * Makes all heading tags ( h1 - h6 ) to be equal
12 * to your body size. It forces you to use heading
13 * tags with focus on your semantics and not on the
14 * way they look.
15 *
16 * Type: Boolean
17 */
18
19$iota-base-initialize-heading-size: true;
20
21
22/**
23 * Enables normalize and resets for the HTML4 form
24 * elements
25 *
26 * Type: Boolean
27 */
28
29$iota-base-initialize-form-elements: false;
30
31
32/**
33 * Enables normalize and resets for the HTML5 form
34 * elements
35 *
36 * Type: Boolean
37 */
38
39$iota-base-initialize-html5-form-elements: false;
40
41
42@import 'node_modules/iotacss/base/initialize';
diff --git a/src/scss/main.scss b/src/scss/main.scss
new file mode 100644
index 0000000..c643b18
--- /dev/null
+++ b/src/scss/main.scss
@@ -0,0 +1,35 @@
1@import 'settings/core';
2
3//@import 'tools/core';
4//@import 'tools/breakpoint';
5//@import 'tools/ms';
6//@import 'tools/rtl';
7//@import 'tools/type';
8
9@import 'base/initialize';
10
11//@import 'objects/container';
12//@import 'objects/grid';
13//@import 'objects/list';
14//@import 'objects/media';
15//@import 'objects/type';
16
17//@import 'utilities/align-items';
18//@import 'utilities/align';
19//@import 'utilities/bgcolor';
20//@import 'utilities/clearfix';
21//@import 'utilities/color';
22//@import 'utilities/display';
23//@import 'utilities/flex-direction';
24//@import 'utilities/float';
25//@import 'utilities/justify-content';
26//@import 'utilities/margin';
27//@import 'utilities/opacity';
28//@import 'utilities/padding';
29//@import 'utilities/position';
30//@import 'utilities/pull';
31//@import 'utilities/push';
32//@import 'utilities/size';
33//@import 'utilities/text';
34//@import 'utilities/transform';
35//@import 'utilities/weight';
diff --git a/src/scss/objects/_container.scss b/src/scss/objects/_container.scss
new file mode 100644
index 0000000..2b28286
--- /dev/null
+++ b/src/scss/objects/_container.scss
@@ -0,0 +1,56 @@
1/**
2 * Allows you to change the default container name
3 * from .o-container.
4 *
5 * Type: String
6 */
7
8$iota-objs-container-namespace: 'container';
9
10
11/**
12 * Allows you to specify the default set of padding
13 * left and right of your container. You can use a
14 * map in case you would like to specify responsive
15 * gutter sizes.
16 *
17 * Type: Number / List / Map
18 */
19
20$iota-objs-container-gutter-default: $iota-global-gutter-default;
21
22
23/**
24 * Allows you to specify more sets of padding left and
25 * right of your container. You can use a nested map in
26 * case you would like to specify responsive gutter sizes.
27 *
28 * Type: Map
29 */
30
31$iota-objs-container-gutter-extra: ();
32
33
34/**
35 * Allows you to specify the default max-width of your
36 * container. You can use a map in case you would like
37 * to specify a responsive size.
38 *
39 * Type: String / Map
40 */
41
42$iota-objs-container-size-default: 1000px;
43
44
45/**
46 * Allows you to specify more sets of max-width for your
47 * container. You can use a nested map in case you would
48 * like to specify a responsive size.
49 *
50 * Type: Map
51 */
52
53$iota-objs-container-size-extra: ();
54
55
56@import 'node_modules/iotacss/objects/container';
diff --git a/src/scss/objects/_grid.scss b/src/scss/objects/_grid.scss
new file mode 100644
index 0000000..93a3c48
--- /dev/null
+++ b/src/scss/objects/_grid.scss
@@ -0,0 +1,81 @@
1/**
2 * Enable / Disable aligment modifiers.
3 * .o-grid--right : Align columns on right horizontally
4 * .o-grid--center : Align columns on center horizontally
5 * .o-grid--middle : Align columns on middle vertically
6 * .o-grid--bottom : Align columns on bottom vertically
7 *
8 * Type: Boolean
9 */
10
11$iota-objs-grid-aligned: false;
12
13
14/**
15 * Enable / Disable reversed modifier
16 * .o-grid--rev : Reverse columns order
17 *
18 * Type: Boolean
19 */
20
21$iota-objs-grid-rev: false;
22
23
24/**
25 * Default gutter size. Use a number for a single size or
26 * a map for a responsive size.
27 *
28 * Type: Number / Map
29 */
30
31$iota-objs-grid-gutter-default: $iota-global-gutter-default;
32
33
34/**
35 * Extra gutters map. Each gutter size will be available as a
36 * modifier that will be named according to the gutter name.
37 * Each gutter size will be available as a modifier that will
38 * be named according to the gutter name.
39 * E.g. If $iota-objs-grid-gutter-extra: ('compact': '10px');
40 * then .o-grid--compact will be available for use.
41 *
42 * Type: Map
43 */
44
45$iota-objs-grid-gutter-extra: ();
46
47
48/**
49 * Enable / Disable flexbox on grid.
50 *
51 * Type: Boolean
52 */
53
54$iota-objs-grid-flex: $iota-global-flex;
55
56
57/**
58 * Enable / Disable equal height modifier .o-grid--equal-height.
59 * Works only if $iota-obj-grid-flex is enabled.
60 *
61 * Type: Boolean
62 */
63
64$iota-objs-grid-equal-height: false;
65
66
67/**
68 * Namespace classes
69 *
70 * Type: String
71 */
72
73$iota-objs-grid-namespace : 'grid';
74$iota-objs-grid-column-name : 'col';
75$iota-objs-grid-align-right-name : 'right';
76$iota-objs-grid-align-center-name : 'center';
77$iota-objs-grid-align-top-name : 'top';
78$iota-objs-grid-namespace : 'grid';
79
80
81@import 'node_modules/iotacss/objects/grid';
diff --git a/src/scss/objects/_list.scss b/src/scss/objects/_list.scss
new file mode 100644
index 0000000..7e91ef1
--- /dev/null
+++ b/src/scss/objects/_list.scss
@@ -0,0 +1,78 @@
1/**
2 * Enable / Disable aligment modifiers.
3 * .o-list--middle : Align list items on middle vertically
4 * .o-list--bottom : Align list items on bottom vertically
5 *
6 * Type: Boolean
7 */
8
9$iota-objs-list-aligned: false;
10
11
12/**
13 * Enable / Disable block modifier. .o-list--block : Each list
14 * item will have display block with a bottom margin.
15 *
16 * Type: Boolean
17 */
18
19$iota-objs-list-block: false;
20
21
22/**
23 * Enable / Disable inline modifier. .o-list--inline Each list
24 * item will have display inline-block with a right margin.
25 *
26 * Type: Boolean
27 */
28
29$iota-objs-list-inline: false;
30
31
32/**
33 * Enable / Disable span modifier. .o-list--span : Each list
34 * item will have display table-cell with a border spacing so
35 * that they never wrap to a new row.
36 *
37 * Type: Boolean
38 */
39
40$iota-objs-list-span: false;
41
42
43/**
44 * Default gutter size. Use a number for a single size or
45 * a map for a responsive size.
46 *
47 * Type: Number / Map
48 */
49
50$iota-objs-list-gutter-default: $iota-global-gutter-default;
51
52
53/**
54 * Extra gutters map. Each gutter size will be available
55 * as a modifier that will be named according to the gutter
56 * name. E.g. If $iota-objs-list-gutter-extra: ('compact': '10px');
57 * then .o-list--compact will be available for use.
58 *
59 * Type: Map
60 */
61
62$iota-objs-list-gutter-extra: ();
63
64
65/**
66 * Namespace classes
67 *
68 * Type: String
69 */
70
71$iota-objs-list-namespace : 'list';
72$iota-objs-list-item-name : 'item';
73$iota-objs-list-block-name : 'block';
74$iota-objs-list-inline-name : 'inline';
75$iota-objs-list-span-name : 'span';
76
77
78@import 'node_modules/iotacss/objects/list';
diff --git a/src/scss/objects/_media.scss b/src/scss/objects/_media.scss
new file mode 100644
index 0000000..2c52f87
--- /dev/null
+++ b/src/scss/objects/_media.scss
@@ -0,0 +1,89 @@
1/**
2 * Enable / Disable aligment modifiers.
3 * .o-media--middle Align columns at middle vertically
4 * .o-media--bottom Align columns at bottom vertically.
5 *
6 * Type: Boolean
7 */
8
9$iota-objs-media-aligned: false;
10
11
12/**
13 * Enable / Disable reversed modifier
14 * .o-media--rev Reverse columns order
15 *
16 * Type: Boolean
17 */
18
19$iota-objs-media-rev: false;
20
21
22/**
23 * Default gutter size. Use a number for a single size or
24 * a map for a responsive size.
25 *
26 * Type: Number / Map
27 */
28
29$iota-objs-media-gutter-default: $iota-global-gutter-default;
30
31
32/**
33 * Extra gutters map. Each gutter size will be available as
34 * a modifier that will be named according to the gutter name.
35 * Use a map for a single size or a nested map for a responsive
36 * size. E.g. If $iota-objs-media-gutter-extra: ('compact': '10px');
37 * then .o-media--compact will be available for use.
38 *
39 * Type: Map
40 */
41
42$iota-objs-media-gutter-extra: ();
43
44
45/**
46 * Enable / Disable flexbox
47 *
48 * Type: Boolean
49 */
50
51$iota-objs-media-flex: $iota-global-flex;
52
53
54/**
55 * Enable / Disable responsive modifier.
56 * .o-media--res Collapse fluid section bellow fixed one,
57 * at a specific max-width breakpoint.
58 *
59 * Type: Boolean
60 */
61
62$iota-objs-media-res: false;
63
64
65/**
66 * Specify max-width for breakpoint to collapse at.
67 *
68 * Type: Number
69 */
70
71$iota-objs-media-collapse-at: 767px;
72
73
74/**
75 * Namespace classes
76 *
77 * Type: String
78 */
79
80$iota-objs-media-namespace : 'media';
81$iota-objs-media-fixed-name : 'fixed';
82$iota-objs-media-fluid-name : 'fluid';
83$iota-objs-media-reversed-name : 'rev';
84$iota-objs-media-align-middle-name : 'middle';
85$iota-objs-media-align-bottom-name : 'bottom';
86$iota-objs-media-responsive-name : 'res';
87
88
89@import 'node_modules/iotacss/objects/media';
diff --git a/src/scss/objects/_type.scss b/src/scss/objects/_type.scss
new file mode 100644
index 0000000..ed74bde
--- /dev/null
+++ b/src/scss/objects/_type.scss
@@ -0,0 +1,19 @@
1/**
2 * Allows you to change the default type name from .o-type-.
3 *
4 * Type: String
5 */
6
7$iota-objs-type-namespace: 'type-';
8
9
10/**
11 * Allows you to specify typography sizes.
12 *
13 * Type: Map
14 */
15
16$iota-objs-type-sizes: ();
17
18
19@import 'node_modules/iotacss/objects/type';
diff --git a/src/scss/settings/_core.scss b/src/scss/settings/_core.scss
new file mode 100644
index 0000000..6f08294
--- /dev/null
+++ b/src/scss/settings/_core.scss
@@ -0,0 +1,97 @@
1/**
2 * Grid columns. This setting is shared between
3 * iotaCSS grid objects and size, pull & push
4 * utilities. You can change it also locally to
5 * each module.
6 *
7 * Type: Unitless Number / List
8 */
9
10$iota-global-columns: 2, 3, 6, 12;
11
12
13/**
14 * Global namespace for Objects, Components and
15 * Utilities
16 *
17 * Type: String
18 */
19
20$iota-global-objects-namespace : 'o-';
21$iota-global-utilities-namespace : 'u-';
22$iota-global-components-namespace : 'c-';
23
24
25/**
26 * Default gutters. This setting is shared between
27 * multiple objects and utilities as the default value
28 * for gutters. You can change it also locally to each
29 * module.
30 *
31 * Type: Number / List / Map
32 */
33
34$iota-global-gutter-default: 10px;
35
36
37/**
38 * Enables flexbox across the app. If you do not want
39 * all modules to use flexbox you can keep this value
40 * false and set it to true separately to each one of
41 * them locally.
42 *
43 * Type: Boolean
44 */
45
46$iota-global-flex: false;
47
48
49/**
50 * Enables rtl across the app. If you enable this setting
51 * the final CSS will be converted to RTL.
52 *
53 * Type: Boolean
54 */
55
56$iota-global-rtl: false;
57
58
59/**
60 * Default global breakpoints map. These are the
61 * default breakpoints map that will be shared across
62 * all iotaCSS modules. You can change it also locally
63 * to each module.
64 *
65 * Type: Map
66 */
67
68$iota-global-breakpoints: (
69 sm : "screen and ( min-width: 768px )",
70 md : "screen and ( min-width: 1000px )"
71);
72
73
74/**
75 * Global breakpoint suffix naming setting. All breakpoint
76 * specific styles have a '@breakpointName' suffix by default.
77 * The \ character is used to escape the @ character.
78 *
79 * Type: String
80 */
81
82$iota-global-breakpoint-separator: \@;
83
84
85/**
86 * Global delimiter naming setting for Size, Push and Pull
87 * utilities. By default it is '/' (.u-1/2) and you can change
88 * it for example to 'of' so that the generated HTML class will be
89 * 'u-1of2'.
90 *
91 * Type: String
92 */
93
94$iota-global-delimiter: \/;
95
96
97@import 'node_modules/iotacss/settings/core';
diff --git a/src/scss/tools/_breakpoint.scss b/src/scss/tools/_breakpoint.scss
new file mode 100644
index 0000000..bd51744
--- /dev/null
+++ b/src/scss/tools/_breakpoint.scss
@@ -0,0 +1 @@
@import 'node_modules/iotacss/tools/breakpoint';
diff --git a/src/scss/tools/_core.scss b/src/scss/tools/_core.scss
new file mode 100644
index 0000000..0eaff75
--- /dev/null
+++ b/src/scss/tools/_core.scss
@@ -0,0 +1 @@
@import 'node_modules/iotacss/tools/core';
diff --git a/src/scss/tools/_ms.scss b/src/scss/tools/_ms.scss
new file mode 100644
index 0000000..fcd1c84
--- /dev/null
+++ b/src/scss/tools/_ms.scss
@@ -0,0 +1,29 @@
1/**
2 * The base value the scale starts at.
3 *
4 * Number
5 */
6
7$iota-tools-ms-base: 15px;
8
9
10/**
11 * The ratio the scale is built on
12 *
13 * Unitless Number
14 */
15
16$iota-tools-ms-ratio: 1.2;
17
18
19/**
20 * Length of scale ( right part of the decimal
21 * point ) ms will be rounded to.
22 *
23 * Unitless Number
24 */
25
26$iota-tools-ms-scale: 3;
27
28
29@import 'node_modules/iotacss/tools/ms';
diff --git a/src/scss/tools/_rtl.scss b/src/scss/tools/_rtl.scss
new file mode 100644
index 0000000..d5994ba
--- /dev/null
+++ b/src/scss/tools/_rtl.scss
@@ -0,0 +1 @@
@import 'node_modules/iotacss/tools/rtl';
diff --git a/src/scss/tools/_type.scss b/src/scss/tools/_type.scss
new file mode 100644
index 0000000..3b12f4c
--- /dev/null
+++ b/src/scss/tools/_type.scss
@@ -0,0 +1 @@
@import 'node_modules/iotacss/tools/type';
diff --git a/src/scss/utilities/_align-items.scss b/src/scss/utilities/_align-items.scss
new file mode 100644
index 0000000..f74be1c
--- /dev/null
+++ b/src/scss/utilities/_align-items.scss
@@ -0,0 +1,31 @@
1/**
2 * Enable / Disable breakpoint specific classes
3 *
4 * Type: Boolean
5 */
6
7$iota-utils-align-items-res: false;
8
9
10/**
11 * Override breakpoints map only for align utility
12 *
13 * Type: Type: Map
14 */
15
16$iota-utils-align-items-breakpoints: $iota-global-breakpoints;
17
18
19/**
20 * Namespace classes
21 *
22 * Type: String
23 */
24
25$iota-utils-align-items-namespace : 'ai-';
26$iota-utils-align-items-start-name : 'start';
27$iota-utils-align-items-end-name : 'end';
28$iota-utils-align-items-center-name : 'center';
29
30
31@import 'node_modules/iotacss/utilities/align-items';
diff --git a/src/scss/utilities/_align.scss b/src/scss/utilities/_align.scss
new file mode 100644
index 0000000..631e839
--- /dev/null
+++ b/src/scss/utilities/_align.scss
@@ -0,0 +1,32 @@
1/**
2 * Enable / Disable breakpoint specific classes
3 *
4 * Type: Boolean
5 */
6
7$iota-utils-align-res: false;
8
9
10/**
11 * Override breakpoints map only for align utility
12 *
13 * Type: Type: Map
14 */
15
16$iota-utils-align-breakpoints: $iota-global-breakpoints;
17
18
19/**
20 * Namespace classes
21 *
22 * Type: String
23 */
24
25$iota-utils-align-namespace : 'align-';
26$iota-utils-align-top-name : 'top';
27$iota-utils-align-bottom-name : 'bottom';
28$iota-utils-align-middle-name : 'middle';
29$iota-utils-align-baseline-name : 'baseline';
30
31
32@import 'node_modules/iotacss/utilities/align';
diff --git a/src/scss/utilities/_bgcolor.scss b/src/scss/utilities/_bgcolor.scss
new file mode 100644
index 0000000..015e36f
--- /dev/null
+++ b/src/scss/utilities/_bgcolor.scss
@@ -0,0 +1,19 @@
1/**
2 * Background color names
3 *
4 * Type: Map
5 */
6
7$iota-utils-bgcolor-names: ();
8
9
10/**
11 * Namespace classes
12 *
13 * Type: String
14 */
15
16$iota-utils-bgcolor-namespace: 'bgcolor-';
17
18
19@import 'node_modules/iotacss/utilities/bgcolor';
diff --git a/src/scss/utilities/_clearfix.scss b/src/scss/utilities/_clearfix.scss
new file mode 100644
index 0000000..5aaa021
--- /dev/null
+++ b/src/scss/utilities/_clearfix.scss
@@ -0,0 +1,10 @@
1/**
2 * Namespace classes
3 *
4 * Type: String
5 */
6
7$iota-utils-clearfix-namespace: 'cf';
8
9
10@import 'node_modules/iotacss/utilities/clearfix';
diff --git a/src/scss/utilities/_color.scss b/src/scss/utilities/_color.scss
new file mode 100644
index 0000000..467a63b
--- /dev/null
+++ b/src/scss/utilities/_color.scss
@@ -0,0 +1,19 @@
1/**
2 * Color names
3 *
4 * Type: Map
5 */
6
7$iota-utils-color-names: ();
8
9
10/**
11 * Namespace classes
12 *
13 * Type: String
14 */
15
16$iota-utils-color-namespace: 'color-';
17
18
19@import 'node_modules/iotacss/utilities/color';
diff --git a/src/scss/utilities/_display.scss b/src/scss/utilities/_display.scss
new file mode 100644
index 0000000..ef16830
--- /dev/null
+++ b/src/scss/utilities/_display.scss
@@ -0,0 +1,33 @@
1/**
2 * Enables / Disables breakpoint specific classes
3 *
4 * Type: Boolean
5 */
6
7$iota-utils-display-res: false;
8
9
10/**
11 * Breakpoints map. Overrides the breakpoints map only
12 * for display utility.
13 *
14 * Type: Map
15 */
16
17$iota-utils-display-breakpoints: $iota-global-breakpoints;
18
19
20/**
21 * Namespace classes
22 *
23 * Type: String
24 */
25
26$iota-utils-display-namespace : '';
27$iota-utils-display-block-name : 'block';
28$iota-utils-display-hidden-name : 'hidden';
29$iota-utils-display-inline-name : 'inline';
30$iota-utils-display-inline-block-name : 'inline-block';
31
32
33@import 'node_modules/iotacss/utilities/display';
diff --git a/src/scss/utilities/_flex-direction.scss b/src/scss/utilities/_flex-direction.scss
new file mode 100644
index 0000000..620e15c
--- /dev/null
+++ b/src/scss/utilities/_flex-direction.scss
@@ -0,0 +1,32 @@
1/**
2 * Enable / Disable breakpoint specific classes
3 *
4 * Type: Boolean
5 */
6
7$iota-utils-flex-direction-res: false;
8
9
10/**
11 * Override breakpoints map only for align utility
12 *
13 * Type: Type: Map
14 */
15
16$iota-utils-flex-direction-breakpoints: $iota-global-breakpoints;
17
18
19/**
20 * Namespace classes
21 *
22 * Type: String
23 */
24
25$iota-utils-flex-direction-namespace : 'fd-';
26$iota-utils-flex-direction-row-name : 'row';
27$iota-utils-flex-direction-row-reverse-name : 'rowrev';
28$iota-utils-flex-direction-column-name : 'col';
29$iota-utils-flex-direction-column-reverse-name : 'colrev';
30
31
32@import 'node_modules/iotacss/utilities/flex-direction';
diff --git a/src/scss/utilities/_float.scss b/src/scss/utilities/_float.scss
new file mode 100644
index 0000000..ca02761
--- /dev/null
+++ b/src/scss/utilities/_float.scss
@@ -0,0 +1,32 @@
1/**
2 * Enables / Disables breakpoint specific classes
3 *
4 * Type: Boolean
5 */
6
7$iota-utils-float-res: false;
8
9
10/**
11 * Breakpoints map. Overrides the breakpoints map only
12 * for float utility.
13 *
14 * Type: Map
15 */
16
17$iota-utils-float-breakpoints: $iota-global-breakpoints;
18
19
20
21/**
22 * Namespace classes
23 *
24 * Type: String
25 */
26
27$iota-utils-float-namespace : 'float-';
28$iota-utils-float-left-name : 'left';
29$iota-utils-float-right-name : 'right';
30
31
32@import 'node_modules/iotacss/utilities/float';
diff --git a/src/scss/utilities/_justify-content.scss b/src/scss/utilities/_justify-content.scss
new file mode 100644
index 0000000..5dee6e8
--- /dev/null
+++ b/src/scss/utilities/_justify-content.scss
@@ -0,0 +1,31 @@
1/**
2 * Enable / Disable breakpoint specific classes
3 *
4 * Type: Boolean
5 */
6
7$iota-utils-justify-content-res: false;
8
9
10/**
11 * Override breakpoints map only for align utility
12 *
13 * Type: Type: Map
14 */
15
16$iota-utils-justify-content-breakpoints: $iota-global-breakpoints;
17
18
19/**
20 * Namespace classes
21 *
22 * Type: String
23 */
24
25$iota-utils-justify-content-namespace : 'jc-';
26$iota-utils-justify-content-start-name : 'start';
27$iota-utils-justify-content-end-name : 'end';
28$iota-utils-justify-content-center-name : 'center';
29
30
31@import 'node_modules/iotacss/utilities/justify-content';
diff --git a/src/scss/utilities/_margin.scss b/src/scss/utilities/_margin.scss
new file mode 100644
index 0000000..4e08dc4
--- /dev/null
+++ b/src/scss/utilities/_margin.scss
@@ -0,0 +1,54 @@
1/**
2 * Margin default gutter. Use a number for a simple size
3 * and a map for responsive.
4 *
5 * Type: Number / Map
6 */
7
8$iota-utils-margin-default: $iota-global-gutter-default;
9
10
11/**
12 * Margin extra gutters.
13 *
14 * Type: Map
15 */
16
17$iota-utils-margin-extra: ();
18
19
20/**
21 * Enables / Disables responsive classes
22 *
23 * Type: Boolean
24 */
25
26$iota-utils-margin-res: false;
27
28
29/**
30 * Breakpoints map. Overrides the breakpoints map only
31 * for margin utility.
32 *
33 * Type: Map
34 */
35
36$iota-utils-margin-breakpoints: $iota-global-breakpoints;
37
38
39/**
40 * Namespace classes
41 *
42 * Type: String
43 */
44
45$iota-utils-margin-namespace : 'm';
46$iota-utils-margin-top-name : 't';
47$iota-utils-margin-right-name : 'r';
48$iota-utils-margin-bottom-name : 'b';
49$iota-utils-margin-left-name : 'l';
50$iota-utils-margin-vertical-name : 'v';
51$iota-utils-margin-horizontal-name : 'h';
52
53
54@import 'node_modules/iotacss/utilities/margin';
diff --git a/src/scss/utilities/_opacity.scss b/src/scss/utilities/_opacity.scss
new file mode 100644
index 0000000..a01d95d
--- /dev/null
+++ b/src/scss/utilities/_opacity.scss
@@ -0,0 +1,19 @@
1/**
2 * Opacity sizes
3 *
4 * Type: Map
5 */
6
7$iota-utils-opacity-sizes: ();
8
9
10/**
11 * Namespace classes
12 *
13 * Type: String
14 */
15
16$iota-utils-opacity-namespace: 'opacity-';
17
18
19@import 'node_modules/iotacss/utilities/opacity';
diff --git a/src/scss/utilities/_padding.scss b/src/scss/utilities/_padding.scss
new file mode 100644
index 0000000..dc85f53
--- /dev/null
+++ b/src/scss/utilities/_padding.scss
@@ -0,0 +1,54 @@
1/**
2 * Padding default gutter. Use a number for a simple size
3 * and a map for responsive.
4 *
5 * Type: Number / Map
6 */
7
8$iota-utils-padding-default: $iota-global-gutter-default;
9
10
11/**
12 * Padding extra gutters.
13 *
14 * Type: Map
15 */
16
17$iota-utils-padding-extra: ();
18
19
20/**
21 * Enables / Disables responsive classes
22 *
23 * Type: Boolean
24 */
25
26$iota-utils-padding-res: false;
27
28
29/**
30 * Breakpoints map. Overrides the breakpoints map only
31 * for padding utility.
32 *
33 * Type: Map
34 */
35
36$iota-utils-padding-breakpoints: $iota-global-breakpoints;
37
38
39/**
40 * Namespace classes
41 *
42 * Type: String
43 */
44
45$iota-utils-padding-namespace : 'p';
46$iota-utils-padding-top-name : 't';
47$iota-utils-padding-right-name : 'r';
48$iota-utils-padding-bottom-name : 'b';
49$iota-utils-padding-left-name : 'l';
50$iota-utils-padding-vertical-name : 'v';
51$iota-utils-padding-horizontal-name : 'h';
52
53
54@import 'node_modules/iotacss/utilities/padding';
diff --git a/src/scss/utilities/_position.scss b/src/scss/utilities/_position.scss
new file mode 100644
index 0000000..aff877d
--- /dev/null
+++ b/src/scss/utilities/_position.scss
@@ -0,0 +1,33 @@
1/**
2 * Enable / Disable breakpoint specific classes
3 *
4 * Type: Boolean
5 */
6
7$iota-utils-position-res: false;
8
9
10/**
11 * Overrides breakpoints map only for position utility
12 *
13 * Type: Map
14 */
15
16$iota-utils-position-breakpoints: $iota-global-breakpoints;
17
18
19/**
20 * Namespace classes
21 *
22 * Type: String
23 */
24
25$iota-utils-position-namespace : '';
26$iota-utils-position-absolute-name : 'absolute';
27$iota-utils-position-fixed-name : 'fixed';
28$iota-utils-position-relative-name : 'relative';
29$iota-utils-position-static-name : 'static';
30$iota-utils-position-sticky-name : 'sticky';
31
32
33@import 'node_modules/iotacss/utilities/position';
diff --git a/src/scss/utilities/_pull.scss b/src/scss/utilities/_pull.scss
new file mode 100644
index 0000000..309db79
--- /dev/null
+++ b/src/scss/utilities/_pull.scss
@@ -0,0 +1,47 @@
1/**
2 * Namespace classes
3 *
4 * Type: String
5 */
6
7$iota-utils-pull-namespace: 'pull-';
8
9
10/**
11 * Size delimiter. Defaults to \/. Ex: .u-pull-1/3
12 *
13 * Type: String
14 */
15
16$iota-utils-pull-delimiter: $iota-global-delimiter;
17
18
19/**
20 * Columns to populate pull utility for
21 *
22 * Type: Unitless Number / List
23 */
24
25$iota-utils-pull-columns: $iota-global-columns;
26
27
28/**
29 * Enables / Disables breakpoint specific classes
30 *
31 * Type: Boolean
32 */
33
34$iota-utils-pull-res: false;
35
36
37/**
38 * Breakpoints map. Allows you to create breakpoints only
39 * for the pull responsive utility.
40 *
41 * Type: Map
42 */
43
44$iota-utils-pull-breakpoints: $iota-global-breakpoints;
45
46
47@import 'node_modules/iotacss/utilities/pull';
diff --git a/src/scss/utilities/_push.scss b/src/scss/utilities/_push.scss
new file mode 100644
index 0000000..c7f41a4
--- /dev/null
+++ b/src/scss/utilities/_push.scss
@@ -0,0 +1,47 @@
1/**
2 * Namespace classes
3 *
4 * Type: String
5 */
6
7$iota-utils-push-namespace: 'push-';
8
9
10/**
11 * Size delimiter. Defaults to \/. Ex: .u-push-1/3
12 *
13 * Type: String
14 */
15
16$iota-utils-push-delimiter: $iota-global-delimiter;
17
18
19/**
20 * Columns to populate push utility for
21 *
22 * Type: Unitless Number / List
23 */
24
25$iota-utils-push-columns: $iota-global-columns;
26
27
28/**
29 * Enables / Disables breakpoint specific classes
30 *
31 * Type: Boolean
32 */
33
34$iota-utils-push-res: false;
35
36
37/**
38 * Breakpoints map. Allows you to create breakpoints only
39 * for the push responsive utility.
40 *
41 * Type: Map
42 */
43
44$iota-utils-push-breakpoints: $iota-global-breakpoints;
45
46
47@import 'node_modules/iotacss/utilities/push';
diff --git a/src/scss/utilities/_size.scss b/src/scss/utilities/_size.scss
new file mode 100644
index 0000000..2f546f6
--- /dev/null
+++ b/src/scss/utilities/_size.scss
@@ -0,0 +1,47 @@
1/**
2 * Size utility delimiter. Default to \/. Ex: .u-1/3.
3 *
4 * Type: String
5 */
6
7$iota-utils-size-delimiter: \/;
8
9
10/**
11 * Size utility columns list
12 *
13 * Type: List
14 */
15
16$iota-utils-size-columns: $iota-global-columns;
17
18
19/**
20 * Enables / Disables breakpoint specific classes
21 *
22 * Type: Boolean
23 */
24
25$iota-utils-size-res: false;
26
27
28/**
29 * Breakpoints map. Overrides the breakpoints map only
30 * for margin utility.
31 *
32 * Type: Map
33 */
34
35$iota-utils-size-breakpoints: $iota-global-breakpoints;
36
37
38/**
39 * Namespace classes
40 *
41 * Type: String
42 */
43
44$iota-utils-size-namespace: '';
45
46
47@import 'node_modules/iotacss/utilities/size';
diff --git a/src/scss/utilities/_text.scss b/src/scss/utilities/_text.scss
new file mode 100644
index 0000000..a417f1b
--- /dev/null
+++ b/src/scss/utilities/_text.scss
@@ -0,0 +1,31 @@
1/**
2 * Enables / Disables breakpoint specific classes
3 *
4 * Type: Boolean
5 */
6
7$iota-utils-text-res: false;
8
9
10/**
11 * Overrides breakpoints map only for position utility
12 *
13 * Type: Map
14 */
15
16$iota-utils-text-breakpoints: $iota-global-breakpoints;
17
18
19/**
20 * Namespace classes
21 *
22 * Type: String
23 */
24
25$iota-utils-text-namespace : 'text-';
26$iota-utils-text-left-name : 'left';
27$iota-utils-text-right-name : 'right';
28$iota-utils-text-center-name : 'center';
29
30
31@import 'node_modules/iotacss/utilities/text';
diff --git a/src/scss/utilities/_transform.scss b/src/scss/utilities/_transform.scss
new file mode 100644
index 0000000..94ad183
--- /dev/null
+++ b/src/scss/utilities/_transform.scss
@@ -0,0 +1,32 @@
1/**
2 * Enables / Disables breakpoint specific classes
3 *
4 * Type: Boolean
5 */
6
7$iota-utils-transform-res: false;
8
9
10/**
11 * Breakpoints map. Overrides the breakpoints map only
12 * for margin utility.
13 *
14 * Type: Map
15 */
16
17$iota-utils-transform-breakpoints: $iota-global-breakpoints;
18
19
20/**
21 * Namespace classes
22 *
23 * Type: String
24 */
25
26$iota-utils-transform-namespace : '';
27$iota-utils-transform-capitalize-name : 'capitalize';
28$iota-utils-transform-uppercase-name : 'uppercase';
29$iota-utils-transform-lowercase-name : 'lowercase';
30
31
32@import 'node_modules/iotacss/utilities/transform';
diff --git a/src/scss/utilities/_weight.scss b/src/scss/utilities/_weight.scss
new file mode 100644
index 0000000..8785357
--- /dev/null
+++ b/src/scss/utilities/_weight.scss
@@ -0,0 +1,19 @@
1/**
2 * Weight sizes
3 *
4 * Type: Map
5 */
6
7$iota-utils-weight-sizes: ();
8
9
10/**
11 * Namespace classes
12 *
13 * Type: String
14 */
15
16$iota-utils-weight-namespace: 'weight-';
17
18
19@import 'node_modules/iotacss/utilities/weight';
diff --git a/src/styles.css b/src/styles.scss
index 90d4ee0..90d4ee0 100644
--- a/src/styles.css
+++ b/src/styles.scss
diff --git a/yarn.lock b/yarn.lock
index c0bf2f3..64a55aa 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -96,7 +96,7 @@
96 dependencies: 96 dependencies:
97 tslib "^1.9.0" 97 tslib "^1.9.0"
98 98
99"@angular/cli@~6.0.1": 99"@angular/cli@^6.0.1":
100 version "6.0.1" 100 version "6.0.1"
101 resolved "https://registry.yarnpkg.com/@angular/cli/-/cli-6.0.1.tgz#52c21451716be51716a413c5367b3f3d003f8447" 101 resolved "https://registry.yarnpkg.com/@angular/cli/-/cli-6.0.1.tgz#52c21451716be51716a413c5367b3f3d003f8447"
102 dependencies: 102 dependencies:
@@ -2852,6 +2852,10 @@ invert-kv@^1.0.0:
2852 version "1.0.0" 2852 version "1.0.0"
2853 resolved "https://registry.yarnpkg.com/invert-kv/-/invert-kv-1.0.0.tgz#104a8e4aaca6d3d8cd157a8ef8bfab2d7a3ffdb6" 2853 resolved "https://registry.yarnpkg.com/invert-kv/-/invert-kv-1.0.0.tgz#104a8e4aaca6d3d8cd157a8ef8bfab2d7a3ffdb6"
2854 2854
2855iotacss@^1.6.0:
2856 version "1.6.0"
2857 resolved "https://registry.yarnpkg.com/iotacss/-/iotacss-1.6.0.tgz#3777e072287df87aa291ec9bc0389afff1840a5d"
2858
2855ip@^1.1.0, ip@^1.1.5: 2859ip@^1.1.0, ip@^1.1.5:
2856 version "1.1.5" 2860 version "1.1.5"
2857 resolved "https://registry.yarnpkg.com/ip/-/ip-1.1.5.tgz#bdded70114290828c0a039e72ef25f5aaec4354a" 2861 resolved "https://registry.yarnpkg.com/ip/-/ip-1.1.5.tgz#bdded70114290828c0a039e72ef25f5aaec4354a"
generated by cgit v1.2.3 (git 2.39.1) at 2024-04-30 11:20:18 +0000