@massimo-cassandro/minimo 1.20.16 → 1.21.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.
Files changed (52) hide show
  1. package/package.json +1 -1
  2. package/src/components/autocomplete/autocomplete.css +113 -109
  3. package/src/components/inner-nav/inner-nav.css +13 -9
  4. package/src/components/modal-alert/modal-alert.module.css +157 -153
  5. package/src/components/modal-popup/modal-popup.module.css +89 -85
  6. package/src/components/overlay/overlay.css +14 -10
  7. package/src/components/sf-macro/sf-macro.css +60 -56
  8. package/src/components/slide-up-down-toggle/slide-up-down-toggle.module.css +33 -29
  9. package/src/components/snackbar/snackbar.module.css +93 -89
  10. package/src/components/spinner/spinner-circle-basic.css +18 -14
  11. package/src/components/spinner/spinner.module.css +8 -4
  12. package/src/components/unsplash-page/unsplash-page.module.css +260 -256
  13. package/src/css/alerts.css +55 -53
  14. package/src/css/badge.css +16 -12
  15. package/src/css/buttons/btn-close.css +57 -53
  16. package/src/css/buttons/buttons-primary.css +38 -34
  17. package/src/css/buttons/buttons-secondary.css +38 -34
  18. package/src/css/buttons/buttons.css +84 -80
  19. package/src/css/buttons/status-buttons.css +66 -63
  20. package/src/css/container.css +9 -5
  21. package/src/css/data-formats.css +28 -24
  22. package/src/css/details.css +17 -13
  23. package/src/css/dimensions.css +13 -9
  24. package/src/css/display.css +27 -23
  25. package/src/css/flex.css +39 -35
  26. package/src/css/forms/fieldset.css +47 -43
  27. package/src/css/forms/form-collections.css +16 -12
  28. package/src/css/forms/form-disabled-readonly.css +31 -27
  29. package/src/css/forms/form-group.css +15 -11
  30. package/src/css/forms/form-utilities.css +32 -28
  31. package/src/css/forms/forms.css +136 -134
  32. package/src/css/forms/input-group.css +47 -43
  33. package/src/css/forms/switch.css +50 -46
  34. package/src/css/forms/validation.css +26 -22
  35. package/src/css/grid.css +66 -62
  36. package/src/css/headings.css +32 -28
  37. package/src/css/icons.css +41 -37
  38. package/src/css/layout-base.css +16 -12
  39. package/src/css/links.css +40 -36
  40. package/src/css/margin-padding-bootstrap-media.css +1836 -1832
  41. package/src/css/margin-padding-bootstrap.css +445 -441
  42. package/src/css/margin-padding-media.css +1836 -1832
  43. package/src/css/margin-padding.css +445 -441
  44. package/src/css/overflow.css +7 -3
  45. package/src/css/position.css +5 -1
  46. package/src/css/reset.css +47 -44
  47. package/src/css/svg.css +6 -2
  48. package/src/css/table.css +59 -55
  49. package/src/css/text.css +96 -92
  50. package/src/css/visibility.css +23 -19
  51. package/src/minimo.css +2 -0
  52. package/src/web-components/s-datatable-component/s-datatable-component.module.css +175 -171
@@ -1,4 +1,8 @@
1
- .overflow-hidden {
2
- overflow: hidden;
3
- }
1
+ @layer base {
2
+
3
+ .overflow-hidden {
4
+ overflow: hidden;
5
+ }
4
6
 
7
+
8
+ }
@@ -1,4 +1,8 @@
1
- /* .position-relative {
1
+ @layer base {
2
+
3
+ /* .position-relative {
2
4
  position: relative;
3
5
  } */
4
6
 
7
+
8
+ }
package/src/css/reset.css CHANGED
@@ -3,57 +3,60 @@
3
3
  https://www.joshwcomeau.com/css/custom-css-reset/
4
4
  */
5
5
  /* 1. Use a more-intuitive box-sizing model */
6
- *, *::before, *::after {
7
- box-sizing: border-box;
8
- }
6
+ @layer reset {
9
7
 
10
- /* 2. Remove default margin */
11
- * {
12
- margin: 0;
13
- }
8
+ *, *::before, *::after {
9
+ box-sizing: border-box;
10
+ }
14
11
 
15
- /* 3. Enable keyword animations */
16
- @media (prefers-reduced-motion: no-preference) {
17
- html {
18
- interpolate-size: allow-keywords;
12
+ /* 2. Remove default margin */
13
+ * {
14
+ margin: 0;
19
15
  }
20
- }
21
16
 
22
- body {
23
- /* 4. Add accessible line-height */
24
- line-height: 1.5;
25
- /* 5. Improve text rendering */
26
- -webkit-font-smoothing: antialiased;
27
- }
17
+ /* 3. Enable keyword animations */
18
+ @media (prefers-reduced-motion: no-preference) {
19
+ html {
20
+ interpolate-size: allow-keywords;
21
+ }
22
+ }
28
23
 
29
- /* 6. Improve media defaults */
30
- img, picture, video, canvas, svg {
31
- display: block;
32
- max-width: 100%;
33
- }
24
+ body {
25
+ /* 4. Add accessible line-height */
26
+ line-height: 1.5;
27
+ /* 5. Improve text rendering */
28
+ -webkit-font-smoothing: antialiased;
29
+ }
34
30
 
35
- /* 7. Inherit fonts for form controls */
36
- input, button, textarea, select {
37
- font: inherit;
38
- }
31
+ /* 6. Improve media defaults */
32
+ img, picture, video, canvas, svg {
33
+ display: block;
34
+ max-width: 100%;
35
+ }
39
36
 
40
- /* 8. Avoid text overflows */
41
- p, h1, h2, h3, h4, h5, h6 {
42
- overflow-wrap: break-word;
43
- }
37
+ /* 7. Inherit fonts for form controls */
38
+ input, button, textarea, select {
39
+ font: inherit;
40
+ }
44
41
 
45
- /* 9. Improve line wrapping */
46
- p {
47
- text-wrap: pretty;
48
- }
49
- h1, h2, h3, h4, h5, h6 {
50
- text-wrap: balance;
51
- }
42
+ /* 8. Avoid text overflows */
43
+ p, h1, h2, h3, h4, h5, h6 {
44
+ overflow-wrap: break-word;
45
+ }
52
46
 
53
- /*
54
- 10. Create a root stacking context
55
- */
56
- /* stylelint-disable-next-line selector-id-pattern, selector-max-id */
57
- #root, #__next {
58
- isolation: isolate;
47
+ /* 9. Improve line wrapping */
48
+ p {
49
+ text-wrap: pretty;
50
+ }
51
+ h1, h2, h3, h4, h5, h6 {
52
+ text-wrap: balance;
53
+ }
54
+
55
+ /*
56
+ 10. Create a root stacking context
57
+ */
58
+ /* stylelint-disable-next-line selector-id-pattern, selector-max-id */
59
+ #root, #__next {
60
+ isolation: isolate;
61
+ }
59
62
  }
package/src/css/svg.css CHANGED
@@ -1,3 +1,7 @@
1
- svg {
2
- fill: currentColor;
1
+ @layer base {
2
+
3
+ svg {
4
+ fill: currentColor;
5
+ }
6
+
3
7
  }
package/src/css/table.css CHANGED
@@ -1,82 +1,84 @@
1
- /* wrapper per le tabelle per evitare che superino la larghezza dello spazio disponibile */
1
+ @layer base {
2
2
 
3
- /* purgecss start ignore */
3
+ /* wrapper per le tabelle per evitare che superino la larghezza dello spazio disponibile */
4
4
 
5
- .table-responsive {
6
- max-width: 100%;
7
- overflow-x: auto;
8
- }
5
+ /* purgecss start ignore */
9
6
 
10
- /* TODO opzione per attivare/disattuvare alternate color */
11
- .table {
7
+ .table-responsive {
8
+ max-width: 100%;
9
+ overflow-x: auto;
10
+ }
12
11
 
13
- --_alternate-row-bg: var(--table-body-tr-alt-bg-color);
14
- --_hover-row-bg: var(--table-body-tr-hover-bg-color);
15
- --_border-color: var(--table-border-color);
16
- --_border: 1px solid var(--_border-color);
12
+ /* TODO opzione per attivare/disattuvare alternate color */
13
+ .table {
17
14
 
18
- width: 100%;
19
- margin: 1rem 0;
20
- border-collapse: collapse;
15
+ --_alternate-row-bg: var(--table-body-tr-alt-bg-color);
16
+ --_hover-row-bg: var(--table-body-tr-hover-bg-color);
17
+ --_border-color: var(--table-border-color);
18
+ --_border: 1px solid var(--_border-color);
21
19
 
22
- tr {
23
- border-bottom: var(--_border);
24
- }
20
+ width: 100%;
21
+ margin: 1rem 0;
22
+ border-collapse: collapse;
25
23
 
26
- thead {
27
- background-color: var(--table-thead-background-color);
28
- tr:last-child {
29
- border-width: var(--table-thead-border-width);
24
+ tr {
25
+ border-bottom: var(--_border);
30
26
  }
31
- }
32
27
 
33
- tfoot {
34
- background-color: var(--table-tfoot-background-color);
35
- tr:first-child {
36
- border-block-start: var(--table-tfoot-border-width) solid var(--_border-color);
37
- }
38
- th, td {
39
- font-weight: var(--table-tfoot-font-weight);
28
+ thead {
29
+ background-color: var(--table-thead-background-color);
30
+ tr:last-child {
31
+ border-width: var(--table-thead-border-width);
32
+ }
40
33
  }
41
- }
42
34
 
43
- tbody {
44
- tr:nth-child(even) {
45
- background-color: var(--_alternate-row-bg);
35
+ tfoot {
36
+ background-color: var(--table-tfoot-background-color);
37
+ tr:first-child {
38
+ border-block-start: var(--table-tfoot-border-width) solid var(--_border-color);
39
+ }
40
+ th, td {
41
+ font-weight: var(--table-tfoot-font-weight);
42
+ }
46
43
  }
47
44
 
48
- @media (hover: hover) {
49
- tr:hover {
50
- background-color: var(--_hover-row-bg);
45
+ tbody {
46
+ tr:nth-child(even) {
47
+ background-color: var(--_alternate-row-bg);
48
+ }
49
+
50
+ @media (hover: hover) {
51
+ tr:hover {
52
+ background-color: var(--_hover-row-bg);
53
+ }
51
54
  }
52
55
  }
53
- }
54
56
 
55
57
 
56
- th, td {
57
- padding: var(--table-cell-padding-block) var(--table-cell-padding-inline);
58
- line-height: var(--table-cell-line-height);
59
- vertical-align: top;
60
- text-align: start;
58
+ th, td {
59
+ padding: var(--table-cell-padding-block) var(--table-cell-padding-inline);
60
+ line-height: var(--table-cell-line-height);
61
+ vertical-align: top;
62
+ text-align: start;
61
63
 
62
- .valign-middle &, &.valign-middle {
63
- vertical-align: middle;
64
+ .valign-middle &, &.valign-middle {
65
+ vertical-align: middle;
66
+ }
64
67
  }
65
- }
66
68
 
67
- &.table-bordered {
68
- border: var(--_border);
69
+ &.table-bordered {
70
+ border: var(--_border);
69
71
 
70
- th, td {
71
- &:not(:first-child) {
72
- border-inline-start: var(--_border);
72
+ th, td {
73
+ &:not(:first-child) {
74
+ border-inline-start: var(--_border);
75
+ }
73
76
  }
74
77
  }
75
- }
76
78
 
77
- }
79
+ }
78
80
 
79
- /*
81
+ /*
80
82
  @media (prefers-color-scheme: dark) {
81
83
  .table {
82
84
  --_border-color: var(--_stone-8);
@@ -86,4 +88,6 @@
86
88
  }
87
89
  */
88
90
 
89
- /* purgecss end ignore */
91
+ /* purgecss end ignore */
92
+
93
+ }
package/src/css/text.css CHANGED
@@ -1,107 +1,111 @@
1
- /* stylelint-disable declaration-no-important */
2
- p {
3
- margin: 0 0 var(--size-sm);
4
- }
1
+ @layer base {
5
2
 
6
- strong, b {
7
- font-weight: 700;
8
- }
9
- em, .italic {
10
- font-style: italic;
11
- }
3
+ /* stylelint-disable declaration-no-important */
4
+ p {
5
+ margin: 0 0 var(--size-sm);
6
+ }
12
7
 
13
- .text-center {
14
- text-align: center !important;
15
- }
16
- .text-right, .text-end {
17
- text-align: end !important;
18
- }
19
- .text-nowrap {
20
- white-space: nowrap;
21
- }
8
+ strong, b {
9
+ font-weight: 700;
10
+ }
11
+ em, .italic {
12
+ font-style: italic;
13
+ }
22
14
 
23
- .text-monospace {
24
- font-family: var(--font-family-mono);
25
- }
26
- .text-truncate {
27
- overflow: hidden;
28
- text-overflow: ellipsis;
29
- white-space: nowrap;
30
- }
15
+ .text-center {
16
+ text-align: center !important;
17
+ }
18
+ .text-right, .text-end {
19
+ text-align: end !important;
20
+ }
21
+ .text-nowrap {
22
+ white-space: nowrap;
23
+ }
31
24
 
32
- /* .text-nowrap-dskt {
25
+ .text-monospace {
26
+ font-family: var(--font-family-mono);
27
+ }
28
+ .text-truncate {
29
+ overflow: hidden;
30
+ text-overflow: ellipsis;
31
+ white-space: nowrap;
32
+ }
33
+
34
+ /* .text-nowrap-dskt {
33
35
  @media (--media-large-viewport-up) {
34
36
  white-space: nowrap;
35
37
  }
36
38
  } */
37
39
 
38
- .font-italic {
39
- font-style: italic;
40
- }
41
- .font-light {
42
- font-weight: var(--font-weight-light);
43
- }
44
- .font-regular {
45
- font-weight: var(--font-weight-regular);
46
- }
47
- .font-medium {
48
- font-weight: var(--font-weight-medium);
49
- }
50
- .font-semibold {
51
- font-weight: var(--font-weight-semibold);
52
- }
53
- .font-bold {
54
- font-weight: var(--font-weight-bold);
55
- }
40
+ .font-italic {
41
+ font-style: italic;
42
+ }
43
+ .font-light {
44
+ font-weight: var(--font-weight-light);
45
+ }
46
+ .font-regular {
47
+ font-weight: var(--font-weight-regular);
48
+ }
49
+ .font-medium {
50
+ font-weight: var(--font-weight-medium);
51
+ }
52
+ .font-semibold {
53
+ font-weight: var(--font-weight-semibold);
54
+ }
55
+ .font-bold {
56
+ font-weight: var(--font-weight-bold);
57
+ }
56
58
 
57
- .text-xs {
58
- font-size: var(--font-size-xs);
59
- }
60
- small, .small {
61
- font-size: .9em;
62
- }
63
- .text-sm {
64
- font-size: var(--font-size-sm);
65
- }
66
- .text-md {
67
- font-size: var(--font-size-md);
68
- }
59
+ .text-xs {
60
+ font-size: var(--font-size-xs);
61
+ }
62
+ small, .small {
63
+ font-size: .9em;
64
+ }
65
+ .text-sm {
66
+ font-size: var(--font-size-sm);
67
+ }
68
+ .text-md {
69
+ font-size: var(--font-size-md);
70
+ }
69
71
 
70
- .text-muted {
71
- color: var(--text-muted);
72
- }
72
+ .text-muted {
73
+ color: var(--text-muted);
74
+ }
73
75
 
74
- ul {
75
- margin: 1rem 0;
76
- list-style-type: disc;
77
- }
78
- li {
79
- margin-left: 1.5rem;
80
- }
76
+ ul {
77
+ margin: 1rem 0;
78
+ list-style-type: disc;
79
+ }
80
+ li {
81
+ margin-left: 1.5rem;
82
+ }
81
83
 
82
- .text-primary {
83
- color: var(--primary-100);
84
- }
85
- .text-secondary {
86
- color: var(--secondary-100);
87
- }
88
- .text-accent {
89
- color: var(--accent);
90
- }
91
- .text-danger {
92
- color: var(--status-danger-color);
93
- }
94
- .text-warning {
95
- color: var(--status-warning-color);
96
- }
97
- .text-info {
98
- color: var(--status-info-color);
99
- }
100
- .text-success {
101
- color: var(--status-success-color);
102
- }
84
+ .text-primary {
85
+ color: var(--primary-100);
86
+ }
87
+ .text-secondary {
88
+ color: var(--secondary-100);
89
+ }
90
+ .text-accent {
91
+ color: var(--accent);
92
+ }
93
+ .text-danger {
94
+ color: var(--status-danger-color);
95
+ }
96
+ .text-warning {
97
+ color: var(--status-warning-color);
98
+ }
99
+ .text-info {
100
+ color: var(--status-info-color);
101
+ }
102
+ .text-success {
103
+ color: var(--status-success-color);
104
+ }
105
+
106
+ .text-numeric {
107
+ font-feature-settings: 'lnum', 'tnum';
108
+ font-variant-numeric: lining-nums tabular-nums;
109
+ }
103
110
 
104
- .text-numeric {
105
- font-feature-settings: 'lnum', 'tnum';
106
- font-variant-numeric: lining-nums tabular-nums;
107
111
  }
@@ -1,25 +1,27 @@
1
- /* stylelint-disable declaration-no-important */
1
+ @layer base {
2
2
 
3
- /* purgecss start ignore */
4
- .visually-hidden {
5
- display: block;
6
- width: 1px !important;
7
- height: 1px !important;
8
- padding: 0 !important;
9
- margin: -1px !important;
10
- overflow: hidden !important;
11
- white-space: nowrap !important;
12
- border: 0 !important;
13
- clip-path: rect(0 0 0 0) !important;
14
- }
15
- .visibility-hidden {
16
- visibility: hidden;
17
- }
18
- /* purgecss end ignore */
3
+ /* stylelint-disable declaration-no-important */
4
+
5
+ /* purgecss start ignore */
6
+ .visually-hidden {
7
+ display: block;
8
+ width: 1px !important;
9
+ height: 1px !important;
10
+ padding: 0 !important;
11
+ margin: -1px !important;
12
+ overflow: hidden !important;
13
+ white-space: nowrap !important;
14
+ border: 0 !important;
15
+ clip-path: rect(0 0 0 0) !important;
16
+ }
17
+ .visibility-hidden {
18
+ visibility: hidden;
19
+ }
20
+ /* purgecss end ignore */
19
21
 
20
22
 
21
- /* TODO da rivedere */
22
- /* @media (--media-xlarge-viewport-up) {
23
+ /* TODO da rivedere */
24
+ /* @media (--media-xlarge-viewport-up) {
23
25
  .xlg-visually-hidden {
24
26
  display: block;
25
27
  width: 1px !important;
@@ -48,3 +50,5 @@
48
50
 
49
51
  */
50
52
 
53
+
54
+ }
package/src/minimo.css CHANGED
@@ -1,3 +1,5 @@
1
+ /* project e overrides sono destinati all'uso nel progetto che implementa minimo */
2
+ @layer reset, base, components, utilities, project, overrides;
1
3
 
2
4
  /* @import '@src/fonts.css'; */
3
5
  /* @import '@src/css/custom-media.css'; */ /* managed by postcss */