@dev-tcloud/tcloud-ui 7.8.1 → 8.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.
- package/docs/tcloud-ui-auth-flow.md +94 -0
- package/docs/tcloud-ui-el-copy.md +2 -2
- package/docs/tcloud-ui-tag.md +12 -0
- package/docs/tcloud-ui-tc-btn.md +12 -1
- package/fesm2022/dev-tcloud-tcloud-ui.mjs +50 -1952
- package/fesm2022/dev-tcloud-tcloud-ui.mjs.map +1 -1
- package/js/tcloud-ui-app.js +74 -70
- package/package.json +1 -1
- package/scss/tcloud-ui/styles/_claus-btn.scss +21 -0
- package/scss/tcloud-ui/styles/_colors.scss +11 -0
- package/types/dev-tcloud-tcloud-ui.d.ts +48 -703
package/package.json
CHANGED
|
@@ -129,6 +129,27 @@
|
|
|
129
129
|
);
|
|
130
130
|
}
|
|
131
131
|
|
|
132
|
+
// --- Fantasy (gradiente de marca "T-Cloud.IA") ------------------------------
|
|
133
|
+
// Preenchimento em gradiente de marca (roxo → magenta) com texto branco.
|
|
134
|
+
// O gradiente é cor de marca, CONSTANTE em light/dark (o branco garante a
|
|
135
|
+
// legibilidade nos dois temas). Como o fundo é gradiente (não sólido), hover e
|
|
136
|
+
// active usam opacity em vez da variação de cor dos demais filled.
|
|
137
|
+
&.tc-btn-fantasy {
|
|
138
|
+
background: var(--c-fantasy-gradient);
|
|
139
|
+
color: var(--c-fantasy-on);
|
|
140
|
+
border-color: var(--c-fantasy-border);
|
|
141
|
+
border-style: initial;
|
|
142
|
+
|
|
143
|
+
&:hover:not(:disabled) {
|
|
144
|
+
opacity: 0.9;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
&:active:not(:disabled) {
|
|
148
|
+
opacity: 0.85;
|
|
149
|
+
transform: scale(0.98);
|
|
150
|
+
}
|
|
151
|
+
}
|
|
152
|
+
|
|
132
153
|
// --- Outline ----------------------------------------------------------------
|
|
133
154
|
|
|
134
155
|
&.tc-btn-outline-primary {
|
|
@@ -52,6 +52,17 @@
|
|
|
52
52
|
--c-success-400: #A3E78C;
|
|
53
53
|
--c-success-500: #47B13D;
|
|
54
54
|
|
|
55
|
+
// --- Fantasy (gradiente de marca "T-Cloud.IA") ----------------------------
|
|
56
|
+
// Cor de marca (roxo → magenta), intencionalmente CONSTANTE em light/dark —
|
|
57
|
+
// o texto branco do botão garante contraste nos dois temas (paridade com o
|
|
58
|
+
// botão do chat Genesys `.subject-option`). Consumida por `.tc-btn-fantasy`.
|
|
59
|
+
--c-fantasy-start: #A44DFF; // roxo
|
|
60
|
+
--c-fantasy-end: #FF009E; // magenta
|
|
61
|
+
--c-fantasy-gradient: linear-gradient(180deg, var(--c-fantasy-start) 0%, var(--c-fantasy-end) 100%);
|
|
62
|
+
--c-fantasy-border: var(--c-fantasy-start);
|
|
63
|
+
// Texto sobre o gradiente: branco FIXO (o gradiente não inverte no dark, então o
|
|
64
|
+
// texto também não pode inverter — não usar --c-neutral-50, que vira escuro no dark).
|
|
65
|
+
--c-fantasy-on: #FFFFFF;
|
|
55
66
|
}
|
|
56
67
|
|
|
57
68
|
// =============================================================================
|