flicker-alerts 1.0.13 → 1.0.15
Sign up to get free protection for your applications and to get access to all the features.
- package/index.d.ts +1 -1
- package/package.json +2 -2
- package/style.css +17 -4
package/index.d.ts
CHANGED
@@ -5,7 +5,7 @@ declare module 'flicker-alerts' {
|
|
5
5
|
title: string;
|
6
6
|
message: string;
|
7
7
|
duration?: number; // Duração do alerta (opcional)
|
8
|
-
position?: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' | 'center'; // Nova propriedade 'position'
|
8
|
+
position?: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' | 'center' | 'top-center' | 'bottom-center'; // Nova propriedade 'position' com 'bottom-center'
|
9
9
|
}
|
10
10
|
|
11
11
|
export default class FlickerAlerts {
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "flicker-alerts",
|
3
|
-
"version": "1.0.
|
3
|
+
"version": "1.0.15",
|
4
4
|
"description": "Biblioteca para alertas animados",
|
5
5
|
"main": "index.js",
|
6
6
|
"types": "index.d.ts",
|
@@ -16,6 +16,6 @@
|
|
16
16
|
"author": "",
|
17
17
|
"license": "MIT",
|
18
18
|
"dependencies": {
|
19
|
-
"flicker-alerts": "^1.0.
|
19
|
+
"flicker-alerts": "^1.0.15"
|
20
20
|
}
|
21
21
|
}
|
package/style.css
CHANGED
@@ -23,10 +23,10 @@
|
|
23
23
|
display: flex;
|
24
24
|
align-items: center;
|
25
25
|
justify-content: center;
|
26
|
-
width:
|
27
|
-
height:
|
26
|
+
width: 2rem; /* Diminui o tamanho do círculo */
|
27
|
+
height: 2rem; /* Diminui o tamanho do círculo */
|
28
28
|
border-radius: 50%;
|
29
|
-
font-size:
|
29
|
+
font-size: 1rem; /* Diminui o tamanho do ícone */
|
30
30
|
line-height: 0;
|
31
31
|
margin-right: 1rem; /* Espaço entre o ícone e o conteúdo */
|
32
32
|
}
|
@@ -35,6 +35,12 @@
|
|
35
35
|
font-size: inherit; /* Ajusta o ícone ao tamanho da div */
|
36
36
|
}
|
37
37
|
|
38
|
+
.bottom-center {
|
39
|
+
bottom: 1rem;
|
40
|
+
left: 50%;
|
41
|
+
transform: translateX(-50%);
|
42
|
+
}
|
43
|
+
|
38
44
|
/* Estilo do conteúdo do alerta (título e mensagem) */
|
39
45
|
.alert-custom .content {
|
40
46
|
display: flex;
|
@@ -107,7 +113,7 @@
|
|
107
113
|
}
|
108
114
|
|
109
115
|
/* Classes para o container de alertas */
|
110
|
-
.top-right, .top-left, .bottom-right, .bottom-left, .center {
|
116
|
+
.top-right, .top-left, .bottom-right, .bottom-left, .center, .top-center {
|
111
117
|
position: fixed;
|
112
118
|
display: flex;
|
113
119
|
flex-direction: column;
|
@@ -142,6 +148,13 @@
|
|
142
148
|
transform: translate(-50%, -50%);
|
143
149
|
}
|
144
150
|
|
151
|
+
/* Novo estilo para o top-center */
|
152
|
+
.top-center {
|
153
|
+
top: 1rem;
|
154
|
+
left: 50%;
|
155
|
+
transform: translateX(-50%);
|
156
|
+
}
|
157
|
+
|
145
158
|
/* Barra de progresso */
|
146
159
|
.progress-bar {
|
147
160
|
position: absolute;
|