@jaws-developers-customers/consulca-types 1.2.32 → 1.2.33
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/README.md +26 -9
- package/colors.css +7 -0
- package/package.json +4 -2
package/README.md
CHANGED
|
@@ -26,7 +26,7 @@ Il workflow genera una versione unica per ogni run su `master`, così la pubblic
|
|
|
26
26
|
|
|
27
27
|
- tipi TypeScript per le entità principali (`User`, `Building`, `SingleBuilding`, `Apartment`, `Lease`, `Inspection`, `Claim`, `Work`, ...)
|
|
28
28
|
- cataloghi `ENUM` dello schema (`USER_ROLES`, `ACCESS_CHANNELS`, `ACCESS_ROLES`, `DEVICE_TYPES`, ...)
|
|
29
|
-
-
|
|
29
|
+
- variabili CSS condivise importabili da `colors.css` e configurazione `CONSTANTS`, incluso il logo Base64
|
|
30
30
|
- helper:
|
|
31
31
|
- `formatDate`
|
|
32
32
|
- `formatDateTime`
|
|
@@ -39,16 +39,32 @@ Il workflow genera una versione unica per ogni run su `master`, così la pubblic
|
|
|
39
39
|
|
|
40
40
|
## Colori e logo Consulca
|
|
41
41
|
|
|
42
|
-
|
|
42
|
+
Importa il foglio di stile nell'entrypoint della tua app (con un bundler che supporta gli import CSS):
|
|
43
|
+
|
|
44
|
+
```js
|
|
45
|
+
import '@jaws-developers-customers/consulca-types/colors.css';
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
Il foglio definisce le costanti come variabili CSS globali in `:root`, utilizzabili con `var(...)`.
|
|
43
49
|
La palette usa i valori esadecimali per il web indicati in `Loghi Consulca.pdf`:
|
|
44
50
|
|
|
45
51
|
| Variabile | Colore | Utilizzo |
|
|
46
52
|
| --- | --- | --- |
|
|
47
|
-
|
|
|
48
|
-
|
|
|
49
|
-
|
|
|
50
|
-
|
|
|
51
|
-
|
|
|
53
|
+
| `--color-primary` | `#2D2F7F` | Blu Consulca: pulsanti principali, link e intestazioni |
|
|
54
|
+
| `--color-secondary` | `#C8D9F1` | Azzurro Consulca: sfondi secondari e selezioni |
|
|
55
|
+
| `--color-accent` | `#CAC8CA` | Grigio Consulca: bordi ed elementi decorativi |
|
|
56
|
+
| `--color-background` | `#F7F9FB` | Fondo neutro dell'interfaccia, mantenuto dalla palette precedente e non definito nel PDF |
|
|
57
|
+
| `--color-text` | `#2D2F7F` | Testo principale in blu Consulca |
|
|
58
|
+
|
|
59
|
+
```css
|
|
60
|
+
.header {
|
|
61
|
+
background-color: var(--color-secondary);
|
|
62
|
+
color: var(--color-text);
|
|
63
|
+
}
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
L'oggetto JavaScript immutabile `COLOR_PALETTE` rimane disponibile per compatibilita'
|
|
67
|
+
con i progetti esistenti. `CONSTANTS` rimane disponibile sia con `require` sia con `import`.
|
|
52
68
|
|
|
53
69
|
I nomi della palette rimangono invariati per i progetti esistenti, ma i colori cambiano:
|
|
54
70
|
in particolare `accent` non e' piu' rosso e non va usato per indicare errori.
|
|
@@ -62,11 +78,12 @@ o conversioni nel browser. `CONSTANTS.ICON` conserva l'URL dell'icona esistente;
|
|
|
62
78
|
### Utilizzo in React
|
|
63
79
|
|
|
64
80
|
```jsx
|
|
65
|
-
import
|
|
81
|
+
import '@jaws-developers-customers/consulca-types/colors.css';
|
|
82
|
+
import { CONSTANTS } from '@jaws-developers-customers/consulca-types';
|
|
66
83
|
|
|
67
84
|
export function Header() {
|
|
68
85
|
return (
|
|
69
|
-
<header style={{ backgroundColor:
|
|
86
|
+
<header style={{ backgroundColor: 'var(--color-secondary)', color: 'var(--color-text)' }}>
|
|
70
87
|
<img
|
|
71
88
|
src={CONSTANTS.LOGO}
|
|
72
89
|
alt="Consulca SA"
|
package/colors.css
ADDED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jaws-developers-customers/consulca-types",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.33",
|
|
4
4
|
"description": "Tipi e helper per il dominio Consulca.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"consulca",
|
|
@@ -26,7 +26,8 @@
|
|
|
26
26
|
"require": "./index.js",
|
|
27
27
|
"import": "./index.mjs",
|
|
28
28
|
"default": "./index.js"
|
|
29
|
-
}
|
|
29
|
+
},
|
|
30
|
+
"./colors.css": "./colors.css"
|
|
30
31
|
},
|
|
31
32
|
"main": "index.js",
|
|
32
33
|
"types": "index.d.ts",
|
|
@@ -34,6 +35,7 @@
|
|
|
34
35
|
"test": "test"
|
|
35
36
|
},
|
|
36
37
|
"files": [
|
|
38
|
+
"colors.css",
|
|
37
39
|
"index.js",
|
|
38
40
|
"index.mjs",
|
|
39
41
|
"index.d.ts",
|