@cnc-ti/layout-basic 8.6.0 → 8.7.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/dist/index.css CHANGED
@@ -2263,4 +2263,427 @@ input[type=date]::-webkit-calendar-picker-indicator {
2263
2263
  .\[\&_svg\]\:cnc-shrink-0 svg {
2264
2264
  flex-shrink: 0;
2265
2265
  }
2266
+
2267
+ /* src/alertas/alertas.css */
2268
+ .alertas-container {
2269
+ display: flex;
2270
+ flex-direction: column;
2271
+ gap: 1.5rem;
2272
+ min-width: 0;
2273
+ }
2274
+ .alertas-nova-acao {
2275
+ display: flex;
2276
+ justify-content: flex-end;
2277
+ }
2278
+ .alertas-lista-section {
2279
+ display: flex;
2280
+ flex-direction: column;
2281
+ gap: 0.75rem;
2282
+ min-width: 0;
2283
+ }
2284
+ .alertas-lista-header {
2285
+ display: flex;
2286
+ align-items: center;
2287
+ justify-content: space-between;
2288
+ gap: 0.75rem;
2289
+ }
2290
+ .alertas-lista-titulo {
2291
+ font-size: 1rem;
2292
+ font-weight: 600;
2293
+ color: #0f172a;
2294
+ margin: 0;
2295
+ }
2296
+ .alertas-estado {
2297
+ border: 1px solid #e2e8f0;
2298
+ border-radius: 0.5rem;
2299
+ background: #fff;
2300
+ padding: 1.25rem;
2301
+ font-size: 0.875rem;
2302
+ color: #64748b;
2303
+ }
2304
+ .alertas-vazio {
2305
+ display: flex;
2306
+ flex-direction: column;
2307
+ align-items: center;
2308
+ justify-content: center;
2309
+ min-height: 11rem;
2310
+ border: 1px dashed #cbd5e1;
2311
+ border-radius: 0.5rem;
2312
+ background: #f8fafc;
2313
+ padding: 1rem;
2314
+ text-align: center;
2315
+ }
2316
+ .alertas-vazio-icone {
2317
+ color: #94a3b8;
2318
+ margin-bottom: 0.75rem;
2319
+ }
2320
+ .alertas-vazio-texto {
2321
+ font-size: 0.875rem;
2322
+ font-weight: 500;
2323
+ color: #334155;
2324
+ margin: 0;
2325
+ }
2326
+ .alertas-lista {
2327
+ display: grid;
2328
+ gap: 0.75rem;
2329
+ min-width: 0;
2330
+ }
2331
+ .alerta-form-section {
2332
+ border: 1px solid #e2e8f0;
2333
+ border-radius: 0.5rem;
2334
+ background: #f8fafc;
2335
+ padding: 1rem;
2336
+ }
2337
+ .alerta-form-header {
2338
+ display: flex;
2339
+ align-items: center;
2340
+ gap: 0.75rem;
2341
+ margin-bottom: 1rem;
2342
+ min-width: 0;
2343
+ }
2344
+ .alerta-form-titulo {
2345
+ font-size: 0.875rem;
2346
+ font-weight: 600;
2347
+ color: #0f172a;
2348
+ margin: 0;
2349
+ }
2350
+ .alerta-form-grid {
2351
+ display: grid;
2352
+ gap: 1rem;
2353
+ }
2354
+ .alerta-campo {
2355
+ display: grid;
2356
+ gap: 0.375rem;
2357
+ }
2358
+ .alerta-campo--data {
2359
+ max-width: 18rem;
2360
+ }
2361
+ .alerta-label {
2362
+ font-size: 0.875rem;
2363
+ font-weight: 600;
2364
+ color: #1e293b;
2365
+ }
2366
+ .alerta-obrigatorio {
2367
+ color: #dc2626;
2368
+ }
2369
+ .alerta-input {
2370
+ height: 2.5rem;
2371
+ width: 100%;
2372
+ border-radius: 0.375rem;
2373
+ border: 1px solid #cbd5e1;
2374
+ background: #fff;
2375
+ padding: 0 0.75rem;
2376
+ font-size: 0.875rem;
2377
+ outline: none;
2378
+ box-sizing: border-box;
2379
+ }
2380
+ .alerta-input:focus {
2381
+ border-color: #002f87;
2382
+ box-shadow: 0 0 0 2px rgba(0, 47, 135, 0.12);
2383
+ }
2384
+ .alerta-input--sm {
2385
+ height: 2.25rem;
2386
+ }
2387
+ .alerta-input--dias {
2388
+ width: 6rem;
2389
+ min-width: 0;
2390
+ }
2391
+ .alerta-textarea {
2392
+ width: 100%;
2393
+ resize: none;
2394
+ border-radius: 0.375rem;
2395
+ border: 1px solid #cbd5e1;
2396
+ background: #fff;
2397
+ padding: 0.5rem 0.75rem;
2398
+ font-size: 0.875rem;
2399
+ outline: none;
2400
+ box-sizing: border-box;
2401
+ font-family: inherit;
2402
+ }
2403
+ .alerta-textarea:focus {
2404
+ border-color: #002f87;
2405
+ box-shadow: 0 0 0 2px rgba(0, 47, 135, 0.12);
2406
+ }
2407
+ .alerta-notif-container {
2408
+ display: grid;
2409
+ grid-template-columns: 1fr 1fr;
2410
+ gap: 1rem;
2411
+ border: 1px solid #e2e8f0;
2412
+ border-radius: 0.375rem;
2413
+ background: #fff;
2414
+ padding: 0.75rem;
2415
+ }
2416
+ @media (max-width: 640px) {
2417
+ .alerta-notif-container {
2418
+ grid-template-columns: 1fr;
2419
+ }
2420
+ }
2421
+ .alerta-notif-col {
2422
+ display: grid;
2423
+ align-content: start;
2424
+ gap: 0.75rem;
2425
+ }
2426
+ .alerta-notif-personalizado {
2427
+ display: flex;
2428
+ flex-direction: column;
2429
+ gap: 0.5rem;
2430
+ }
2431
+ @media (min-width: 640px) {
2432
+ .alerta-notif-personalizado {
2433
+ flex-direction: row;
2434
+ align-items: center;
2435
+ }
2436
+ }
2437
+ .alerta-tags {
2438
+ display: flex;
2439
+ flex-wrap: wrap;
2440
+ gap: 0.5rem;
2441
+ grid-column: 1 / -1;
2442
+ }
2443
+ .alerta-tag {
2444
+ display: inline-flex;
2445
+ align-items: center;
2446
+ height: 2rem;
2447
+ gap: 0.25rem;
2448
+ border-radius: 9999px;
2449
+ border: 1px solid #e2e8f0;
2450
+ background: #f8fafc;
2451
+ padding: 0 0.75rem;
2452
+ font-size: 0.75rem;
2453
+ font-weight: 500;
2454
+ color: #334155;
2455
+ }
2456
+ .alerta-tag-remover {
2457
+ background: none;
2458
+ border: none;
2459
+ padding: 0;
2460
+ cursor: pointer;
2461
+ color: #64748b;
2462
+ display: flex;
2463
+ align-items: center;
2464
+ transition: color 0.15s;
2465
+ }
2466
+ .alerta-tag-remover:hover {
2467
+ color: #dc2626;
2468
+ }
2469
+ .alerta-opcao {
2470
+ display: inline-flex;
2471
+ width: -moz-fit-content;
2472
+ width: fit-content;
2473
+ align-items: center;
2474
+ gap: 0.5rem;
2475
+ font-size: 0.875rem;
2476
+ font-weight: 500;
2477
+ color: #334155;
2478
+ cursor: pointer;
2479
+ }
2480
+ .alerta-checkbox {
2481
+ width: 1rem;
2482
+ height: 1rem;
2483
+ border-radius: 0.25rem;
2484
+ border: 1px solid #cbd5e1;
2485
+ accent-color: #002f87;
2486
+ }
2487
+ .alerta-erro {
2488
+ border: 1px solid #fecaca;
2489
+ border-radius: 0.375rem;
2490
+ background: #fef2f2;
2491
+ padding: 0.5rem 0.75rem;
2492
+ font-size: 0.875rem;
2493
+ color: #b91c1c;
2494
+ }
2495
+ .alerta-form-acoes {
2496
+ display: flex;
2497
+ flex-direction: column-reverse;
2498
+ gap: 0.5rem;
2499
+ padding-top: 0.25rem;
2500
+ }
2501
+ @media (min-width: 640px) {
2502
+ .alerta-form-acoes {
2503
+ flex-direction: row;
2504
+ justify-content: flex-end;
2505
+ }
2506
+ }
2507
+ .alerta-btn {
2508
+ display: inline-flex;
2509
+ align-items: center;
2510
+ justify-content: center;
2511
+ gap: 0.5rem;
2512
+ height: 2.5rem;
2513
+ padding: 0 1rem;
2514
+ border-radius: 0.375rem;
2515
+ font-size: 0.875rem;
2516
+ font-weight: 600;
2517
+ cursor: pointer;
2518
+ transition: background 0.15s, opacity 0.15s;
2519
+ border: none;
2520
+ width: 100%;
2521
+ box-sizing: border-box;
2522
+ }
2523
+ @media (min-width: 640px) {
2524
+ .alerta-btn {
2525
+ width: auto;
2526
+ }
2527
+ }
2528
+ .alerta-btn--primario {
2529
+ background: #002f87;
2530
+ color: #fff;
2531
+ }
2532
+ .alerta-btn--primario:hover:not(:disabled) {
2533
+ background: #002766;
2534
+ }
2535
+ .alerta-btn--primario:disabled {
2536
+ cursor: not-allowed;
2537
+ opacity: 0.6;
2538
+ }
2539
+ .alerta-btn--secundario {
2540
+ background: #fff;
2541
+ color: #334155;
2542
+ border: 1px solid #cbd5e1;
2543
+ }
2544
+ .alerta-btn--secundario:hover {
2545
+ background: #f8fafc;
2546
+ }
2547
+ .alerta-btn--outline {
2548
+ background: #fff;
2549
+ color: #002f87;
2550
+ border: 1px solid #002f87;
2551
+ height: 2.25rem;
2552
+ white-space: nowrap;
2553
+ }
2554
+ .alerta-btn--outline:hover {
2555
+ background: rgba(0, 47, 135, 0.05);
2556
+ }
2557
+ .alerta-item {
2558
+ border: 1px solid #e2e8f0;
2559
+ border-radius: 0.5rem;
2560
+ background: #fff;
2561
+ padding: 1rem;
2562
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
2563
+ }
2564
+ .alerta-item--selecionado {
2565
+ border-color: #002f87;
2566
+ box-shadow: 0 0 0 2px rgba(0, 47, 135, 0.12);
2567
+ }
2568
+ .alerta-item-corpo {
2569
+ display: flex;
2570
+ flex-direction: column;
2571
+ gap: 0.75rem;
2572
+ min-width: 0;
2573
+ }
2574
+ @media (min-width: 640px) {
2575
+ .alerta-item-corpo {
2576
+ flex-direction: row;
2577
+ align-items: flex-start;
2578
+ justify-content: space-between;
2579
+ }
2580
+ }
2581
+ .alerta-item-info {
2582
+ min-width: 0;
2583
+ }
2584
+ .alerta-item-topo {
2585
+ display: flex;
2586
+ flex-wrap: wrap;
2587
+ align-items: center;
2588
+ gap: 0.5rem;
2589
+ }
2590
+ .alerta-item-titulo {
2591
+ font-size: 0.875rem;
2592
+ font-weight: 600;
2593
+ color: #0f172a;
2594
+ word-break: break-word;
2595
+ margin: 0;
2596
+ }
2597
+ .alerta-status {
2598
+ display: inline-block;
2599
+ border-radius: 9999px;
2600
+ border: 1px solid transparent;
2601
+ padding: 0.125rem 0.5rem;
2602
+ font-size: 0.75rem;
2603
+ font-weight: 600;
2604
+ }
2605
+ .alerta-status--pendente {
2606
+ border-color: #fde68a;
2607
+ background: #fffbeb;
2608
+ color: #92400e;
2609
+ }
2610
+ .alerta-status--concluido {
2611
+ border-color: #a7f3d0;
2612
+ background: #ecfdf5;
2613
+ color: #065f46;
2614
+ }
2615
+ .alerta-status--cancelado {
2616
+ border-color: #e2e8f0;
2617
+ background: #f1f5f9;
2618
+ color: #475569;
2619
+ }
2620
+ .alerta-item-mensagem {
2621
+ margin-top: 0.5rem;
2622
+ font-size: 0.875rem;
2623
+ color: #475569;
2624
+ word-break: break-word;
2625
+ }
2626
+ .alerta-item-meta {
2627
+ margin-top: 0.75rem;
2628
+ display: grid;
2629
+ gap: 0.25rem;
2630
+ font-size: 0.75rem;
2631
+ color: #64748b;
2632
+ }
2633
+ .alerta-item-meta-linha {
2634
+ display: inline-flex;
2635
+ align-items: center;
2636
+ gap: 0.375rem;
2637
+ }
2638
+ .alerta-item-email-ativo {
2639
+ color: #002f87;
2640
+ font-weight: 500;
2641
+ }
2642
+ .alerta-dot {
2643
+ display: inline-block;
2644
+ width: 0.375rem;
2645
+ height: 0.375rem;
2646
+ border-radius: 9999px;
2647
+ background: #002f87;
2648
+ }
2649
+ .alerta-item-acoes {
2650
+ display: flex;
2651
+ flex-shrink: 0;
2652
+ align-items: center;
2653
+ gap: 0.25rem;
2654
+ }
2655
+ .alerta-btn-icone {
2656
+ display: inline-flex;
2657
+ align-items: center;
2658
+ justify-content: center;
2659
+ width: 2.25rem;
2660
+ height: 2.25rem;
2661
+ border-radius: 0.375rem;
2662
+ border: 1px solid #e2e8f0;
2663
+ background: #fff;
2664
+ color: #475569;
2665
+ cursor: pointer;
2666
+ transition: background 0.15s, color 0.15s;
2667
+ }
2668
+ .alerta-btn-icone:hover:not(:disabled) {
2669
+ background: #f8fafc;
2670
+ }
2671
+ .alerta-btn-icone:disabled {
2672
+ cursor: not-allowed;
2673
+ opacity: 0.5;
2674
+ }
2675
+ .alerta-btn-icone--sucesso {
2676
+ border-color: #a7f3d0;
2677
+ color: #065f46;
2678
+ }
2679
+ .alerta-btn-icone--sucesso:hover:not(:disabled) {
2680
+ background: #ecfdf5;
2681
+ }
2682
+ .alerta-btn-icone--perigo {
2683
+ border-color: #fecaca;
2684
+ color: #dc2626;
2685
+ }
2686
+ .alerta-btn-icone--perigo:hover:not(:disabled) {
2687
+ background: #fef2f2;
2688
+ }
2266
2689
  /*# sourceMappingURL=index.css.map */