@sc-360-v2/storefront-cms-library 0.3.82 → 0.3.84

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.
@@ -353,6 +353,236 @@
353
353
  --_show-shadow: none;
354
354
  }
355
355
 
356
+ .quotes_address_section {
357
+ .address_card {
358
+ background: var(--_base-white);
359
+ border: 1px solid var(--_gray-300);
360
+ border-radius: 4px;
361
+ width: 100%;
362
+ max-width: 400px;
363
+ overflow: hidden;
364
+ height: fit-content;
365
+ top: 10px;
366
+ margin-bottom: 24px;
367
+
368
+ & > h3 {
369
+ font-size: 16px;
370
+ font-weight: 700;
371
+ color: var(--_gray-900);
372
+ background-color: #f5f5f5;
373
+ padding: 12px;
374
+ border-bottom: 1px solid var(--_gray-300);
375
+ }
376
+
377
+ &_body {
378
+ padding: 16px;
379
+ }
380
+
381
+ &_row {
382
+ display: flex;
383
+ justify-content: space-between;
384
+ align-items: center;
385
+ margin-bottom: 12px;
386
+ }
387
+
388
+ &_text {
389
+ font-size: 16px;
390
+ font-weight: 700;
391
+ color: var(--_gray-900);
392
+ }
393
+
394
+ &_select {
395
+ display: flex;
396
+ align-items: center;
397
+ gap: 8px;
398
+ font-size: 14px;
399
+ color: var(--_primary-400);
400
+ text-decoration: none;
401
+ font-weight: 600;
402
+ background: none;
403
+ border: none;
404
+ cursor: pointer;
405
+
406
+ &:hover {
407
+ text-decoration: underline;
408
+ }
409
+ }
410
+
411
+ &_divider {
412
+ border: none;
413
+ border-top: 1px dashed var(--_gray-300);
414
+ margin: 16px 0;
415
+ }
416
+
417
+ &_footer {
418
+ display: flex;
419
+ justify-content: space-between;
420
+ align-items: flex-start;
421
+ gap: 16px;
422
+ }
423
+
424
+ &_shipping,
425
+ &_quoted {
426
+ display: flex;
427
+ flex-direction: column;
428
+ justify-content: center;
429
+ }
430
+
431
+ &_label {
432
+ font-size: 14px;
433
+ color: var(--_gray-700);
434
+ font-weight: 500;
435
+ margin-bottom: 6px;
436
+ }
437
+
438
+ &_value {
439
+ font-size: 20px;
440
+ font-weight: 700;
441
+ color: var(--_gray-900);
442
+ height: 40px;
443
+ display: flex;
444
+ align-items: center;
445
+ }
446
+
447
+ &_input_box {
448
+ display: flex;
449
+ align-items: center;
450
+ border: 1px solid var(--_gray-300);
451
+ border-radius: 6px;
452
+ padding: 8px 12px;
453
+ width: 128px;
454
+ height: 40px;
455
+ }
456
+
457
+ &_currency {
458
+ margin-right: 6px;
459
+ font-weight: 600;
460
+ color: var(--_gray-700);
461
+ }
462
+
463
+ &_input {
464
+ border: none;
465
+ outline: none;
466
+ font-size: 16px;
467
+ font-weight: 400;
468
+ color: var(--_gray-900);
469
+ width: 100%;
470
+ background: transparent;
471
+ }
472
+
473
+ // --- Extra styles for address list ---
474
+ &_list_item {
475
+ display: flex;
476
+ flex-direction: column;
477
+ // align-items: flex-start;
478
+ gap: 6px;
479
+ padding-bottom: 16px;
480
+ &:first-child {
481
+ padding-top: 0px;
482
+ }
483
+ &:not(:last-child) {
484
+ border-bottom: 1px dashed var(--_gray-300);
485
+ margin-bottom: 16px;
486
+ }
487
+
488
+ .address_card_row {
489
+ width: 100%;
490
+ margin-bottom: 0px;
491
+ }
492
+ }
493
+
494
+ &_address {
495
+ font-size: 14px;
496
+ color: var(--_gray-500);
497
+ font-weight: 400;
498
+ line-height: 20px;
499
+ }
500
+
501
+ &_contact_container {
502
+ display: flex;
503
+ align-items: center;
504
+ gap: 10px;
505
+ cursor: pointer;
506
+ }
507
+ &_contact {
508
+ font-size: 14px;
509
+ font-weight: 600;
510
+ color: var(--_gray-900);
511
+ }
512
+ &_shipping_details {
513
+ // padding: 16px;
514
+ margin-top: 10px;
515
+ }
516
+
517
+ &_shipping_heading {
518
+ font-size: 14px;
519
+ font-weight: 600;
520
+ color: var(--_gray-900);
521
+ background: var(--_gray-100);
522
+ padding: 4px 6px;
523
+ border-radius: 4px;
524
+ margin-bottom: 12px;
525
+ }
526
+
527
+ &_shipping_group {
528
+ margin-bottom: 12px;
529
+ }
530
+
531
+ &_shipping_subheading {
532
+ font-size: 14px;
533
+ font-weight: 700;
534
+ color: var(--_gray-900);
535
+ margin-bottom: 2px;
536
+ }
537
+
538
+ &_shipping_option {
539
+ display: flex;
540
+ align-items: center;
541
+ // justify-content: space-between;
542
+ padding: 10px 8px;
543
+ border-radius: 6px;
544
+ cursor: pointer;
545
+ font-size: 14px;
546
+ color: var(--_gray-700);
547
+ // margin-bottom: 8px;
548
+ transition: background 0.2s ease;
549
+
550
+ input[type="radio"] {
551
+ accent-color: var(--_primary-400);
552
+ margin-right: 12px;
553
+ width: fit-content;
554
+ }
555
+
556
+ &:hover {
557
+ background: var(--_gray-100);
558
+ }
559
+ }
560
+
561
+ &_shipping_label {
562
+ // flex: 1;
563
+ // margin-left: 6px;
564
+ font-weight: 400;
565
+ font-size: 14px;
566
+ color: var(--_gray-500);
567
+ }
568
+
569
+ &_shipping_price {
570
+ font-weight: 600;
571
+ color: var(--_gray-900);
572
+ font-size: 14px;
573
+ }
574
+
575
+ &_shipping_confirm {
576
+ padding: 12px;
577
+ }
578
+ &_shipping_method {
579
+ display: flex;
580
+ flex-direction: column;
581
+ gap: 8px;
582
+ }
583
+ }
584
+ }
585
+
356
586
  // .accordion-element {
357
587
  // background-color: var(
358
588
  // --_ctm-mob-dn-fq-wt-bd-cr,
@@ -39,3 +39,35 @@
39
39
  gap: 4px;
40
40
  padding: 4px;
41
41
  }
42
+
43
+ // dropdown skeletons
44
+ .opt1_skeleton {
45
+ display: flex;
46
+ flex-direction: column;
47
+ padding: 4px 12px;
48
+ }
49
+
50
+ .opt2_skeleton {
51
+ display: flex;
52
+ flex-direction: column;
53
+ gap: 16px;
54
+ padding: 8px;
55
+ .emp_types {
56
+ display: flex;
57
+ flex-direction: column;
58
+ gap: 6px;
59
+ .emp_type {
60
+ display: flex;
61
+ gap: 8px;
62
+ }
63
+ .emp_dtls {
64
+ display: flex;
65
+ flex-direction: column;
66
+ gap: 6px;
67
+ .emp_code {
68
+ display: flex;
69
+ gap: 8px;
70
+ }
71
+ }
72
+ }
73
+ }