codexly-ui 0.10.70 → 0.10.72
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/fesm2022/codexly-ui.mjs +82 -40
- package/fesm2022/codexly-ui.mjs.map +1 -1
- package/package.json +1 -1
package/fesm2022/codexly-ui.mjs
CHANGED
|
@@ -15271,7 +15271,7 @@ class ClxCartComponent {
|
|
|
15271
15271
|
<article class="bg-clx-surface rounded-2xl shadow-sm flex gap-0 overflow-hidden group transition-[box-shadow,transform] duration-200 hover:shadow-md hover:-translate-y-0.5">
|
|
15272
15272
|
|
|
15273
15273
|
<!-- Image — fixed square -->
|
|
15274
|
-
<div class="relative shrink-0 w-28 h-28 lg:w-36 lg:h-36 overflow-hidden bg-clx-surface-2">
|
|
15274
|
+
<div class="relative shrink-0 w-28 h-28 p-2.5 lg:w-36 lg:h-36 overflow-hidden bg-clx-surface-2">
|
|
15275
15275
|
@if (item.main_image) {
|
|
15276
15276
|
<img [src]="item.main_image" [alt]="item.name"
|
|
15277
15277
|
class="w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" />
|
|
@@ -15308,34 +15308,55 @@ class ClxCartComponent {
|
|
|
15308
15308
|
|
|
15309
15309
|
<!-- Title block -->
|
|
15310
15310
|
<div class="pr-8">
|
|
15311
|
-
<p class="text-
|
|
15311
|
+
<p class="text-sm text-clx-text-subtle truncate">{{ item.trademark }}</p>
|
|
15312
15312
|
<h3 class="text-sm font-semibold text-clx-text-label leading-snug line-clamp-2">{{ item.name }}</h3>
|
|
15313
|
-
<p class="text-
|
|
15313
|
+
<p class="text-sm font-mono text-clx-text-subtle mt-0.5">{{ item.sku }}</p>
|
|
15314
15314
|
</div>
|
|
15315
15315
|
|
|
15316
15316
|
<!-- Price + Quantity row -->
|
|
15317
|
-
<div class="flex items-
|
|
15317
|
+
<div class="flex items-end justify-between gap-3 mt-auto flex-wrap">
|
|
15318
15318
|
|
|
15319
|
-
<!--
|
|
15320
|
-
<div class="flex items-
|
|
15321
|
-
<span class="text-base font-bold text-clx-text-label">
|
|
15322
|
-
{{ item.unit_price | currency:'COP':'$':'1.0-0' }}
|
|
15323
|
-
</span>
|
|
15319
|
+
<!-- Prices -->
|
|
15320
|
+
<div class="flex items-end gap-4">
|
|
15324
15321
|
@if (item.has_discount && item.original_price) {
|
|
15325
|
-
<
|
|
15326
|
-
|
|
15327
|
-
|
|
15322
|
+
<div>
|
|
15323
|
+
<p class="text-sm text-clx-text-label">Precio</p>
|
|
15324
|
+
<span class="text-sm text-clx-text-subtle line-through">
|
|
15325
|
+
{{ item.original_price | currency:'COP':'$':'1.0-0' }}
|
|
15326
|
+
</span>
|
|
15327
|
+
</div>
|
|
15328
|
+
<div>
|
|
15329
|
+
<p class="text-sm text-clx-text-label">Precio con descuento</p>
|
|
15330
|
+
<span class="text-sm font-bold text-clx-text-subtle">
|
|
15331
|
+
{{ item.unit_price | currency:'COP':'$':'1.0-0' }}
|
|
15332
|
+
</span>
|
|
15333
|
+
</div>
|
|
15334
|
+
} @else {
|
|
15335
|
+
<div>
|
|
15336
|
+
<p class="text-sm text-clx-text-label">Precio</p>
|
|
15337
|
+
<span class="text-sm font-bold text-clx-text-subtle">
|
|
15338
|
+
{{ item.unit_price | currency:'COP':'$':'1.0-0' }}
|
|
15339
|
+
</span>
|
|
15340
|
+
</div>
|
|
15328
15341
|
}
|
|
15329
15342
|
</div>
|
|
15330
15343
|
|
|
15331
|
-
<!-- Quantity control -->
|
|
15332
|
-
<
|
|
15333
|
-
|
|
15334
|
-
|
|
15335
|
-
|
|
15336
|
-
|
|
15337
|
-
|
|
15338
|
-
|
|
15344
|
+
<!-- Quantity control + Total -->
|
|
15345
|
+
<div class="flex items-end gap-3">
|
|
15346
|
+
<clx-number
|
|
15347
|
+
variant="stepper" size="sm" [color]="color()"
|
|
15348
|
+
[min]="1" [max]="item.max_quantity ?? null"
|
|
15349
|
+
[disabled]="!item.in_stock"
|
|
15350
|
+
[ngModel]="item.quantity"
|
|
15351
|
+
(ngModelChange)="onQuantityChange.emit({ item, quantity: $event })">
|
|
15352
|
+
</clx-number>
|
|
15353
|
+
<div>
|
|
15354
|
+
<p class="text-sm text-clx-text-label">Total</p>
|
|
15355
|
+
<span class="text-sm font-bold text-clx-text-subtle">
|
|
15356
|
+
{{ item.unit_price * item.quantity | currency:'COP':'$':'1.0-0' }}
|
|
15357
|
+
</span>
|
|
15358
|
+
</div>
|
|
15359
|
+
</div>
|
|
15339
15360
|
</div>
|
|
15340
15361
|
</div>
|
|
15341
15362
|
|
|
@@ -15531,7 +15552,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
|
|
|
15531
15552
|
<article class="bg-clx-surface rounded-2xl shadow-sm flex gap-0 overflow-hidden group transition-[box-shadow,transform] duration-200 hover:shadow-md hover:-translate-y-0.5">
|
|
15532
15553
|
|
|
15533
15554
|
<!-- Image — fixed square -->
|
|
15534
|
-
<div class="relative shrink-0 w-28 h-28 lg:w-36 lg:h-36 overflow-hidden bg-clx-surface-2">
|
|
15555
|
+
<div class="relative shrink-0 w-28 h-28 p-2.5 lg:w-36 lg:h-36 overflow-hidden bg-clx-surface-2">
|
|
15535
15556
|
@if (item.main_image) {
|
|
15536
15557
|
<img [src]="item.main_image" [alt]="item.name"
|
|
15537
15558
|
class="w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" />
|
|
@@ -15568,34 +15589,55 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
|
|
|
15568
15589
|
|
|
15569
15590
|
<!-- Title block -->
|
|
15570
15591
|
<div class="pr-8">
|
|
15571
|
-
<p class="text-
|
|
15592
|
+
<p class="text-sm text-clx-text-subtle truncate">{{ item.trademark }}</p>
|
|
15572
15593
|
<h3 class="text-sm font-semibold text-clx-text-label leading-snug line-clamp-2">{{ item.name }}</h3>
|
|
15573
|
-
<p class="text-
|
|
15594
|
+
<p class="text-sm font-mono text-clx-text-subtle mt-0.5">{{ item.sku }}</p>
|
|
15574
15595
|
</div>
|
|
15575
15596
|
|
|
15576
15597
|
<!-- Price + Quantity row -->
|
|
15577
|
-
<div class="flex items-
|
|
15598
|
+
<div class="flex items-end justify-between gap-3 mt-auto flex-wrap">
|
|
15578
15599
|
|
|
15579
|
-
<!--
|
|
15580
|
-
<div class="flex items-
|
|
15581
|
-
<span class="text-base font-bold text-clx-text-label">
|
|
15582
|
-
{{ item.unit_price | currency:'COP':'$':'1.0-0' }}
|
|
15583
|
-
</span>
|
|
15600
|
+
<!-- Prices -->
|
|
15601
|
+
<div class="flex items-end gap-4">
|
|
15584
15602
|
@if (item.has_discount && item.original_price) {
|
|
15585
|
-
<
|
|
15586
|
-
|
|
15587
|
-
|
|
15603
|
+
<div>
|
|
15604
|
+
<p class="text-sm text-clx-text-label">Precio</p>
|
|
15605
|
+
<span class="text-sm text-clx-text-subtle line-through">
|
|
15606
|
+
{{ item.original_price | currency:'COP':'$':'1.0-0' }}
|
|
15607
|
+
</span>
|
|
15608
|
+
</div>
|
|
15609
|
+
<div>
|
|
15610
|
+
<p class="text-sm text-clx-text-label">Precio con descuento</p>
|
|
15611
|
+
<span class="text-sm font-bold text-clx-text-subtle">
|
|
15612
|
+
{{ item.unit_price | currency:'COP':'$':'1.0-0' }}
|
|
15613
|
+
</span>
|
|
15614
|
+
</div>
|
|
15615
|
+
} @else {
|
|
15616
|
+
<div>
|
|
15617
|
+
<p class="text-sm text-clx-text-label">Precio</p>
|
|
15618
|
+
<span class="text-sm font-bold text-clx-text-subtle">
|
|
15619
|
+
{{ item.unit_price | currency:'COP':'$':'1.0-0' }}
|
|
15620
|
+
</span>
|
|
15621
|
+
</div>
|
|
15588
15622
|
}
|
|
15589
15623
|
</div>
|
|
15590
15624
|
|
|
15591
|
-
<!-- Quantity control -->
|
|
15592
|
-
<
|
|
15593
|
-
|
|
15594
|
-
|
|
15595
|
-
|
|
15596
|
-
|
|
15597
|
-
|
|
15598
|
-
|
|
15625
|
+
<!-- Quantity control + Total -->
|
|
15626
|
+
<div class="flex items-end gap-3">
|
|
15627
|
+
<clx-number
|
|
15628
|
+
variant="stepper" size="sm" [color]="color()"
|
|
15629
|
+
[min]="1" [max]="item.max_quantity ?? null"
|
|
15630
|
+
[disabled]="!item.in_stock"
|
|
15631
|
+
[ngModel]="item.quantity"
|
|
15632
|
+
(ngModelChange)="onQuantityChange.emit({ item, quantity: $event })">
|
|
15633
|
+
</clx-number>
|
|
15634
|
+
<div>
|
|
15635
|
+
<p class="text-sm text-clx-text-label">Total</p>
|
|
15636
|
+
<span class="text-sm font-bold text-clx-text-subtle">
|
|
15637
|
+
{{ item.unit_price * item.quantity | currency:'COP':'$':'1.0-0' }}
|
|
15638
|
+
</span>
|
|
15639
|
+
</div>
|
|
15640
|
+
</div>
|
|
15599
15641
|
</div>
|
|
15600
15642
|
</div>
|
|
15601
15643
|
|