@massimo-cassandro/minimo 0.10.5 → 0.10.6

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.
Files changed (16) hide show
  1. package/README.md +1 -3
  2. package/design-tokens/basic.minimo.tokens.jsonc +6 -0
  3. package/design-tokens/form.minimo.tokens.jsonc +0 -6
  4. package/design-tokens-src/basic.minimo.tokens.mjs +58 -0
  5. package/design-tokens-src/form.minimo.tokens.mjs +0 -7
  6. package/package.json +1 -1
  7. package/src/css/forms/forms.css +2 -5
  8. package/src/css/layout-base.css +2 -0
  9. package/src/{custom-properties-default.css → custom-properties.css} +1 -1
  10. package/src/fonts.css +7 -0
  11. package/src/icons/read-me.md +1 -0
  12. package/src/minimo.css +37 -0
  13. package/design-tokens-src/basic.minimo.tokens.jsonc +0 -52
  14. package/src/fonts-template.css +0 -7
  15. package/src/index-template.css +0 -47
  16. /package/src/{custom-media-default.css → custom-media.css} +0 -0
package/README.md CHANGED
@@ -1,8 +1,6 @@
1
1
  # minimo
2
2
 
3
- Very light-size framework
4
-
5
- ...and some install [snippets](snippets/snippets.md)
3
+ My light framework + utilities
6
4
 
7
5
  ## Install
8
6
 
package/design-tokens/basic.minimo.tokens.jsonc CHANGED
@@ -25,6 +25,12 @@
25
25
  "$value": "{text.color}"
26
26
  }
27
27
  },
28
+ "accent": {
29
+ "color": {
30
+ "$type": "color",
31
+ "$value": "{accent.100}"
32
+ }
33
+ },
28
34
  "text": {
29
35
  "muted": {
30
36
  "$type": "color",
package/design-tokens/form.minimo.tokens.jsonc CHANGED
@@ -37,12 +37,6 @@
37
37
  }
38
38
  },
39
39
  "control": {
40
- "accent": {
41
- "color": {
42
- "$type": "color",
43
- "$value": "{accent.100}"
44
- }
45
- },
46
40
  "static": {
47
41
  "color": {
48
42
  "$type": "color",
package/design-tokens-src/basic.minimo.tokens.mjs ADDED
@@ -0,0 +1,58 @@
1
+ export default {
2
+ layout: {
3
+ container: {
4
+ 'max-width': {
5
+ $type: 'dimension',
6
+ $value: '80rem'
7
+ }
8
+ }
9
+ },
10
+ body: {
11
+ background: {
12
+ color: {
13
+ $type: 'color',
14
+ $value: '#fff'
15
+ }
16
+ },
17
+ text: {
18
+ $type: 'color',
19
+ $value: '{text.color}'
20
+ }
21
+ },
22
+ accent: {
23
+ color: {
24
+ $value: '{accent.100}',
25
+ $type: 'color'
26
+ }
27
+ },
28
+ text: {
29
+ muted: {
30
+ $type: 'color',
31
+ $value: '{neutral.100}'
32
+ },
33
+ dim: {
34
+ $type: 'color',
35
+ $value: '{text.muted}'
36
+ },
37
+ negative: {
38
+ $type: 'color',
39
+ $value: '#ffffff'
40
+ },
41
+ color: {
42
+ $type: 'color',
43
+ $value: '#000'
44
+ },
45
+ selected: {
46
+ background: {
47
+ color: {
48
+ $type: 'color',
49
+ $value: '#ddd'
50
+ }
51
+ },
52
+ text: {
53
+ $type: 'color',
54
+ $value: '{body.text}'
55
+ }
56
+ }
57
+ }
58
+ };
package/design-tokens-src/form.minimo.tokens.mjs CHANGED
@@ -34,13 +34,6 @@ export default {
34
34
 
35
35
  control: {
36
36
 
37
- accent: {
38
- color: {
39
- $value: '{accent.100}',
40
- $type: 'color'
41
- }
42
- },
43
-
44
37
  static: {
45
38
  color: {
46
39
  $value: '{form.control.text.color}',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@massimo-cassandro/minimo",
3
- "version": "0.10.5",
3
+ "version": "0.10.6",
4
4
  "description": "Light css framework & utilities",
5
5
  "type": "module",
6
6
  "homepage": "https://github.com/massimo-cassandro/minimo#readme",
package/src/css/forms/forms.css CHANGED
@@ -42,12 +42,12 @@
42
42
  .form-control, .form-control-static {
43
43
  display: block;
44
44
  width: 100%;
45
+ padding: var(--form-control-padding-block) var(--form-control-padding-inline);
45
46
  font-family: var(--font-family);
46
47
  font-size: var(--form-control-font-size);
47
48
  font-weight: var(--font-weight-regular);
48
49
  line-height: var(--form-control-line-height);
49
50
  color: var(--form-control-text-color);
50
- accent-color: var(--form-control-accent-color);
51
51
  background-color: var(--form-control-background-color);
52
52
  border: 1px solid var(--form-control-border-color);
53
53
  border-radius: var(--form-control-border-radius);
@@ -60,11 +60,7 @@
60
60
  outline: var(--form-control-focus-outline-width) solid var(--form-control-focus-color);
61
61
  outline-offset: var(--form-control-focus-outline-offset);
62
62
  }
63
- }
64
-
65
- .form-control, .form-control-static {
66
63
 
67
- padding: var(--form-control-padding-block) var(--form-control-padding-inline);
68
64
 
69
65
  &::placeholder {
70
66
  font-size: var(--form-control-placeholder-font-size, var(--form-control-font-size));
@@ -78,6 +74,7 @@
78
74
  font-size: var(--form-control-sm-font-size);
79
75
  }
80
76
  }
77
+
81
78
  .form-control-static {
82
79
  overflow: hidden;
83
80
  text-overflow: ellipsis;
package/src/css/layout-base.css CHANGED
@@ -8,5 +8,7 @@ html, body {
8
8
  font-style: var(--font-style-base);
9
9
  line-height: var(--font-line-height-base);
10
10
  color: var(--text-color);
11
+ accent-color: var(--accent-color);
11
12
  background-color: var(--body-background-color);
13
+
12
14
  }
package/src/{custom-properties-default.css → custom-properties.css} RENAMED
@@ -1,6 +1,7 @@
1
1
  :root {
2
2
  --accent-100: #567d0d;
3
3
  --accent-100-fg: #fff;
4
+ --accent-color: var(--accent-100);
4
5
  --alert-border-radius: var(--radius-sm);
5
6
  --alert-box-shadow: 0 0 .5rem 0 oklch(0% 0 0 / .5);
6
7
  --badge-background-color: var(--primary-100);
@@ -107,7 +108,6 @@
107
108
  --font-weight-xbold: 900;
108
109
  --font-weight-xlight: 200;
109
110
  --font-weight-xxlight: 100;
110
- --form-control-accent-color: var(--accent-100);
111
111
  --form-control-background-color: var(--body-background-color);
112
112
  --form-control-border-color: #666;
113
113
  --form-control-border-radius: var(--radius-xxs);
package/src/fonts.css ADDED
@@ -0,0 +1,7 @@
1
+ /*
2
+ https://fontsource.org/fonts/rubik/install
3
+
4
+ */
5
+
6
+ @import '@fontsource-variable/rubik/wght.css';
7
+ @import '@fontsource-variable/rubik/wght-italic.css';
package/src/icons/read-me.md ADDED
@@ -0,0 +1 @@
1
+ Quite most icons from <https://phosphoricons.com/>
package/src/minimo.css ADDED
@@ -0,0 +1,37 @@
1
+
2
+ /* @import '@app/fonts.css'; */
3
+ /* @import '@app/css/custom-media.css'; */ /* managed by postcss */
4
+ @import '@app/css/custom-properties.css';
5
+
6
+ @import '@minimo/css/reset.css';
7
+ @import '@minimo/css/layout-base.css';
8
+ @import '@minimo/css/container.css';
9
+
10
+ @import '@minimo/css/forms/forms.css';
11
+ @import '@minimo/css/forms/fieldset.css';
12
+ @import '@minimo/css/forms/form-collections.css';
13
+ @import '@minimo/css/forms/form-group.css';
14
+ @import '@minimo/css/forms/input-group.css';
15
+ @import '@minimo/css/forms/form-disabled-readonly.css';
16
+ @import '@minimo/css/forms/validation.css';
17
+ @import '@minimo/css/forms/form-utilities.css';
18
+
19
+ @import '@minimo/css/buttons/buttons.css';
20
+ @import '@minimo/css/buttons/buttons-primary.css';
21
+ @import '@minimo/css/buttons/buttons-secondary.css';
22
+ @import '@minimo/css/buttons/status-buttons.css';
23
+ @import '@minimo/css/buttons/btn-close.css';
24
+
25
+ @import '@minimo/css/badge.css';
26
+ @import '@minimo/css/text.css';
27
+ @import '@minimo/css/anchors.css';
28
+ @import '@minimo/css/headings.css';
29
+ @import '@minimo/css/alerts.css';
30
+ @import '@minimo/css/icons.css';
31
+ @import '@minimo/css/svg.css';
32
+ @import '@minimo/css/table.css';
33
+ @import '@minimo/css/flex.css';
34
+ @import '@minimo/css/grid.css';
35
+ @import '@minimo/css/details.css';
36
+ @import '@minimo/css/utilities.css';
37
+
package/design-tokens-src/basic.minimo.tokens.jsonc DELETED
@@ -1,52 +0,0 @@
1
- {
2
- "layout": {
3
- "container": {
4
- "max-width": {
5
- "$type": "dimension",
6
- "$value": "80rem"
7
- }
8
- }
9
- },
10
- "body": {
11
- "background": {
12
- "color": {
13
- "$type": "color",
14
- "$value": "#fff"
15
- }
16
- },
17
- "text": {
18
- "$type": "color",
19
- "$value": "{text.color}"
20
- }
21
- },
22
- "text": {
23
- "muted": {
24
- "$type": "color",
25
- "$value": "{neutral.100}"
26
- },
27
- "dim": {
28
- "$type": "color",
29
- "$value": "{text.muted}"
30
- },
31
- "negative": {
32
- "$type": "color",
33
- "$value": "#ffffff"
34
- },
35
- "color": {
36
- "$type": "color",
37
- "$value": "#000"
38
- },
39
- "selected": {
40
- "background": {
41
- "color": {
42
- "$type": "color",
43
- "$value": "#ddd"
44
- }
45
- },
46
- "text": {
47
- "$type": "color",
48
- "$value": "{body.text}"
49
- }
50
- }
51
- }
52
- }
package/src/fonts-template.css DELETED
@@ -1,7 +0,0 @@
1
- /*
2
- https://fontsource.org/fonts/rethink-sans/install
3
-
4
- */
5
-
6
- @import '@fontsource-variable/rethink-sans/wght.css';
7
- @import '@fontsource-variable/rethink-sans/wght-italic.css';
package/src/index-template.css DELETED
@@ -1,47 +0,0 @@
1
- /*
2
- CSS globali
3
- i fogli stile delle singole parti sono importate direttamente nel file js relativo
4
- o (se non necessario), direttamente nel file js principale
5
- */
6
-
7
- @import '@app/css/fonts.css';
8
- /* @import '../node_modules/open-props/open-props.min.css'; */
9
- /* @import '@app/css/custom-properties-figma.css'; */
10
- @import '@app/css/custom-media.css';
11
- @import '@app/css/custom-properties.css';
12
-
13
- @import '@minimo/css/reset.css';
14
- @import '@minimo/css/layout-base.css';
15
- @import '@minimo/css/container.css';
16
-
17
- /* @import '@minimo/css/forms/forms.css'; */
18
- /* @import '@minimo/css/forms/fieldset.css'; */
19
- /* @import '@minimo/css/forms/form-collections.css'; */
20
- /* @import '@minimo/css/forms/form-group.css'; */
21
- /* @import '@minimo/css/forms/input-group.css'; */
22
- /* @import '@minimo/css/forms/form-disabled-readonly.css'; */
23
- /* @import '@minimo/css/forms/validation.css'; */
24
- /* @import '@minimo/css/forms/form-utilities.css'; */
25
-
26
- @import '@minimo/css/buttons/buttons.css';
27
- @import '@minimo/css/buttons/buttons-primary.css';
28
- @import '@minimo/css/buttons/buttons-secondary.css';
29
- /* @import '@minimo/css/buttons/status-buttons.css'; */
30
- /* @import '@minimo/css/buttons/btn-close.css'; */
31
- /* @import '@minimo/css/badge.css'; */
32
- @import '@minimo/css/text.css';
33
- @import '@minimo/css/anchors.css';
34
- /* @import '@minimo/css/headings.css'; */
35
- /* @import '@minimo/css/alerts.css'; */
36
- /* @import '@minimo/css/icons.css'; */
37
- @import '@minimo/css/svg.css';
38
- /* @import '@minimo/css/table.css'; */
39
- /* @import '@minimo/css/flex.css'; */
40
- /* @import '@minimo/css/grid.css'; */
41
- /* @import '@minimo/css/details.css'; */
42
- /* @import '@minimo/css/utilities.css'; */
43
-
44
-
45
-
46
- /* file progetto */
47
- /* @import '@src/path_to/layout.css'; */