@compose-market/theme 0.0.96 → 0.0.98

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.
@@ -372,64 +372,81 @@
372
372
  }
373
373
 
374
374
  .cm-agent-card--match-chat {
375
- height: 100%;
375
+ height: auto;
376
376
  min-height: 0;
377
+ max-height: 100%;
377
378
  }
378
379
 
379
380
  .cm-agent-card--match-chat > .cm-agent-card__main {
380
- height: 100%;
381
+ height: auto;
381
382
  min-height: 0;
382
383
  align-content: start;
383
- overflow: hidden;
384
+ overflow: visible;
384
385
  }
385
386
 
386
- .cm-agent-card--market {
387
- height: var(--cm-market-card-height, clamp(12.5rem, 24vw, 20rem));
387
+ .cm-agent-card--market,
388
+ .cm-agent-card--market-full {
389
+ height: var(--cm-market-card-height, clamp(19.5rem, 36dvh, 22.5rem));
388
390
  min-height: 0;
389
391
  }
390
392
 
391
- .cm-agent-card--market > .cm-agent-card__main {
393
+ .cm-agent-card--market > .cm-agent-card__main,
394
+ .cm-agent-card--market-full > .cm-agent-card__main {
395
+ display: grid;
396
+ grid-template-rows: auto auto auto auto auto;
392
397
  height: 100%;
393
398
  min-height: 0;
394
- gap: clamp(0.34rem, 1.1cqi, 0.54rem);
395
- padding: clamp(0.58rem, 1.35cqi, 0.78rem);
399
+ gap: clamp(0.48rem, 1.15cqi, 0.72rem);
400
+ padding: clamp(0.68rem, 1.55cqi, 0.92rem);
396
401
  align-content: start;
397
402
  overflow: hidden;
398
403
  }
399
404
 
400
- .cm-agent-card--market .cm-agent-card__header {
401
- gap: 0.62rem;
405
+ .cm-agent-card--market .cm-agent-card__header,
406
+ .cm-agent-card--market-full .cm-agent-card__header {
407
+ gap: clamp(0.68rem, 1.55cqi, 0.9rem);
402
408
  align-items: flex-start;
403
409
  }
404
410
 
405
- .cm-agent-card--market .cm-agent-card__avatar {
406
- width: clamp(2.05rem, 9cqi, 2.55rem);
407
- height: clamp(2.05rem, 9cqi, 2.55rem);
411
+ .cm-agent-card--market .cm-agent-card__avatar,
412
+ .cm-agent-card--market-full .cm-agent-card__avatar {
413
+ width: clamp(2.65rem, 8.5cqi, 3.25rem);
414
+ height: clamp(2.65rem, 8.5cqi, 3.25rem);
408
415
  }
409
416
 
410
- .cm-agent-card--market .cm-agent-card__copy {
411
- gap: 0.28rem;
417
+ .cm-agent-card--market .cm-agent-card__copy,
418
+ .cm-agent-card--market-full .cm-agent-card__copy {
419
+ gap: 0.38rem;
412
420
  }
413
421
 
414
- .cm-agent-card--market .cm-agent-card__title {
415
- font-size: clamp(0.82rem, 3.2cqi, 0.98rem);
416
- line-height: 1.08;
422
+ .cm-agent-card--market .cm-agent-card__title,
423
+ .cm-agent-card--market-full .cm-agent-card__title {
424
+ font-size: clamp(0.94rem, 2.55cqi, 1.08rem);
425
+ line-height: 1.12;
417
426
  }
418
427
 
419
- .cm-agent-card--market .cm-agent-card__identity {
420
- gap: 0.22rem;
428
+ .cm-agent-card--market .cm-agent-card__identity,
429
+ .cm-agent-card--market-full .cm-agent-card__identity {
430
+ gap: 0.26rem;
421
431
  }
422
432
 
423
- .cm-agent-card--market .cm-agent-card__identity-head {
424
- flex-wrap: nowrap;
433
+ .cm-agent-card--market .cm-agent-card__identity-head,
434
+ .cm-agent-card--market-full .cm-agent-card__identity-head {
435
+ flex-wrap: wrap;
425
436
  }
426
437
 
427
438
  .cm-agent-card--market .cm-agent-card__identity-name,
439
+ .cm-agent-card--market-full .cm-agent-card__identity-name,
428
440
  .cm-agent-card--market .cm-agent-card__identity-address,
441
+ .cm-agent-card--market-full .cm-agent-card__identity-address,
429
442
  .cm-agent-card--market .cm-agent-card__model-name,
443
+ .cm-agent-card--market-full .cm-agent-card__model-name,
430
444
  .cm-agent-card--market .cm-agent-card__metric-value,
445
+ .cm-agent-card--market-full .cm-agent-card__metric-value,
431
446
  .cm-agent-card--market .cm-agent-card__endpoint-code,
432
- .cm-agent-card--market .cm-agent-card__creator-value {
447
+ .cm-agent-card--market-full .cm-agent-card__endpoint-code,
448
+ .cm-agent-card--market .cm-agent-card__creator-value,
449
+ .cm-agent-card--market-full .cm-agent-card__creator-value {
433
450
  overflow: hidden;
434
451
  text-overflow: ellipsis;
435
452
  white-space: nowrap;
@@ -437,110 +454,136 @@
437
454
  word-break: normal;
438
455
  }
439
456
 
440
- .cm-agent-card--market .cm-agent-card__model {
457
+ .cm-agent-card--market .cm-agent-card__model,
458
+ .cm-agent-card--market-full .cm-agent-card__model {
441
459
  max-width: 100%;
442
- padding-block: 0.12rem;
443
- font-size: clamp(0.55rem, 2.1cqi, 0.63rem);
460
+ font-size: clamp(0.58rem, 1.85cqi, 0.66rem);
444
461
  }
445
462
 
446
- .cm-agent-card--market .cm-agent-card__description {
463
+ .cm-agent-card--market .cm-agent-card__description,
464
+ .cm-agent-card--market-full .cm-agent-card__description {
447
465
  display: -webkit-box;
448
- min-height: calc(2 * 1.28em);
449
- max-height: calc(2 * 1.28em);
466
+ min-height: calc(3 * 1.36em);
467
+ max-height: calc(3 * 1.36em);
450
468
  overflow: hidden;
451
469
  -webkit-box-orient: vertical;
452
- -webkit-line-clamp: 2;
453
- font-size: clamp(0.66rem, 2.35cqi, 0.74rem);
454
- line-height: 1.28;
470
+ -webkit-line-clamp: 3;
471
+ font-size: clamp(0.72rem, 1.9cqi, 0.82rem);
472
+ line-height: 1.36;
455
473
  }
456
474
 
457
475
  .cm-agent-card--market .cm-agent-card__badges,
458
- .cm-agent-card--market .cm-agent-card__tags {
459
- max-height: clamp(1.48rem, 5.5cqi, 1.7rem);
460
- gap: 0.28rem;
461
- overflow: hidden;
476
+ .cm-agent-card--market-full .cm-agent-card__badges,
477
+ .cm-agent-card--market .cm-agent-card__tags,
478
+ .cm-agent-card--market-full .cm-agent-card__tags {
479
+ gap: 0.34rem;
480
+ overflow: visible;
462
481
  }
463
482
 
464
483
  .cm-agent-card--market .cm-agent-card__badge,
465
- .cm-agent-card--market .cm-agent-card__tag {
466
- min-height: clamp(1.25rem, 4.9cqi, 1.5rem);
467
- padding: 0 0.42rem;
468
- font-size: clamp(0.5rem, 1.9cqi, 0.58rem);
469
- letter-spacing: 0.06em;
484
+ .cm-agent-card--market-full .cm-agent-card__badge,
485
+ .cm-agent-card--market .cm-agent-card__tag,
486
+ .cm-agent-card--market-full .cm-agent-card__tag {
487
+ min-height: clamp(1.38rem, 4.6cqi, 1.62rem);
488
+ padding: 0.28rem 0.52rem;
489
+ font-size: clamp(0.54rem, 1.65cqi, 0.62rem);
490
+ letter-spacing: 0.07em;
470
491
  white-space: nowrap;
471
492
  }
472
493
 
473
- .cm-agent-card--market .cm-agent-card__metrics {
494
+ .cm-agent-card--market .cm-agent-card__metrics,
495
+ .cm-agent-card--market-full .cm-agent-card__metrics {
474
496
  grid-template-columns: repeat(3, minmax(0, 1fr));
475
- gap: 0.32rem;
497
+ gap: clamp(0.36rem, 1cqi, 0.52rem);
476
498
  }
477
499
 
478
- .cm-agent-card--market .cm-agent-card__metric {
500
+ .cm-agent-card--market .cm-agent-card__metric,
501
+ .cm-agent-card--market-full .cm-agent-card__metric {
479
502
  min-width: 0;
480
- min-height: clamp(2.05rem, 7.5cqi, 2.45rem);
481
- gap: 0.32rem;
482
- padding: 0.32rem 0.42rem;
483
- border-color: hsl(var(--primary) / 0.13);
484
- background: hsl(221 50% 9% / 0.32);
503
+ min-height: clamp(2.52rem, 7cqi, 3rem);
504
+ gap: 0.38rem;
505
+ padding: clamp(0.42rem, 1.2cqi, 0.58rem);
506
+ border-color: hsl(var(--primary) / 0.15);
507
+ background:
508
+ radial-gradient(circle at 0% 0%, hsl(var(--primary) / 0.08), transparent 42%),
509
+ hsl(221 50% 9% / 0.34);
485
510
  }
486
511
 
487
- .cm-agent-card--market .cm-agent-card__metric-icon svg {
488
- width: 0.74rem;
489
- height: 0.74rem;
512
+ .cm-agent-card--market .cm-agent-card__metric-icon svg,
513
+ .cm-agent-card--market-full .cm-agent-card__metric-icon svg {
514
+ width: 0.78rem;
515
+ height: 0.78rem;
490
516
  }
491
517
 
492
- .cm-agent-card--market .cm-agent-card__metric-label {
493
- font-size: clamp(0.46rem, 1.6cqi, 0.52rem);
518
+ .cm-agent-card--market .cm-agent-card__metric-label,
519
+ .cm-agent-card--market-full .cm-agent-card__metric-label {
520
+ font-size: clamp(0.48rem, 1.45cqi, 0.56rem);
494
521
  letter-spacing: 0.08em;
495
522
  }
496
523
 
497
- .cm-agent-card--market .cm-agent-card__metric-value {
498
- font-size: clamp(0.58rem, 2.05cqi, 0.68rem);
524
+ .cm-agent-card--market .cm-agent-card__metric-value,
525
+ .cm-agent-card--market-full .cm-agent-card__metric-value {
526
+ font-size: clamp(0.62rem, 1.75cqi, 0.72rem);
499
527
  }
500
528
 
501
- .cm-agent-card--market .cm-agent-card__tags-block {
502
- gap: 0.22rem;
503
- min-height: clamp(1.55rem, 6cqi, 1.85rem);
529
+ .cm-agent-card--market .cm-agent-card__tags-block,
530
+ .cm-agent-card--market-full .cm-agent-card__tags-block {
531
+ align-self: stretch;
532
+ align-content: start;
533
+ gap: 0.34rem;
534
+ min-height: 0;
535
+ overflow: visible;
504
536
  }
505
537
 
506
- .cm-agent-card--market .cm-agent-card__tags-title {
507
- display: none;
538
+ .cm-agent-card--market .cm-agent-card__tags-title,
539
+ .cm-agent-card--market-full .cm-agent-card__tags-title {
540
+ display: block;
508
541
  }
509
542
 
510
- .cm-agent-card--market .cm-agent-card__footer {
511
- padding-top: 0.38rem;
543
+ .cm-agent-card--market .cm-agent-card__footer,
544
+ .cm-agent-card--market-full .cm-agent-card__footer {
545
+ padding-top: clamp(0.52rem, 1.2cqi, 0.74rem);
512
546
  }
513
547
 
514
- .cm-agent-card--market .cm-agent-card__footer-stack {
515
- grid-template-columns: minmax(0, 1fr) minmax(4rem, auto);
516
- align-items: center;
517
- gap: 0.42rem;
548
+ .cm-agent-card--market .cm-agent-card__footer-stack,
549
+ .cm-agent-card--market-full .cm-agent-card__footer-stack {
550
+ grid-template-columns: minmax(0, 1fr) minmax(5rem, 0.42fr);
551
+ align-items: start;
552
+ gap: clamp(0.42rem, 1.05cqi, 0.6rem);
518
553
  }
519
554
 
520
555
  .cm-agent-card--market .cm-agent-card__endpoint,
521
- .cm-agent-card--market .cm-agent-card__creator {
522
- gap: 0;
556
+ .cm-agent-card--market-full .cm-agent-card__endpoint,
557
+ .cm-agent-card--market .cm-agent-card__creator,
558
+ .cm-agent-card--market-full .cm-agent-card__creator {
559
+ gap: 0.34rem;
523
560
  min-width: 0;
524
561
  }
525
562
 
526
563
  .cm-agent-card--market .cm-agent-card__endpoint-label,
527
- .cm-agent-card--market .cm-agent-card__creator-label {
528
- display: none;
564
+ .cm-agent-card--market-full .cm-agent-card__endpoint-label,
565
+ .cm-agent-card--market .cm-agent-card__creator-label,
566
+ .cm-agent-card--market-full .cm-agent-card__creator-label {
567
+ display: block;
529
568
  }
530
569
 
531
- .cm-agent-card--market .cm-agent-card__endpoint-row {
532
- min-height: 1.72rem;
533
- padding: 0.22rem 0.34rem 0.22rem 0.48rem;
534
- gap: 0.25rem;
535
- border-color: hsl(var(--primary) / 0.12);
570
+ .cm-agent-card--market .cm-agent-card__endpoint-row,
571
+ .cm-agent-card--market-full .cm-agent-card__endpoint-row {
572
+ min-height: 2.05rem;
573
+ padding: 0.32rem 0.42rem 0.32rem 0.56rem;
574
+ gap: 0.32rem;
575
+ border-color: hsl(var(--primary) / 0.15);
536
576
  }
537
577
 
538
578
  .cm-agent-card--market .cm-agent-card__creator-value,
539
- .cm-agent-card--market .cm-agent-card__endpoint-code {
540
- font-size: clamp(0.55rem, 1.85cqi, 0.62rem);
579
+ .cm-agent-card--market-full .cm-agent-card__creator-value,
580
+ .cm-agent-card--market .cm-agent-card__endpoint-code,
581
+ .cm-agent-card--market-full .cm-agent-card__endpoint-code {
582
+ font-size: clamp(0.58rem, 1.62cqi, 0.68rem);
541
583
  }
542
584
 
543
- .cm-agent-card--market .cm-agent-card__creator-value {
585
+ .cm-agent-card--market .cm-agent-card__creator-value,
586
+ .cm-agent-card--market-full .cm-agent-card__creator-value {
544
587
  display: block;
545
588
  text-align: right;
546
589
  }
@@ -271,3 +271,69 @@
271
271
  font-size: 10px;
272
272
  }
273
273
  }
274
+
275
+ /* ── Launch Recovery Shared Market Primitives ── */
276
+ .cm-market-control-rail {
277
+ display: flex;
278
+ align-items: center;
279
+ justify-content: space-between;
280
+ gap: clamp(0.5rem, 1.25cqi, 0.8rem);
281
+ min-width: 0;
282
+ }
283
+
284
+ .cm-market-control-rail__search {
285
+ flex: 1 1 18rem;
286
+ min-width: min(100%, 13rem);
287
+ }
288
+
289
+ .cm-market-control-rail__tabs,
290
+ .cm-market-control-rail__actions {
291
+ display: flex;
292
+ align-items: center;
293
+ gap: clamp(0.4rem, 1cqi, 0.65rem);
294
+ min-width: 0;
295
+ flex-wrap: wrap;
296
+ justify-content: flex-end;
297
+ }
298
+
299
+ .cm-market-control-rail__tabs {
300
+ flex: 0 1 auto;
301
+ }
302
+
303
+ .cm-market-control-rail__actions {
304
+ flex: 0 0 auto;
305
+ }
306
+
307
+ .cm-filter-bar {
308
+ padding: clamp(0.44rem, 1cqi, 0.58rem);
309
+ border: 1px solid hsl(var(--primary) / 0.15);
310
+ border-radius: 14px;
311
+ background:
312
+ radial-gradient(circle at 0% 0%, hsl(var(--primary) / 0.09), transparent 32%),
313
+ hsl(221 50% 9% / 0.32);
314
+ box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.05);
315
+ }
316
+
317
+ .cm-stat-cell,
318
+ .cm-stat-grid__cell {
319
+ border-color: hsl(var(--primary) / 0.15);
320
+ background:
321
+ radial-gradient(circle at 0% 0%, hsl(var(--primary) / 0.08), transparent 42%),
322
+ hsl(221 50% 9% / 0.34);
323
+ box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.045);
324
+ }
325
+
326
+ @container (max-width: 42rem) {
327
+ .cm-market-control-rail {
328
+ align-items: stretch;
329
+ flex-direction: column;
330
+ }
331
+
332
+ .cm-market-control-rail__search,
333
+ .cm-market-control-rail__tabs,
334
+ .cm-market-control-rail__actions {
335
+ width: 100%;
336
+ flex: 1 1 auto;
337
+ justify-content: stretch;
338
+ }
339
+ }