pinokiod 3.180.0 → 3.182.0

package/server/public/style.css

@@ -161,7 +161,7 @@ body.dark .dynamic.selected {
   */
 }
 aside .tab.submenu {
-  padding-left: 25px;
+  padding-left: 25px !important;
   box-sizing: border-box;
 }
 #genlog, #downloadlogs {
@@ -1132,18 +1132,189 @@ header a.path {
   max-width: 100%;
   box-sizing: border-box;
 }
+header,
+header h1,
+header .runner {
+  overflow: visible;
+}
 header .runner {
   padding: 0 10px;
   box-sizing: border-box;
   display: flex;
   align-items: center;
+  gap: 10px;
+  width: 100%;
+  flex-wrap: wrap;
 }
 header .runner .btn {
   padding: 5px 10px;
   font-size: 12px;
-  margin-right: 10px;
+  margin-right: 0;
   flex-shrink: 0;
 }
+.terminal-config {
+  position: relative;
+  display: flex;
+  align-items: center;
+  margin-left: auto;
+  margin-right: 0;
+}
+.terminal-config .terminal-config-button,
+.terminal-config .btn {
+  margin-right: 0;
+}
+.terminal-config-menu {
+  position: absolute;
+  top: calc(100% + 8px);
+  right: 0;
+  min-width: 220px;
+  padding: 12px;
+  border-radius: 10px;
+  border: 1px solid rgba(0, 0, 0, 0.12);
+  background: #ffffff;
+  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.18);
+  z-index: 1500;
+  max-height: min(80vh, 560px);
+  overflow-y: auto;
+}
+.terminal-config-menu .terminal-config-title {
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  margin-bottom: 8px;
+  opacity: 0.65;
+}
+.terminal-config-menu .terminal-config-note {
+  font-size: 11px;
+  margin-bottom: 10px;
+  opacity: 0.7;
+}
+.terminal-config-menu .terminal-config-section {
+  border-top: 1px solid rgba(0, 0, 0, 0.08);
+  padding-top: 12px;
+  margin-top: 12px;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+.terminal-config-menu .terminal-config-section:first-of-type {
+  border-top: none;
+  padding-top: 0;
+  margin-top: 0;
+}
+.terminal-config-menu .terminal-config-subtitle {
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+  opacity: 0.65;
+}
+.terminal-config-menu .terminal-config-help {
+  font-size: 11px;
+  opacity: 0.65;
+  line-height: 1.4;
+}
+.terminal-config-menu .terminal-config-group {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  margin-bottom: 12px;
+}
+.terminal-config-menu .terminal-config-label {
+  font-size: 11px;
+  font-weight: 600;
+  opacity: 0.75;
+}
+.terminal-config-menu .terminal-config-select,
+.terminal-config-menu .terminal-config-input {
+  font-size: 12px;
+  padding: 6px 8px;
+  border-radius: 6px;
+  border: 1px solid rgba(0, 0, 0, 0.18);
+  background: #ffffff;
+  color: inherit;
+}
+.terminal-config-menu .terminal-config-input:focus,
+.terminal-config-menu .terminal-config-select:focus {
+  outline: none;
+  border-color: rgba(127, 91, 243, 0.65);
+  box-shadow: 0 0 0 3px rgba(127, 91, 243, 0.18);
+}
+.terminal-config-menu .terminal-config-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+}
+.terminal-config-menu .terminal-config-reset {
+  font-size: 11px;
+  padding: 4px 10px;
+}
+.terminal-config-menu .terminal-config-theme-grid {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+.terminal-config-menu .terminal-config-theme-row {
+  display: grid;
+  grid-template-columns: minmax(140px, 1fr) 32px minmax(0, 1fr) 28px;
+  align-items: center;
+  gap: 8px;
+}
+.terminal-config-menu .terminal-config-color-input {
+  width: 32px;
+  height: 32px;
+  padding: 0;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+}
+.terminal-config-menu .terminal-config-color-input[data-invalid='true'] {
+  opacity: 0.35;
+}
+.terminal-config-menu .terminal-config-theme-text {
+  width: 100%;
+}
+.terminal-config-menu .terminal-config-theme-clear {
+  padding: 4px 6px;
+  font-size: 12px;
+  min-width: 28px;
+}
+body.dark .terminal-config-menu {
+  background: rgba(21, 22, 23, 0.96);
+  border-color: rgba(255, 255, 255, 0.12);
+  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.35);
+}
+body.dark .terminal-config-menu .terminal-config-label,
+body.dark .terminal-config-menu .terminal-config-title,
+body.dark .terminal-config-menu .terminal-config-note {
+  color: rgba(255, 255, 255, 0.85);
+  opacity: 0.85;
+}
+body.dark .terminal-config-menu .terminal-config-section {
+  border-color: rgba(255, 255, 255, 0.12);
+}
+body.dark .terminal-config-menu .terminal-config-help {
+  color: rgba(255, 255, 255, 0.7);
+}
+body.dark .terminal-config-menu .terminal-config-select,
+body.dark .terminal-config-menu .terminal-config-input {
+  background: rgba(255, 255, 255, 0.08);
+  border-color: rgba(255, 255, 255, 0.16);
+  color: #ffffff;
+}
+body.dark .terminal-config-menu .terminal-config-color-input {
+  background: rgba(255, 255, 255, 0.08);
+  border-radius: 6px;
+}
+body.dark .terminal-config-menu .terminal-config-select:focus,
+body.dark .terminal-config-menu .terminal-config-input:focus {
+  border-color: rgba(127, 91, 243, 0.85);
+  box-shadow: 0 0 0 3px rgba(127, 91, 243, 0.24);
+}
+.terminal-config-open .terminal-config-menu {
+  display: block;
+}
 body.dark .memory {
   background: rgba(0,0,0,0.8);
   border-left: 5px solid white;
@@ -2383,6 +2554,8 @@ body.dark .mode-selector .btn2.selected {
 
 
 @media only screen and (max-width: 768px) {
+  /* Hide QR block on small screens */
+  aside .qr { display: none !important; }
   body {
     display: flex;
     align-items: stretch;
@@ -2455,6 +2628,14 @@ body.dark .mode-selector .btn2.selected {
     overflow: auto;
     flex-wrap: nowrap;
   }
+  /* Keep minimized header horizontal on small screens */
+  header.navheader.minimized,
+  header.navheader.minimized h1 {
+    display: inline-flex;
+    flex-direction: row;
+  }
+  /* Avoid stretching buttons to full width inside minimized pill */
+  header.navheader.minimized h1 .btn2 { width: auto; }
   .mode-selector {
     flex-direction: column;
     padding: 0;
@@ -2539,8 +2720,18 @@ header.navheader.minimized h1 {
   padding: 0;
   height: auto;
   overflow: visible;
-}
-header.navheader.minimized h1 > *:not(.home):not(.header-drag-handle) {
+  flex-wrap: nowrap;
+  justify-content: flex-start;
+}
+/* Ensure item order inside minimized pill: home, refresh, dragger */
+header.navheader.minimized h1 .home { order: 0; }
+header.navheader.minimized h1 #refresh-page { order: 1; }
+header.navheader.minimized h1 .header-drag-handle { order: 2; }
+/* Prevent items from stretching */
+header.navheader.minimized h1 > .home,
+header.navheader.minimized h1 > #refresh-page,
+header.navheader.minimized h1 > .header-drag-handle { flex: 0 0 auto; }
+header.navheader.minimized h1 > *:not(.home):not(.header-drag-handle):not(#refresh-page) {
   display: none !important;
 }
 header.navheader .header-drag-handle {