pinokiod 3.90.0 → 3.92.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pinokiod",
-  "version": "3.90.0",
+  "version": "3.92.0",
   "description": "",
   "main": "index.js",
   "scripts": {

package/server/public/common.js

@@ -29,6 +29,43 @@ async function uploadCapture(blob, filename) {
 }
 
 class ScreenCaptureModal {
+  static ensureSavedModalStyles() {
+    if (document.querySelector('link[href="/urldropdown.css"]')) {
+      return;
+    }
+    if (document.querySelector('style[data-capture-modal-styles="true"]')) {
+      return;
+    }
+    const style = document.createElement('style');
+    style.type = 'text/css';
+    style.dataset.captureModalStyles = 'true';
+    style.textContent = `
+.modal-overlay{position:fixed;inset:0;padding:24px;display:flex;align-items:center;justify-content:center;z-index:9999;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 160ms ease,visibility 0s linear 160ms;}
+.modal-overlay.is-visible{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s;}
+@media (prefers-reduced-motion: reduce){.modal-overlay{transition:none;}.capture-modal{animation:none;}}
+.capture-modal-overlay{background:rgba(15,23,42,0.45);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);}
+.capture-modal{width:min(360px,calc(100% - 32px));padding:28px 26px;border-radius:18px;background:rgba(255,255,255,0.92);border:1px solid rgba(15,23,42,0.08);box-shadow:0 30px 80px rgba(15,23,42,0.35);display:flex;flex-direction:column;gap:18px;text-align:center;}
+body.dark .capture-modal{background:rgba(15,23,42,0.9);border-color:rgba(148,163,184,0.24);color:rgba(226,232,240,0.96);box-shadow:0 34px 88px rgba(2,6,20,0.82);}
+.capture-modal-title{font-size:20px;font-weight:600;letter-spacing:-0.01em;color:rgba(15,23,42,0.92);}
+body.dark .capture-modal-title{color:inherit;}
+.capture-modal-description{font-size:14px;line-height:1.5;color:rgba(71,85,105,0.82);}
+body.dark .capture-modal-description{color:rgba(203,213,225,0.88);}
+.capture-modal-actions{display:flex;justify-content:center;gap:12px;}
+.capture-modal-button{padding:10px 20px;border-radius:999px;border:1px solid transparent;font-size:14px;font-weight:600;cursor:pointer;transition:background 0.18s ease,color 0.18s ease,box-shadow 0.18s ease,transform 0.12s ease;}
+.capture-modal-button.primary{background:linear-gradient(135deg,rgba(127,91,243,0.95),rgba(84,63,196,0.95));color:#fff;box-shadow:0 16px 36px rgba(111,76,242,0.3);}
+.capture-modal-button.primary:hover{box-shadow:0 20px 42px rgba(111,76,242,0.38);transform:translateY(-1px);}
+.capture-modal-button.secondary{background:rgba(148,163,184,0.18);color:rgba(15,23,42,0.78);}
+.capture-modal-button.secondary:hover{background:rgba(148,163,184,0.28);box-shadow:0 12px 28px rgba(15,23,42,0.12);}
+body.dark .capture-modal-button.secondary{background:rgba(148,163,184,0.2);color:rgba(226,232,240,0.92);}
+.capture-modal-button:active{transform:translateY(1px);}
+.capture-modal-button:focus-visible{outline:2px solid rgba(127,91,243,0.8);outline-offset:2px;}
+.modal-overlay.is-visible .capture-modal{animation:captureModalPop 160ms ease-out;}
+@media (max-width: 640px){.modal-overlay{padding:16px;}.capture-modal{width:calc(100% - 24px);padding:24px 20px;}.capture-modal-actions{flex-direction:column;}.capture-modal-button{width:100%;}}
+@keyframes captureModalPop{from{opacity:0;transform:scale(0.97) translateY(12px);}to{opacity:1;transform:scale(1) translateY(0);}}
+`;
+    document.head.appendChild(style);
+  }
+
   constructor(stream = null, opts = {}) {
     this.stream = stream;
     this.opts = opts;
@@ -1128,6 +1165,7 @@ class ScreenCaptureModal {
   }
 
   showCaptureSavedModal(kind) {
+    this.constructor.ensureSavedModalStyles();
     const overlay = document.createElement('div');
     overlay.className = 'modal-overlay capture-modal-overlay';
 

package/server/public/style.css

@@ -1560,7 +1560,7 @@ body.dark .btn {
   cursor: pointer;
   border: none;
   text-decoration: none;
-  padding: 10px;
+  padding: 5px 10px;
   border-radius: 3px;
   background: black;
   /*

package/server/views/app.ejs

@@ -2339,9 +2339,11 @@ body.dark {
     gap: 0;
     line-height: 0;
   }
+  /*
   #fs-status .fs-status-label i {
     font-size: 1rem;
   }
+  */
   #fs-push-btn {
     min-width: 0;
   }

package/server/views/pro.ejs

@@ -180,7 +180,7 @@ body.dark #status-window b {
   <% if (target === "_top") { %>
     <header class='navheader grabbable'>
   <% } else { %>
-    <header class='navheader3'>
+    <header class='navheader2'>
   <% } %>
     <h1>
       <% if (target === "_top") { %>

package/server/views/shell.ejs

@@ -163,7 +163,7 @@ body.frozen {
 #status-window {
   display: flex;
   align-items: center;
-  font-size: 14px;
+  font-size: 12px;
   /*
   flex-grow: 1;
   text-align: right;
@@ -1112,9 +1112,9 @@ document.addEventListener("DOMContentLoaded", async () => {
   <% if (target === "_top") { %>
     <header class='navheader grabbable'>
   <% } else { %>
-    <header class='navheader3'>
+    <header class='navheader2'>
   <% } %>
-    <h1>
+    <div class='runner'>
       <% if (target === "_top") { %>
       <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
       <% } %>
@@ -1132,7 +1132,7 @@ document.addEventListener("DOMContentLoaded", async () => {
       </div>
       <div id='status-window'></div>
       <div id='progress-window' class='hidden'><div id='progress-bar'></div></div>
-    </h1>
+    </div>
   </header>
   <div class='terminal-container'>
     <div id='terminal'></div>