wagtail-enap-designsystem 1.2.1.145__py3-none-any.whl → 1.2.1.147__py3-none-any.whl

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.

Potentially problematic release.


This version of wagtail-enap-designsystem might be problematic. Click here for more details.

Files changed (32) hide show
  1. enap_designsystem/blocks/__init__.py +2 -0
  2. enap_designsystem/blocks/html_blocks.py +88 -0
  3. enap_designsystem/models.py +81 -13
  4. enap_designsystem/static/enap_designsystem/blocks/apresentacao_block.css +174 -0
  5. enap_designsystem/static/enap_designsystem/blocks/cards_section.css +112 -0
  6. enap_designsystem/static/enap_designsystem/blocks/cards_titles.css +229 -0
  7. enap_designsystem/static/enap_designsystem/blocks/carousel_images.css +323 -0
  8. enap_designsystem/static/enap_designsystem/blocks/carousel_responsive.css +522 -0
  9. enap_designsystem/static/enap_designsystem/blocks/carousel_responsivo_snippet.css +294 -0
  10. enap_designsystem/static/enap_designsystem/blocks/clientes_block.css +146 -0
  11. enap_designsystem/templates/enap_designsystem/base.html +8 -1
  12. enap_designsystem/templates/enap_designsystem/blocks/apresentacao_block.html +10 -8
  13. enap_designsystem/templates/enap_designsystem/blocks/apresentacao_simple_block.html +4 -3
  14. enap_designsystem/templates/enap_designsystem/blocks/banner.html +14 -1
  15. enap_designsystem/templates/enap_designsystem/blocks/banner_logo.html +15 -1
  16. enap_designsystem/templates/enap_designsystem/blocks/card_block.html +2 -2
  17. enap_designsystem/templates/enap_designsystem/blocks/cards_section.html +2 -109
  18. enap_designsystem/templates/enap_designsystem/blocks/cards_titles.html +11 -3
  19. enap_designsystem/templates/enap_designsystem/blocks/carousel.html +1 -187
  20. enap_designsystem/templates/enap_designsystem/blocks/carousel_images.html +17 -314
  21. enap_designsystem/templates/enap_designsystem/blocks/carousel_responsive.html +0 -328
  22. enap_designsystem/templates/enap_designsystem/blocks/carousel_responsivo_snippet.html +3 -197
  23. enap_designsystem/templates/enap_designsystem/blocks/clientes_block.html +9 -152
  24. enap_designsystem/templates/enap_designsystem/blocks/footer_block.html +122 -0
  25. enap_designsystem/templates/enap_designsystem/blocks/section_block.html +1 -1
  26. enap_designsystem/templates/enap_designsystem/blocks/video_hero_banner.html +1 -2
  27. enap_designsystem/templates/enap_designsystem/pages/showcase_components.html +501 -180
  28. {wagtail_enap_designsystem-1.2.1.145.dist-info → wagtail_enap_designsystem-1.2.1.147.dist-info}/METADATA +1 -1
  29. {wagtail_enap_designsystem-1.2.1.145.dist-info → wagtail_enap_designsystem-1.2.1.147.dist-info}/RECORD +32 -24
  30. {wagtail_enap_designsystem-1.2.1.145.dist-info → wagtail_enap_designsystem-1.2.1.147.dist-info}/WHEEL +0 -0
  31. {wagtail_enap_designsystem-1.2.1.145.dist-info → wagtail_enap_designsystem-1.2.1.147.dist-info}/licenses/LICENSE +0 -0
  32. {wagtail_enap_designsystem-1.2.1.145.dist-info → wagtail_enap_designsystem-1.2.1.147.dist-info}/top_level.txt +0 -0
@@ -1,118 +1,11 @@
1
1
  {% load wagtailcore_tags wagtailimages_tags %}
2
2
 
3
3
  <style>
4
- .enap-cards-section {
5
- padding: 60px 20px;
6
- background-color: #ffffff;
7
- }
8
-
9
- .enap-cards-container {
10
- max-width: 1142px;
11
- margin: 0 auto;
12
- }
13
-
14
- .enap-section-header {
15
- margin-bottom: 50px;
16
- }
17
-
18
- .enap-section-title {
19
- font-size: 32px;
20
- font-weight: 700;
21
- color: #024248;
22
- margin: 0 0 15px 0;
23
- line-height: 1.2;
24
- }
25
-
26
- .enap-section-subtitle {
27
- font-size: 18px;
28
- color: #024248;
29
- margin: 0;
30
- max-width: 600px;
31
- }
32
-
33
- .enap-cards-grid {
34
- display: grid;
35
- gap: 30px;
36
- grid-template-columns: 1fr;
37
- }
38
-
39
- /* Responsive Grid */
40
4
  @media (min-width: 768px) {
41
5
  .enap-cards-grid.grid-2 { grid-template-columns: repeat(2, 1fr); }
42
6
  .enap-cards-grid.grid-3 { grid-template-columns: repeat(3, 1fr); }
43
7
  .enap-cards-grid.grid-4 { grid-template-columns: repeat(4, 1fr); }
44
8
  }
45
-
46
- .enap-card {
47
- overflow: hidden;
48
- transition: all 0.3s ease;
49
- }
50
-
51
- .enap-card:hover {
52
- transform: translateY(-4px);
53
- }
54
-
55
- .enap-card-image {
56
- width: 100%;
57
- height: 350px;
58
- object-fit: cover;
59
- display: block;
60
- object-position: top;
61
- border-radius: 12px;
62
- }
63
-
64
- .enap-card-content {
65
- padding: 24px 0;
66
- }
67
-
68
- .enap-card-title {
69
- font-size: 20px;
70
- font-weight: 600;
71
- color: #2d3748;
72
- margin: 0 0 8px 0;
73
- line-height: 1.3;
74
- }
75
-
76
- .enap-card-subtitle {
77
- font-size: 14px;
78
- color:#000;
79
- font-weight: 500;
80
- margin: 0 0 12px 0;
81
- }
82
-
83
- .enap-card-description {
84
- color: #4a5568;
85
- margin: 0 0 16px 0;
86
- line-height: 1.5;
87
- font-size: 14px;
88
- }
89
-
90
- .enap-card-link {
91
- display: inline-flex;
92
- align-items: center;
93
- color: #007D7A;
94
- font-weight: 500;
95
- text-decoration: none;
96
- font-size: 14px;
97
- transition: color 0.2s ease;
98
- display: flex;
99
- gap: 6px;
100
- }
101
-
102
- .enap-card-link:hover {
103
- color: #047857;
104
- }
105
-
106
- .enap-card-link-arrow {
107
- width: 16px;
108
- height: 16px;
109
- margin-left: 6px;
110
- transition: transform 0.2s ease;
111
- }
112
-
113
- .enap-card-link:hover .enap-card-link-arrow {
114
- transform: translateX(3px);
115
- }
116
9
  </style>
117
10
 
118
11
  <section class="enap-cards-section">
@@ -148,8 +41,8 @@
148
41
 
149
42
  {% if card.link_url %}
150
43
  <a href="{{ card.link_url }}"
151
- target="{{ card.link_target|default:'_self' }}"
152
- class="enap-card-link">
44
+ target="{{ card.link_target|default:'_self' }}"
45
+ class="enap-card-link">
153
46
  {{ card.link_text|default:"Saiba mais" }}
154
47
  <i class="fa-solid fa-circle-chevron-right"></i>
155
48
  </a>
@@ -64,7 +64,15 @@
64
64
  width: 100%;
65
65
  margin: 0 auto;
66
66
  }
67
-
67
+ .button-color{
68
+ background-color: {{ value.cor_botao }};
69
+ }
70
+ .button-color:hover{
71
+ background-color: {{ value.cor_botao_hover }};
72
+ }
73
+ .button-color:active{
74
+ background-color: {{ value.cor_botao_active }};
75
+ }
68
76
  /* Layouts responsivos */
69
77
  .cards-1-coluna {
70
78
  grid-template-columns: 1fr;
@@ -163,7 +171,7 @@
163
171
  display: inline-flex;
164
172
  align-items: center;
165
173
  gap: 0.5rem;
166
- font-size: 0.95rem;
174
+ font-size: 18px;
167
175
  font-weight: 500;
168
176
  text-decoration: none;
169
177
  transition: all 0.3s ease;
@@ -336,7 +344,7 @@
336
344
  {% if value.link_url %}
337
345
  <div class="card-acao" style="text-align: center;">
338
346
  <a href="{{ value.link_url }}"
339
- class="card-link" style="color: {{ value.cor_botao_texto }}; background: {{ value.cor_botao }}; padding: 12px 42px; border-radius: 32px;"
347
+ class="card-link button-color" style="color: {{ value.cor_botao_texto }}; padding: 12px 36px; border-radius: 32px;"
340
348
  {% if value.link_target %}target="{{ value.link_target }}"{% endif %}>
341
349
  {{ value.link_text|default:'Saiba mais' }}
342
350
  </a>
@@ -109,200 +109,14 @@
109
109
  {% endif %}
110
110
  </div>
111
111
 
112
- <!-- CSS para acessibilidade -->
113
- <style>
114
- .visually-hidden {
115
- position: absolute;
116
- width: 1px;
117
- height: 1px;
118
- padding: 0;
119
- margin: -1px;
120
- overflow: hidden;
121
- clip: rect(0, 0, 0, 0);
122
- border: 0;
123
- }
124
-
125
- /* Layout do hero slideshow */
126
- .hero-slideshow {
127
- position: relative;
128
- width: 100%;
129
- overflow: hidden;
130
- }
131
-
132
- .hero-slideshow-container {
133
- position: relative;
134
- width: 100%;
135
- height: 60vh;
136
- min-height: 400px;
137
- }
138
-
139
- .hero-slide {
140
- position: absolute;
141
- top: 0;
142
- left: 0;
143
- width: 100%;
144
- height: 100%;
145
- opacity: 0;
146
- visibility: hidden;
147
- transition: opacity 0.5s ease-in-out, visibility 0.5s;
148
- }
149
-
150
- .hero-slide.slide-active {
151
- opacity: 1;
152
- visibility: visible;
153
- }
154
-
155
- .hero-slide-bg {
156
- position: absolute;
157
- top: 0;
158
- left: 0;
159
- width: 100%;
160
- height: 100%;
161
- background-size: cover;
162
- background-position: center;
163
- background-repeat: no-repeat;
164
- }
165
-
166
- .hero-slide-wrapper {
167
- position: relative;
168
- z-index: 2;
169
- display: flex;
170
- align-items: center;
171
- justify-content: center;
172
- width: 100%;
173
- height: 100%;
174
- padding: 2rem;
175
- }
176
-
177
- .hero-content-center {
178
- text-align: center;
179
- }
180
-
181
- .hero-content-left {
182
- justify-content: flex-start;
183
- align-items: flex-start;
184
- display: flex;
185
- flex-direction: column;
186
- max-width: 50%;
187
- }
188
-
189
- .hero-slide-heading {
190
- color: #fff;
191
- font-size: 2.5rem;
192
- font-weight: bold;
193
- margin: 0 0 1rem 0;
194
- text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
195
- }
196
-
197
- .hero-slide-text {
198
- color: #fff;
199
- font-size: 1.2rem;
200
- margin: 0;
201
- text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
202
- }
203
-
204
- .hero-grafismo {
205
- width: 60px;
206
- height: 60px;
207
- margin-bottom: 1rem;
208
- }
209
-
210
- /* Navegação */
211
- .hero-slideshow-nav {
212
- position: absolute;
213
- top: 50%;
214
- transform: translateY(-50%);
215
- width: 100%;
216
- display: flex;
217
- justify-content: space-between;
218
- padding: 0 1rem;
219
- pointer-events: none;
220
- z-index: 3;
221
- }
222
-
223
- .hero-nav-btn {
224
- background: rgba(0, 0, 0, 0.3);
225
- border: none;
226
- color: #fff;
227
- font-size: 2rem;
228
- width: 50px;
229
- height: 50px;
230
- border-radius: 50%;
231
- cursor: pointer;
232
- pointer-events: all;
233
- transition: all 0.3s ease;
234
- display: flex;
235
- align-items: center;
236
- justify-content: center;
237
- }
238
112
 
113
+ <style>
239
114
  /* Melhorias de foco para navegação */
240
115
  .hero-nav-btn:focus,
241
116
  .hero-indicator:focus {
242
117
  outline: 2px solid var(--enap-primary-color, #1976d2);
243
118
  outline-offset: 2px;
244
119
  }
245
-
246
- .hero-nav-btn:hover,
247
- .hero-indicator:hover {
248
- opacity: 0.8;
249
- transform: scale(1.1);
250
- transition: all 0.3s ease;
251
- }
252
-
253
- /* Indicadores */
254
- .hero-slideshow-indicators {
255
- position: absolute;
256
- bottom: 1rem;
257
- left: 50%;
258
- transform: translateX(-50%);
259
- display: flex;
260
- gap: 0.5rem;
261
- z-index: 3;
262
- }
263
-
264
- /* Indicadores com melhor visibilidade */
265
- .hero-indicator {
266
- width: 12px;
267
- height: 12px;
268
- border-radius: 50%;
269
- border: none;
270
- background: rgba(255, 255, 255, 0.5);
271
- cursor: pointer;
272
- transition: all 0.3s ease;
273
- }
274
-
275
- .hero-indicator.indicator-active,
276
- .hero-indicator[aria-selected="true"] {
277
- background: rgba(255, 255, 255, 1);
278
- transform: scale(1.2);
279
- }
280
-
281
- /* Responsividade */
282
- @media (max-width: 768px) {
283
- .hero-slideshow-container {
284
- height: 50vh;
285
- min-height: 300px;
286
- }
287
-
288
- .hero-slide-heading {
289
- font-size: 1.8rem;
290
- }
291
-
292
- .hero-slide-text {
293
- font-size: 1rem;
294
- }
295
-
296
- .hero-content-left {
297
- max-width: 80%;
298
- }
299
-
300
- .hero-nav-btn {
301
- width: 40px;
302
- height: 40px;
303
- font-size: 1.5rem;
304
- }
305
- }
306
120
  </style>
307
121
 
308
122
  <!-- JavaScript melhorado com acessibilidade -->