Memory management improvements

#4
by Xenova HF Staff - opened
assets/{index-Dt2nXeN6.js → index-Bf-HmMxp.js} RENAMED
The diff for this file is too large to render. See raw diff
 
index.html CHANGED
@@ -475,6 +475,13 @@ body.loaded .landing-inner { opacity: 1; transform: translateY(0); }
475
  }
476
  body.loaded .hero-inner { opacity: 1; transform: translateY(0); }
477
 
 
 
 
 
 
 
 
478
  .hero-eyebrow {
479
  font-family: 'Geist Mono', monospace;
480
  font-size: 11px;
@@ -494,6 +501,51 @@ body.loaded .hero-inner { opacity: 1; transform: translateY(0); }
494
  background: var(--amber);
495
  }
496
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
497
  .prompt {
498
  width: 100%;
499
  background: transparent;
@@ -1039,7 +1091,7 @@ input[type="range"]::-moz-range-thumb {
1039
  ::-webkit-scrollbar-thumb { background: #2a2522; border-radius: 4px; }
1040
  ::-webkit-scrollbar-thumb:hover { background: #3a3530; }
1041
  </style>
1042
- <script type="module" crossorigin src="/assets/index-Dt2nXeN6.js"></script>
1043
  </head>
1044
  <body>
1045
 
@@ -1165,7 +1217,14 @@ input[type="range"]::-moz-range-thumb {
1165
 
1166
  <section class="section" id="hero" hidden>
1167
  <div class="hero-inner">
1168
- <p class="hero-eyebrow">enter a prompt</p>
 
 
 
 
 
 
 
1169
 
1170
  <textarea
1171
  class="prompt"
 
475
  }
476
  body.loaded .hero-inner { opacity: 1; transform: translateY(0); }
477
 
478
+ .hero-eyebrow-row {
479
+ display: flex;
480
+ align-items: center;
481
+ justify-content: space-between;
482
+ gap: 1rem;
483
+ flex-wrap: wrap;
484
+ }
485
  .hero-eyebrow {
486
  font-family: 'Geist Mono', monospace;
487
  font-size: 11px;
 
501
  background: var(--amber);
502
  }
503
 
504
+ /* "Running locally" badge: a pulsing dot + status text + (optional)
505
+ detected hardware. Sits on the right side of the prompt eyebrow row.
506
+ Hover tooltip explains what "locally" means. */
507
+ .local-badge {
508
+ display: inline-flex;
509
+ align-items: center;
510
+ gap: 8px;
511
+ padding: 5px 12px 5px 10px;
512
+ background: rgba(74, 158, 96, 0.08);
513
+ border: 1px solid rgba(74, 158, 96, 0.25);
514
+ border-radius: 9999px;
515
+ font-family: 'Geist Mono', monospace;
516
+ font-size: 10.5px;
517
+ letter-spacing: 0.08em;
518
+ color: #b4d8a6;
519
+ cursor: help;
520
+ user-select: none;
521
+ white-space: nowrap;
522
+ }
523
+ .local-badge-dot {
524
+ width: 7px;
525
+ height: 7px;
526
+ border-radius: 50%;
527
+ background: #6ec47a;
528
+ box-shadow: 0 0 0 0 rgba(110, 196, 122, 0.6);
529
+ animation: local-badge-pulse 2.4s cubic-bezier(0.4, 0, 0.6, 1) infinite;
530
+ }
531
+ .local-badge-text { font-weight: 500; }
532
+ .local-badge-meta {
533
+ color: rgba(180, 216, 166, 0.7);
534
+ font-weight: 400;
535
+ padding-left: 6px;
536
+ border-left: 1px solid rgba(74, 158, 96, 0.25);
537
+ /* Long GPU strings can blow the layout out; clamp + ellipsize. */
538
+ max-width: 22ch;
539
+ overflow: hidden;
540
+ text-overflow: ellipsis;
541
+ white-space: nowrap;
542
+ }
543
+ @keyframes local-badge-pulse {
544
+ 0% { box-shadow: 0 0 0 0 rgba(110, 196, 122, 0.55); }
545
+ 70% { box-shadow: 0 0 0 8px rgba(110, 196, 122, 0); }
546
+ 100% { box-shadow: 0 0 0 0 rgba(110, 196, 122, 0); }
547
+ }
548
+
549
  .prompt {
550
  width: 100%;
551
  background: transparent;
 
1091
  ::-webkit-scrollbar-thumb { background: #2a2522; border-radius: 4px; }
1092
  ::-webkit-scrollbar-thumb:hover { background: #3a3530; }
1093
  </style>
1094
+ <script type="module" crossorigin src="/assets/index-Bf-HmMxp.js"></script>
1095
  </head>
1096
  <body>
1097
 
 
1217
 
1218
  <section class="section" id="hero" hidden>
1219
  <div class="hero-inner">
1220
+ <div class="hero-eyebrow-row">
1221
+ <p class="hero-eyebrow">enter a prompt</p>
1222
+ <div class="local-badge" id="localBadge" title="All inference happens in your browser via WebGPU. No server calls, no data leaving your machine.">
1223
+ <span class="local-badge-dot" aria-hidden="true"></span>
1224
+ <span class="local-badge-text">Running locally</span>
1225
+ <span class="local-badge-meta" id="localBadgeMeta" hidden></span>
1226
+ </div>
1227
+ </div>
1228
 
1229
  <textarea
1230
  class="prompt"