@keenmate/pure-admin-theme-express 1.0.0-rc04 → 1.0.0-rc06

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/express.css CHANGED
@@ -279,6 +279,28 @@ body.pa-container-2xl .pa-navbar {
279
279
  gap: 1.6rem;
280
280
  }
281
281
 
282
+ .pa-header__left {
283
+ display: flex;
284
+ align-items: center;
285
+ gap: 1.6rem;
286
+ flex-shrink: 0;
287
+ }
288
+
289
+ .pa-header__center {
290
+ flex: 1;
291
+ min-width: 0;
292
+ display: flex;
293
+ align-items: center;
294
+ justify-content: center;
295
+ }
296
+
297
+ .pa-header__right {
298
+ display: flex;
299
+ align-items: center;
300
+ gap: 1.6rem;
301
+ flex-shrink: 0;
302
+ }
303
+
282
304
  /* ========================================
283
305
  Layout Container
284
306
  Main layout wrapper, content areas, sticky/scroll modes
@@ -364,15 +386,44 @@ body.pa-layout--sticky .pa-layout__inner {
364
386
  }
365
387
 
366
388
  .pa-layout__footer {
367
- height: 4.8rem;
389
+ min-height: 4.8rem;
368
390
  background-color: var(--pa-footer-bg);
369
391
  border-top: 1px solid var(--pa-footer-border-color);
370
392
  display: flex;
371
393
  align-items: center;
372
- padding: 0 1.6rem;
394
+ padding: 0.4rem 1.6rem;
395
+ flex-shrink: 0;
396
+ gap: 1.6rem;
397
+ }
398
+
399
+ .pa-footer__left {
400
+ display: flex;
401
+ align-items: center;
402
+ gap: 1.6rem;
373
403
  flex-shrink: 0;
374
404
  }
375
405
 
406
+ .pa-footer__center {
407
+ flex: 1;
408
+ min-width: 0;
409
+ display: flex;
410
+ align-items: center;
411
+ justify-content: center;
412
+ }
413
+
414
+ .pa-footer__right {
415
+ display: flex;
416
+ align-items: center;
417
+ gap: 1.6rem;
418
+ flex-shrink: 0;
419
+ }
420
+
421
+ .pa-footer__right--vertical {
422
+ flex-direction: column;
423
+ align-items: flex-end;
424
+ gap: 0.4rem;
425
+ }
426
+
376
427
  /* ========================================
377
428
  Sidebar Component
378
429
  Sidebar navigation with nested submenus
@@ -815,14 +866,6 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
815
866
  background-color: var(--pa-accent-hover);
816
867
  }
817
868
 
818
- .pa-header__nav--left {
819
- margin-right: auto;
820
- }
821
-
822
- .pa-header__nav--right {
823
- margin-left: auto;
824
- }
825
-
826
869
  .pa-header__nav-item--has-dropdown {
827
870
  position: static;
828
871
  }
@@ -2538,7 +2581,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
2538
2581
  }
2539
2582
 
2540
2583
  .pa-card__header {
2541
- padding: 0.8rem 1rem;
2584
+ padding: 0.5rem 1rem;
2542
2585
  min-height: 4rem;
2543
2586
  border-top-left-radius: 8px;
2544
2587
  border-top-right-radius: 8px;
@@ -2578,6 +2621,11 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
2578
2621
  font-size: 1.6rem;
2579
2622
  }
2580
2623
 
2624
+ .pa-card__header .pa-btn {
2625
+ margin-top: -0.25rem;
2626
+ margin-bottom: -0.25rem;
2627
+ }
2628
+
2581
2629
  .pa-card__title {
2582
2630
  display: flex;
2583
2631
  align-items: center;
@@ -2753,6 +2801,35 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
2753
2801
  display: block;
2754
2802
  }
2755
2803
 
2804
+ .pa-card__tabs--inline {
2805
+ display: flex;
2806
+ gap: 0.4rem;
2807
+ margin: -0.5rem 0;
2808
+ border-bottom: none;
2809
+ background: none;
2810
+ }
2811
+
2812
+ .pa-card__tabs--inline .pa-card__tab {
2813
+ padding: 0.3rem 0.8rem;
2814
+ border: none;
2815
+ border-radius: 4px;
2816
+ font-size: 1.4rem;
2817
+ background: transparent;
2818
+ color: var(--pa-text-secondary);
2819
+ cursor: pointer;
2820
+ transition: all 0.1s ease-out;
2821
+ }
2822
+
2823
+ .pa-card__tabs--inline .pa-card__tab:hover {
2824
+ background-color: rgba(212, 5, 17, 0.05);
2825
+ color: var(--pa-text-primary);
2826
+ }
2827
+
2828
+ .pa-card__tabs--inline .pa-card__tab--active {
2829
+ background: var(--pa-accent);
2830
+ color: var(--pa-btn-primary-text);
2831
+ }
2832
+
2756
2833
  a.pa-card {
2757
2834
  text-decoration: none;
2758
2835
  display: block;
@@ -3071,6 +3148,7 @@ a.pa-card p {
3071
3148
  border-radius: 8px;
3072
3149
  padding: 1.6rem 1rem;
3073
3150
  background-color: var(--pa-card-bg);
3151
+ margin-bottom: 1.6rem;
3074
3152
  }
3075
3153
 
3076
3154
  .pa-tabs__container--bordered .pa-tabs {
@@ -3084,6 +3162,123 @@ a.pa-card p {
3084
3162
  padding-top: 1.2rem;
3085
3163
  }
3086
3164
 
3165
+ .pa-tabs__container--card {
3166
+ position: relative;
3167
+ border: 1px solid var(--pa-border-color);
3168
+ border-radius: 8px;
3169
+ background-color: var(--pa-card-bg);
3170
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
3171
+ margin-bottom: 1.6rem;
3172
+ }
3173
+
3174
+ .pa-tabs__container--card .pa-tabs {
3175
+ height: 4rem;
3176
+ padding: 0.5rem 1rem;
3177
+ background: var(--pa-card-header-bg);
3178
+ border-bottom: 1px solid var(--pa-border-color);
3179
+ box-sizing: border-box;
3180
+ border-top-left-radius: 8px;
3181
+ border-top-right-radius: 8px;
3182
+ margin-bottom: 0;
3183
+ align-items: center;
3184
+ gap: 0.4rem;
3185
+ flex-wrap: nowrap;
3186
+ overflow: visible;
3187
+ }
3188
+
3189
+ .pa-tabs__container--card .pa-tabs__content {
3190
+ padding: 1.6rem 1rem;
3191
+ }
3192
+
3193
+ .pa-tabs__container--card .pa-tabs__panel {
3194
+ padding-top: 0;
3195
+ }
3196
+
3197
+ .pa-tabs__container--card .pa-tabs__overflow {
3198
+ position: relative;
3199
+ margin-left: auto;
3200
+ flex-shrink: 0;
3201
+ }
3202
+
3203
+ .pa-tabs__container--card .pa-tabs__overflow-toggle {
3204
+ position: relative;
3205
+ display: flex;
3206
+ align-items: center;
3207
+ justify-content: center;
3208
+ width: 4rem;
3209
+ height: 100%;
3210
+ padding: 0;
3211
+ border: none;
3212
+ background: transparent;
3213
+ color: var(--pa-text-secondary);
3214
+ cursor: pointer;
3215
+ transition: all 0.1s ease-out;
3216
+ border-left: 1px solid var(--pa-border-color);
3217
+ margin: -0.5rem -1rem -0.5rem 0;
3218
+ box-sizing: content-box;
3219
+ height: 4rem;
3220
+ }
3221
+
3222
+ .pa-tabs__container--card .pa-tabs__overflow-toggle:hover {
3223
+ background-color: rgba(212, 5, 17, 0.05);
3224
+ color: var(--pa-text-primary);
3225
+ }
3226
+
3227
+ .pa-tabs__container--card .pa-tabs__overflow-toggle--has-active {
3228
+ color: var(--pa-accent);
3229
+ }
3230
+
3231
+ .pa-tabs__container--card .pa-tabs__overflow-toggle--has-active::after {
3232
+ content: "";
3233
+ position: absolute;
3234
+ bottom: 0;
3235
+ left: 0;
3236
+ right: 0;
3237
+ height: 2px;
3238
+ background: var(--pa-accent);
3239
+ }
3240
+
3241
+ .pa-tabs__container--card .pa-tabs__overflow-toggle i {
3242
+ font-size: 1.4rem;
3243
+ }
3244
+
3245
+ .pa-tabs__container--card .pa-tabs__overflow-menu {
3246
+ position: absolute;
3247
+ top: 4rem;
3248
+ right: 0;
3249
+ min-width: 15rem;
3250
+ background: var(--pa-card-bg);
3251
+ border: 1px solid var(--pa-border-color);
3252
+ border-radius: 4px;
3253
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
3254
+ z-index: 1000;
3255
+ display: none;
3256
+ flex-direction: column;
3257
+ padding: 0.4rem 0;
3258
+ }
3259
+
3260
+ .pa-tabs__container--card .pa-tabs__overflow-menu--open {
3261
+ display: flex;
3262
+ }
3263
+
3264
+ .pa-tabs__container--card .pa-tabs__overflow-menu .pa-tabs__item {
3265
+ padding: 0.8rem 1.6rem;
3266
+ border: none;
3267
+ border-bottom: none;
3268
+ border-radius: 0;
3269
+ text-align: left;
3270
+ white-space: nowrap;
3271
+ }
3272
+
3273
+ .pa-tabs__container--card .pa-tabs__overflow-menu .pa-tabs__item:hover {
3274
+ background-color: rgba(212, 5, 17, 0.05);
3275
+ }
3276
+
3277
+ .pa-tabs__container--card .pa-tabs__overflow-menu .pa-tabs__item--active {
3278
+ background-color: rgba(212, 5, 17, 0.1);
3279
+ border-bottom: none;
3280
+ }
3281
+
3087
3282
  .pa-tabs__vertical-layout {
3088
3283
  display: flex;
3089
3284
  gap: 1.6rem;
@@ -3099,6 +3294,7 @@ a.pa-card p {
3099
3294
  border-radius: 8px;
3100
3295
  padding: 1.6rem 1rem;
3101
3296
  background-color: var(--pa-card-bg);
3297
+ margin-bottom: 1.6rem;
3102
3298
  }
3103
3299
 
3104
3300
  .pa-tabs__vertical-layout--bordered .pa-tabs--vertical {
@@ -3475,8 +3671,8 @@ a.pa-card p {
3475
3671
  }
3476
3672
 
3477
3673
  .pa-list__avatar {
3478
- width: 4rem;
3479
- height: 4rem;
3674
+ width: 3.5rem;
3675
+ height: 3.5rem;
3480
3676
  border-radius: 50%;
3481
3677
  background-color: var(--pa-primary-bg);
3482
3678
  display: flex;
@@ -4272,6 +4468,7 @@ a.pa-card p {
4272
4468
  ======================================== */
4273
4469
  .pa-btn {
4274
4470
  display: inline-block;
4471
+ height: 3.5rem;
4275
4472
  padding: 0.8rem 1.2rem;
4276
4473
  border: 1px solid transparent;
4277
4474
  border-radius: 4px;
@@ -4312,21 +4509,25 @@ a.pa-card p {
4312
4509
  }
4313
4510
 
4314
4511
  .pa-btn--xs {
4512
+ height: 3.1rem;
4315
4513
  padding: 0.6rem 0.8rem;
4316
4514
  font-size: 1.2rem;
4317
4515
  }
4318
4516
 
4319
4517
  .pa-btn--sm {
4518
+ height: 3.3rem;
4320
4519
  padding: 0.8rem 1rem;
4321
4520
  font-size: 1.4rem;
4322
4521
  }
4323
4522
 
4324
4523
  .pa-btn--lg {
4524
+ height: 3.8rem;
4325
4525
  padding: 0.8rem 1.4rem;
4326
4526
  font-size: 1.6rem;
4327
4527
  }
4328
4528
 
4329
4529
  .pa-btn--xl {
4530
+ height: 4.1rem;
4330
4531
  padding: 0.8rem 1.6rem;
4331
4532
  font-size: 1.8rem;
4332
4533
  }
@@ -4519,32 +4720,33 @@ a.pa-card p {
4519
4720
  }
4520
4721
 
4521
4722
  .pa-btn--icon-only {
4522
- width: 4rem;
4523
- height: 4rem;
4723
+ width: 3.5rem;
4724
+ height: 3.5rem;
4524
4725
  padding: 0;
4525
4726
  display: flex;
4526
4727
  align-items: center;
4527
4728
  justify-content: center;
4729
+ line-height: 1;
4528
4730
  }
4529
4731
 
4530
4732
  .pa-btn--icon-only.pa-btn--xs {
4531
- width: 2.8rem;
4532
- height: 2.8rem;
4733
+ width: 3.1rem;
4734
+ height: 3.1rem;
4533
4735
  }
4534
4736
 
4535
4737
  .pa-btn--icon-only.pa-btn--sm {
4536
- width: 3.2rem;
4537
- height: 3.2rem;
4738
+ width: 3.3rem;
4739
+ height: 3.3rem;
4538
4740
  }
4539
4741
 
4540
4742
  .pa-btn--icon-only.pa-btn--lg {
4541
- width: 4.8rem;
4542
- height: 4.8rem;
4743
+ width: 3.8rem;
4744
+ height: 3.8rem;
4543
4745
  }
4544
4746
 
4545
4747
  .pa-btn--icon-only.pa-btn--xl {
4546
- width: 5.6rem;
4547
- height: 5.6rem;
4748
+ width: 4.1rem;
4749
+ height: 4.1rem;
4548
4750
  }
4549
4751
 
4550
4752
  .pa-btn__icon {
@@ -5186,6 +5388,213 @@ a.pa-card p {
5186
5388
  border-left-color: var(--pa-btn-danger-bg);
5187
5389
  }
5188
5390
 
5391
+ .pa-tooltip--color-1::before {
5392
+ background-color: var(--pa-color-1);
5393
+ }
5394
+
5395
+ .pa-tooltip--color-1::after {
5396
+ border-top-color: var(--pa-color-1);
5397
+ }
5398
+
5399
+ .pa-tooltip--color-1.pa-tooltip--right::after {
5400
+ border-top-color: transparent;
5401
+ border-right-color: var(--pa-color-1);
5402
+ }
5403
+
5404
+ .pa-tooltip--color-1.pa-tooltip--bottom::after {
5405
+ border-top-color: transparent;
5406
+ border-bottom-color: var(--pa-color-1);
5407
+ }
5408
+
5409
+ .pa-tooltip--color-1.pa-tooltip--left::after {
5410
+ border-top-color: transparent;
5411
+ border-left-color: var(--pa-color-1);
5412
+ }
5413
+
5414
+ .pa-tooltip--color-2::before {
5415
+ background-color: var(--pa-color-2);
5416
+ }
5417
+
5418
+ .pa-tooltip--color-2::after {
5419
+ border-top-color: var(--pa-color-2);
5420
+ }
5421
+
5422
+ .pa-tooltip--color-2.pa-tooltip--right::after {
5423
+ border-top-color: transparent;
5424
+ border-right-color: var(--pa-color-2);
5425
+ }
5426
+
5427
+ .pa-tooltip--color-2.pa-tooltip--bottom::after {
5428
+ border-top-color: transparent;
5429
+ border-bottom-color: var(--pa-color-2);
5430
+ }
5431
+
5432
+ .pa-tooltip--color-2.pa-tooltip--left::after {
5433
+ border-top-color: transparent;
5434
+ border-left-color: var(--pa-color-2);
5435
+ }
5436
+
5437
+ .pa-tooltip--color-3::before {
5438
+ background-color: var(--pa-color-3);
5439
+ }
5440
+
5441
+ .pa-tooltip--color-3::after {
5442
+ border-top-color: var(--pa-color-3);
5443
+ }
5444
+
5445
+ .pa-tooltip--color-3.pa-tooltip--right::after {
5446
+ border-top-color: transparent;
5447
+ border-right-color: var(--pa-color-3);
5448
+ }
5449
+
5450
+ .pa-tooltip--color-3.pa-tooltip--bottom::after {
5451
+ border-top-color: transparent;
5452
+ border-bottom-color: var(--pa-color-3);
5453
+ }
5454
+
5455
+ .pa-tooltip--color-3.pa-tooltip--left::after {
5456
+ border-top-color: transparent;
5457
+ border-left-color: var(--pa-color-3);
5458
+ }
5459
+
5460
+ .pa-tooltip--color-4::before {
5461
+ background-color: var(--pa-color-4);
5462
+ }
5463
+
5464
+ .pa-tooltip--color-4::after {
5465
+ border-top-color: var(--pa-color-4);
5466
+ }
5467
+
5468
+ .pa-tooltip--color-4.pa-tooltip--right::after {
5469
+ border-top-color: transparent;
5470
+ border-right-color: var(--pa-color-4);
5471
+ }
5472
+
5473
+ .pa-tooltip--color-4.pa-tooltip--bottom::after {
5474
+ border-top-color: transparent;
5475
+ border-bottom-color: var(--pa-color-4);
5476
+ }
5477
+
5478
+ .pa-tooltip--color-4.pa-tooltip--left::after {
5479
+ border-top-color: transparent;
5480
+ border-left-color: var(--pa-color-4);
5481
+ }
5482
+
5483
+ .pa-tooltip--color-5::before {
5484
+ background-color: var(--pa-color-5);
5485
+ }
5486
+
5487
+ .pa-tooltip--color-5::after {
5488
+ border-top-color: var(--pa-color-5);
5489
+ }
5490
+
5491
+ .pa-tooltip--color-5.pa-tooltip--right::after {
5492
+ border-top-color: transparent;
5493
+ border-right-color: var(--pa-color-5);
5494
+ }
5495
+
5496
+ .pa-tooltip--color-5.pa-tooltip--bottom::after {
5497
+ border-top-color: transparent;
5498
+ border-bottom-color: var(--pa-color-5);
5499
+ }
5500
+
5501
+ .pa-tooltip--color-5.pa-tooltip--left::after {
5502
+ border-top-color: transparent;
5503
+ border-left-color: var(--pa-color-5);
5504
+ }
5505
+
5506
+ .pa-tooltip--color-6::before {
5507
+ background-color: var(--pa-color-6);
5508
+ }
5509
+
5510
+ .pa-tooltip--color-6::after {
5511
+ border-top-color: var(--pa-color-6);
5512
+ }
5513
+
5514
+ .pa-tooltip--color-6.pa-tooltip--right::after {
5515
+ border-top-color: transparent;
5516
+ border-right-color: var(--pa-color-6);
5517
+ }
5518
+
5519
+ .pa-tooltip--color-6.pa-tooltip--bottom::after {
5520
+ border-top-color: transparent;
5521
+ border-bottom-color: var(--pa-color-6);
5522
+ }
5523
+
5524
+ .pa-tooltip--color-6.pa-tooltip--left::after {
5525
+ border-top-color: transparent;
5526
+ border-left-color: var(--pa-color-6);
5527
+ }
5528
+
5529
+ .pa-tooltip--color-7::before {
5530
+ background-color: var(--pa-color-7);
5531
+ }
5532
+
5533
+ .pa-tooltip--color-7::after {
5534
+ border-top-color: var(--pa-color-7);
5535
+ }
5536
+
5537
+ .pa-tooltip--color-7.pa-tooltip--right::after {
5538
+ border-top-color: transparent;
5539
+ border-right-color: var(--pa-color-7);
5540
+ }
5541
+
5542
+ .pa-tooltip--color-7.pa-tooltip--bottom::after {
5543
+ border-top-color: transparent;
5544
+ border-bottom-color: var(--pa-color-7);
5545
+ }
5546
+
5547
+ .pa-tooltip--color-7.pa-tooltip--left::after {
5548
+ border-top-color: transparent;
5549
+ border-left-color: var(--pa-color-7);
5550
+ }
5551
+
5552
+ .pa-tooltip--color-8::before {
5553
+ background-color: var(--pa-color-8);
5554
+ }
5555
+
5556
+ .pa-tooltip--color-8::after {
5557
+ border-top-color: var(--pa-color-8);
5558
+ }
5559
+
5560
+ .pa-tooltip--color-8.pa-tooltip--right::after {
5561
+ border-top-color: transparent;
5562
+ border-right-color: var(--pa-color-8);
5563
+ }
5564
+
5565
+ .pa-tooltip--color-8.pa-tooltip--bottom::after {
5566
+ border-top-color: transparent;
5567
+ border-bottom-color: var(--pa-color-8);
5568
+ }
5569
+
5570
+ .pa-tooltip--color-8.pa-tooltip--left::after {
5571
+ border-top-color: transparent;
5572
+ border-left-color: var(--pa-color-8);
5573
+ }
5574
+
5575
+ .pa-tooltip--color-9::before {
5576
+ background-color: var(--pa-color-9);
5577
+ }
5578
+
5579
+ .pa-tooltip--color-9::after {
5580
+ border-top-color: var(--pa-color-9);
5581
+ }
5582
+
5583
+ .pa-tooltip--color-9.pa-tooltip--right::after {
5584
+ border-top-color: transparent;
5585
+ border-right-color: var(--pa-color-9);
5586
+ }
5587
+
5588
+ .pa-tooltip--color-9.pa-tooltip--bottom::after {
5589
+ border-top-color: transparent;
5590
+ border-bottom-color: var(--pa-color-9);
5591
+ }
5592
+
5593
+ .pa-tooltip--color-9.pa-tooltip--left::after {
5594
+ border-top-color: transparent;
5595
+ border-left-color: var(--pa-color-9);
5596
+ }
5597
+
5189
5598
  .pa-tooltip--auto-flip-bottom::before {
5190
5599
  bottom: auto !important;
5191
5600
  top: calc(100% + 8px) !important;
@@ -5323,6 +5732,7 @@ a.pa-card p {
5323
5732
  font-size: 1.4rem;
5324
5733
  line-height: 1.5;
5325
5734
  color: var(--pa-text-primary);
5735
+ text-align: left;
5326
5736
  }
5327
5737
 
5328
5738
  .pa-popover__body p {
@@ -5387,6 +5797,14 @@ a.pa-card p {
5387
5797
  max-width: 44.8rem;
5388
5798
  }
5389
5799
 
5800
+ .pa-popover--center .pa-popover__body {
5801
+ text-align: center;
5802
+ }
5803
+
5804
+ .pa-popover--right .pa-popover__body {
5805
+ text-align: right;
5806
+ }
5807
+
5390
5808
  .pa-tooltip-floating {
5391
5809
  background-color: var(--pa-tooltip-bg);
5392
5810
  color: var(--pa-tooltip-text);
@@ -5427,6 +5845,42 @@ a.pa-card p {
5427
5845
  color: var(--pa-btn-danger-text);
5428
5846
  }
5429
5847
 
5848
+ .pa-tooltip-floating.pa-tooltip--color-1 {
5849
+ background-color: var(--pa-color-1);
5850
+ }
5851
+
5852
+ .pa-tooltip-floating.pa-tooltip--color-2 {
5853
+ background-color: var(--pa-color-2);
5854
+ }
5855
+
5856
+ .pa-tooltip-floating.pa-tooltip--color-3 {
5857
+ background-color: var(--pa-color-3);
5858
+ }
5859
+
5860
+ .pa-tooltip-floating.pa-tooltip--color-4 {
5861
+ background-color: var(--pa-color-4);
5862
+ }
5863
+
5864
+ .pa-tooltip-floating.pa-tooltip--color-5 {
5865
+ background-color: var(--pa-color-5);
5866
+ }
5867
+
5868
+ .pa-tooltip-floating.pa-tooltip--color-6 {
5869
+ background-color: var(--pa-color-6);
5870
+ }
5871
+
5872
+ .pa-tooltip-floating.pa-tooltip--color-7 {
5873
+ background-color: var(--pa-color-7);
5874
+ }
5875
+
5876
+ .pa-tooltip-floating.pa-tooltip--color-8 {
5877
+ background-color: var(--pa-color-8);
5878
+ }
5879
+
5880
+ .pa-tooltip-floating.pa-tooltip--color-9 {
5881
+ background-color: var(--pa-color-9);
5882
+ }
5883
+
5430
5884
  /* ========================================
5431
5885
  Alert Components
5432
5886
  Alerts with variants, sizes, dismissible functionality
@@ -5823,6 +6277,7 @@ a.pa-card p {
5823
6277
  ======================================== */
5824
6278
  .pa-input {
5825
6279
  width: 100%;
6280
+ height: 3.5rem;
5826
6281
  padding: 0.8rem 0.8rem;
5827
6282
  border: 1px solid var(--pa-border-color);
5828
6283
  border-radius: 4px;
@@ -5840,6 +6295,7 @@ a.pa-card p {
5840
6295
 
5841
6296
  .pa-select {
5842
6297
  width: 100%;
6298
+ height: 3.5rem;
5843
6299
  padding: 0.7rem 0.5rem;
5844
6300
  border: 1px solid var(--pa-border-color);
5845
6301
  border-radius: 4px;
@@ -5880,24 +6336,28 @@ a.pa-card p {
5880
6336
 
5881
6337
  .pa-input--xs,
5882
6338
  .pa-select--xs {
6339
+ height: 3.1rem;
5883
6340
  padding: 0.6rem 0.8rem;
5884
6341
  font-size: 1.2rem;
5885
6342
  }
5886
6343
 
5887
6344
  .pa-input--sm,
5888
6345
  .pa-select--sm {
6346
+ height: 3.3rem;
5889
6347
  padding: 0.8rem 0.8rem;
5890
6348
  font-size: 1.4rem;
5891
6349
  }
5892
6350
 
5893
6351
  .pa-input--lg,
5894
6352
  .pa-select--lg {
6353
+ height: 3.8rem;
5895
6354
  padding: 0.8rem 0.8rem;
5896
6355
  font-size: 1.6rem;
5897
6356
  }
5898
6357
 
5899
6358
  .pa-input--xl,
5900
6359
  .pa-select--xl {
6360
+ height: 4.1rem;
5901
6361
  padding: 0.8rem 0.8rem;
5902
6362
  font-size: 1.8rem;
5903
6363
  }
@@ -7936,7 +8396,7 @@ web-daterangepicker {
7936
8396
 
7937
8397
  .pa-table th,
7938
8398
  .pa-table td {
7939
- padding: 0.5rem 0.8rem;
8399
+ padding: 0.8rem 0.8rem;
7940
8400
  text-align: left;
7941
8401
  border-bottom: 1px solid var(--pa-border-color);
7942
8402
  vertical-align: middle;
@@ -7953,6 +8413,7 @@ web-daterangepicker {
7953
8413
  .pa-table td {
7954
8414
  color: var(--pa-text-primary);
7955
8415
  background-color: var(--pa-table-bg);
8416
+ height: 3.5rem0.8rem;
7956
8417
  }
7957
8418
 
7958
8419
  .pa-table td .pa-btn {
@@ -7968,14 +8429,36 @@ web-daterangepicker {
7968
8429
  background-color: var(--pa-table-stripe);
7969
8430
  }
7970
8431
 
7971
- .pa-table--2x th,
7972
- .pa-table--2x td {
7973
- padding: 1rem 1.6rem;
8432
+ .pa-table--xs th, .pa-table--xs td {
8433
+ padding: 0.6rem 0.8rem;
8434
+ }
8435
+
8436
+ .pa-table--xs td {
8437
+ height: 3.1rem0.7rem;
8438
+ }
8439
+
8440
+ .pa-table--sm th, .pa-table--sm td {
8441
+ padding: 0.8rem 1rem;
8442
+ }
8443
+
8444
+ .pa-table--sm td {
8445
+ height: 3.3rem0.8rem;
8446
+ }
8447
+
8448
+ .pa-table--lg th, .pa-table--lg td {
8449
+ padding: 0.8rem 1.4rem;
7974
8450
  }
7975
8451
 
7976
- .pa-table--3x th,
7977
- .pa-table--3x td {
7978
- padding: 1.5rem 2.4rem;
8452
+ .pa-table--lg td {
8453
+ height: 3.8rem0.8rem;
8454
+ }
8455
+
8456
+ .pa-table--xl th, .pa-table--xl td {
8457
+ padding: 0.8rem 1.6rem;
8458
+ }
8459
+
8460
+ .pa-table--xl td {
8461
+ height: 4.1rem0.8rem;
7979
8462
  }
7980
8463
 
7981
8464
  .pa-table tbody tr:hover {
@@ -11746,6 +12229,26 @@ html.font-size-4xl {
11746
12229
  column-gap: 2.4rem;
11747
12230
  }
11748
12231
 
12232
+ .self-start {
12233
+ align-self: flex-start;
12234
+ }
12235
+
12236
+ .self-center {
12237
+ align-self: center;
12238
+ }
12239
+
12240
+ .self-end {
12241
+ align-self: flex-end;
12242
+ }
12243
+
12244
+ .self-stretch {
12245
+ align-self: stretch;
12246
+ }
12247
+
12248
+ .self-baseline {
12249
+ align-self: baseline;
12250
+ }
12251
+
11749
12252
  .text-2xs {
11750
12253
  font-size: 1rem;
11751
12254
  }
@@ -11829,6 +12332,114 @@ html.font-size-4xl {
11829
12332
  align-items: flex-start;
11830
12333
  }
11831
12334
 
12335
+ .pa-bg-color-1 {
12336
+ background-color: var(--pa-color-1);
12337
+ }
12338
+
12339
+ .pa-text-color-1 {
12340
+ color: var(--pa-color-1);
12341
+ }
12342
+
12343
+ .pa-border-color-1 {
12344
+ border-color: var(--pa-color-1);
12345
+ }
12346
+
12347
+ .pa-bg-color-2 {
12348
+ background-color: var(--pa-color-2);
12349
+ }
12350
+
12351
+ .pa-text-color-2 {
12352
+ color: var(--pa-color-2);
12353
+ }
12354
+
12355
+ .pa-border-color-2 {
12356
+ border-color: var(--pa-color-2);
12357
+ }
12358
+
12359
+ .pa-bg-color-3 {
12360
+ background-color: var(--pa-color-3);
12361
+ }
12362
+
12363
+ .pa-text-color-3 {
12364
+ color: var(--pa-color-3);
12365
+ }
12366
+
12367
+ .pa-border-color-3 {
12368
+ border-color: var(--pa-color-3);
12369
+ }
12370
+
12371
+ .pa-bg-color-4 {
12372
+ background-color: var(--pa-color-4);
12373
+ }
12374
+
12375
+ .pa-text-color-4 {
12376
+ color: var(--pa-color-4);
12377
+ }
12378
+
12379
+ .pa-border-color-4 {
12380
+ border-color: var(--pa-color-4);
12381
+ }
12382
+
12383
+ .pa-bg-color-5 {
12384
+ background-color: var(--pa-color-5);
12385
+ }
12386
+
12387
+ .pa-text-color-5 {
12388
+ color: var(--pa-color-5);
12389
+ }
12390
+
12391
+ .pa-border-color-5 {
12392
+ border-color: var(--pa-color-5);
12393
+ }
12394
+
12395
+ .pa-bg-color-6 {
12396
+ background-color: var(--pa-color-6);
12397
+ }
12398
+
12399
+ .pa-text-color-6 {
12400
+ color: var(--pa-color-6);
12401
+ }
12402
+
12403
+ .pa-border-color-6 {
12404
+ border-color: var(--pa-color-6);
12405
+ }
12406
+
12407
+ .pa-bg-color-7 {
12408
+ background-color: var(--pa-color-7);
12409
+ }
12410
+
12411
+ .pa-text-color-7 {
12412
+ color: var(--pa-color-7);
12413
+ }
12414
+
12415
+ .pa-border-color-7 {
12416
+ border-color: var(--pa-color-7);
12417
+ }
12418
+
12419
+ .pa-bg-color-8 {
12420
+ background-color: var(--pa-color-8);
12421
+ }
12422
+
12423
+ .pa-text-color-8 {
12424
+ color: var(--pa-color-8);
12425
+ }
12426
+
12427
+ .pa-border-color-8 {
12428
+ border-color: var(--pa-color-8);
12429
+ }
12430
+
12431
+ .pa-bg-color-9 {
12432
+ background-color: var(--pa-color-9);
12433
+ }
12434
+
12435
+ .pa-text-color-9 {
12436
+ color: var(--pa-color-9);
12437
+ }
12438
+
12439
+ .pa-border-color-9 {
12440
+ border-color: var(--pa-color-9);
12441
+ }
12442
+
11832
12443
  .m-0 {
11833
12444
  margin: 0 !important;
11834
12445
  }
@@ -14014,9 +14625,9 @@ html.font-size-4xl {
14014
14625
  --pa-checkbox-bg-indeterminate: #D40511;
14015
14626
  --pa-checkbox-checkmark-color: white;
14016
14627
  --pa-checkbox-focus-shadow: 0 0 0 2px rgba(212, 5, 17, 0.25);
14017
- --pa-input-group-prepend-bg: #F2F2F2;
14628
+ --pa-input-group-prepend-bg: #6c757d;
14018
14629
  --pa-input-group-prepend-text: #8C8C8C;
14019
- --pa-input-group-append-bg: #F2F2F2;
14630
+ --pa-input-group-append-bg: #6c757d;
14020
14631
  --pa-input-group-append-text: #8C8C8C;
14021
14632
  --pa-table-bg: #ffffff;
14022
14633
  --pa-table-header-bg: #EBEBEB;
@@ -14069,15 +14680,15 @@ html.font-size-4xl {
14069
14680
  --pa-multiselect-option-hover-bg: #F2F2F2;
14070
14681
  --pa-multiselect-pill-bg: rgba(212, 5, 17, 0.06);
14071
14682
  --pa-multiselect-pill-border: #D40511;
14072
- --pa-color-1: transparent;
14073
- --pa-color-2: transparent;
14074
- --pa-color-3: transparent;
14075
- --pa-color-4: transparent;
14076
- --pa-color-5: transparent;
14077
- --pa-color-6: transparent;
14078
- --pa-color-7: transparent;
14079
- --pa-color-8: transparent;
14080
- --pa-color-9: transparent;
14683
+ --pa-color-1: #D40511;
14684
+ --pa-color-2: #FFCC00;
14685
+ --pa-color-3: #ff6b00;
14686
+ --pa-color-4: #00a651;
14687
+ --pa-color-5: #0066cc;
14688
+ --pa-color-6: #6b3fa0;
14689
+ --pa-color-7: #8C8C8C;
14690
+ --pa-color-8: #333333;
14691
+ --pa-color-9: #00b4d8;
14081
14692
  --drp-dropdown-bg: #ffffff;
14082
14693
  --drp-border-color: #E5E5E5;
14083
14694
  --drp-primary-bg: #F2F2F2;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@keenmate/pure-admin-theme-express",
3
- "version": "1.0.0-rc04",
3
+ "version": "1.0.0-rc06",
4
4
  "description": "Express theme for Pure Admin",
5
5
  "style": "dist/express.css",
6
6
  "exports": {
@@ -19,10 +19,10 @@
19
19
  "author": "KeenMate",
20
20
  "license": "MIT",
21
21
  "peerDependencies": {
22
- "@keenmate/pure-admin-core": "^1.0.0-rc04"
22
+ "@keenmate/pure-admin-core": "^1.0.0-rc06"
23
23
  },
24
24
  "devDependencies": {
25
- "@keenmate/pure-admin-core": "^1.0.0-rc04",
25
+ "@keenmate/pure-admin-core": "^1.0.0-rc06",
26
26
  "sass": "^1.70.0"
27
27
  },
28
28
  "publishConfig": {
@@ -1,6 +1,19 @@
1
1
  /* Express Theme - Bold yellow and red palette inspired by logistics brands */
2
2
  @use 'sass:color';
3
3
 
4
+ // =============================================================================
5
+ // THEME COLOR SLOTS (1-9) - Express logistics palette
6
+ // =============================================================================
7
+ $color-1: #D40511; // Express Red (primary)
8
+ $color-2: #FFCC00; // Express Yellow (brand)
9
+ $color-3: #ff6b00; // Orange (urgent)
10
+ $color-4: #00a651; // Green (delivered)
11
+ $color-5: #0066cc; // Blue (tracking)
12
+ $color-6: #6b3fa0; // Purple (premium)
13
+ $color-7: #8C8C8C; // Gray (neutral)
14
+ $color-8: #333333; // Dark (contrast)
15
+ $color-9: #00b4d8; // Cyan (info)
16
+
4
17
  // ============================================================================
5
18
  // EXPRESS COLOR PALETTE
6
19
  // ============================================================================