release: Multi-Hoster-Upload 2.1.1

Add live English and German interface switching, animated navigation and history controls, improved update changelogs, remembered upload folders, reliable repeated hot reloads, and refreshed public documentation.
This commit is contained in:
Sucukdeluxe
2026-08-10 18:31:35 +02:00
parent d8e4a2d203
commit dc744ec6f3
19 changed files with 1658 additions and 88 deletions
+304 -10
View File
@@ -913,7 +913,26 @@ body.col-resizing, body.col-resizing * { cursor: col-resize !important; user-sel
}
#settingsSearchInput::placeholder { color: var(--text-dim); }
#settingsSearchInput:focus { border-color: var(--accent); outline: none; }
.settings-navigation { display: flex; flex-direction: column; gap: 3px; }
.settings-navigation {
position: relative;
isolation: isolate;
display: flex;
flex-direction: column;
gap: 3px;
}
.settings-nav-indicator {
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
z-index: 0;
border: 1px solid #444548;
border-radius: 6px;
background: var(--bg-active);
pointer-events: none;
transition: transform .22s cubic-bezier(.2, .8, .2, 1), width .22s cubic-bezier(.2, .8, .2, 1), height .22s cubic-bezier(.2, .8, .2, 1);
}
.settings-nav-button {
min-height: 35px;
padding: 8px 11px;
@@ -927,12 +946,14 @@ body.col-resizing, body.col-resizing * { cursor: col-resize !important; user-sel
font-size: 12px;
font-weight: 600;
text-align: left;
position: relative;
z-index: 1;
transition: background 0.14s, color 0.14s, border-color 0.14s;
}
.settings-nav-button:hover { background: var(--bg-card-hover); color: var(--text); }
.settings-nav-button.active {
border-left-color: var(--accent);
background: color-mix(in srgb, var(--accent) 13%, transparent);
border-left-color: transparent;
background: transparent;
color: var(--text);
}
.settings-nav-button[hidden] { display: none; }
@@ -1400,8 +1421,82 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
.history-container { padding: 16px; overflow: auto; flex: 1; background: linear-gradient(180deg, rgba(255,255,255,0.015), transparent 24%); }
.history-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.history-header h2 { font-size: 18px; }
.history-retention-label { font-size: 12px; color: var(--text-dim); margin-right: 2px; }
.history-retention-select { width: auto; min-width: 150px; padding: 6px 8px; }
.history-retention-label { font-size: 13px; line-height: 16px; color: var(--text-dim); margin-right: 2px; transform: translateY(-1px); }
.history-retention-picker {
position: relative;
min-width: 150px;
}
.btn.history-retention-trigger {
width: 100%;
min-width: 150px;
min-height: 34px;
height: 34px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
padding-inline: 11px;
color: var(--text);
font-size: 13px;
line-height: 16px;
text-align: left;
}
.history-retention-trigger[aria-expanded="true"] {
border-color: var(--accent-end);
background: var(--bg-active);
}
.history-retention-chevron {
width: 7px;
height: 7px;
flex: 0 0 auto;
border-right: 2px solid currentColor;
border-bottom: 2px solid currentColor;
transform: translateY(-2px) rotate(45deg);
transition: transform .18s ease;
}
.history-retention-trigger[aria-expanded="true"] .history-retention-chevron {
transform: translateY(2px) rotate(225deg);
}
.history-retention-menu {
position: absolute;
top: calc(100% + 6px);
left: 0;
z-index: 1200;
width: max-content;
min-width: 100%;
padding: 5px;
border: 1px solid var(--border-hover);
border-radius: 7px;
background: var(--bg-raised);
box-shadow: 0 18px 38px rgba(0, 0, 0, .38);
transform-origin: top;
}
.history-retention-option {
width: 100%;
min-height: 31px;
display: flex;
align-items: center;
padding: 0 10px;
border: 0;
border-radius: 5px;
background: transparent;
color: var(--text-muted);
font: inherit;
font-size: 12px;
font-weight: 600;
white-space: nowrap;
cursor: pointer;
}
.history-retention-option:hover,
.history-retention-option:focus-visible {
background: var(--bg-active);
color: var(--text);
outline: none;
}
.history-retention-option[aria-selected="true"] {
background: color-mix(in srgb, var(--accent) 15%, transparent);
color: var(--text);
}
.history-cap-notice {
margin: 0 0 10px;
padding: 8px 12px;
@@ -1605,6 +1700,15 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
transition-duration: 280ms !important;
}
.view-sidebar-indicator,
.settings-nav-indicator {
transition-duration: 220ms !important;
}
.language-picker-indicator {
transition-duration: 240ms !important;
}
.menu-opening {
animation-duration: 180ms !important;
}
@@ -2185,6 +2289,19 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
white-space: pre-wrap;
}
.update-release-notes-title {
margin-bottom: 7px;
color: var(--text);
font-size: 11px;
font-weight: 700;
letter-spacing: .08em;
text-transform: uppercase;
}
.update-release-notes-body {
white-space: pre-wrap;
}
.update-progress-track {
height: 6px;
border-radius: 999px;
@@ -2276,6 +2393,22 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
.view-sidebar-navigation {
display: grid;
gap: 4px;
position: relative;
isolation: isolate;
}
.view-sidebar-indicator {
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
z-index: 0;
border: 1px solid var(--border-hover);
border-radius: 6px;
background: var(--bg-active);
pointer-events: none;
transition: transform .22s cubic-bezier(.2, .8, .2, 1), width .22s cubic-bezier(.2, .8, .2, 1), height .22s cubic-bezier(.2, .8, .2, 1);
}
.view-sidebar-item {
@@ -2294,6 +2427,8 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
font: inherit;
font-size: 12px;
text-align: left;
position: relative;
z-index: 1;
transition: color .12s, background-color .12s, border-color .12s;
}
@@ -2305,8 +2440,8 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
.view-sidebar-item.active {
color: var(--text);
border-color: var(--border-hover);
background: var(--bg-active);
border-color: transparent;
background: transparent;
}
.view-sidebar-item.active .view-sidebar-icon {
@@ -2691,6 +2826,15 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
transform: none;
}
.btn-danger:disabled {
border-color: var(--border);
background: var(--bg-raised);
color: var(--text-dim);
opacity: .65;
cursor: default;
pointer-events: none;
}
.key-input,
.hs-input {
min-height: 40px;
@@ -2779,8 +2923,8 @@ input[type="checkbox"] {
}
.settings-nav-button.active {
border-color: #444548;
background: var(--bg-active);
border-color: transparent;
background: transparent;
color: var(--text);
}
@@ -2790,10 +2934,155 @@ input[type="checkbox"] {
}
.settings-subpage {
max-width: 560px;
max-width: 720px;
margin: 0;
}
.program-update-row {
display: grid !important;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center !important;
min-height: 78px !important;
column-gap: 18px !important;
}
.program-update-copy {
min-width: 0;
display: grid;
gap: 4px;
}
.program-update-title {
color: var(--text);
font-size: 12px;
line-height: 1.35;
}
.program-update-description {
color: var(--text-muted);
font-size: 10px;
line-height: 1.45;
}
.language-settings-row {
display: block !important;
}
.language-settings-row > label {
display: block;
margin-bottom: 8px;
}
.language-picker {
position: relative;
display: grid;
grid-template-columns: 1fr 1fr;
width: 100%;
padding: 4px;
overflow: hidden;
border: 1px solid var(--border);
border-radius: 8px;
background: var(--bg-input);
}
.language-picker-indicator {
position: absolute;
z-index: 0;
top: 4px;
bottom: 4px;
left: 4px;
width: calc((100% - 8px) / 2);
border-radius: 6px;
background: var(--accent);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18);
transform: translateX(0);
transition: transform .24s cubic-bezier(.22, 1, .36, 1);
}
.language-picker[data-language="de"] .language-picker-indicator {
transform: translateX(100%);
}
.language-option {
position: relative;
z-index: 1;
display: flex;
align-items: center;
justify-content: center;
gap: 9px;
min-width: 0;
min-height: 38px;
padding: 0 12px;
border: 0;
border-radius: 6px;
background: transparent;
color: var(--text-muted);
font: inherit;
font-size: 12px;
font-weight: 600;
cursor: pointer;
transition: color .18s ease;
}
.language-option[aria-pressed="true"] {
color: var(--accent-ink);
}
.language-option:focus-visible {
outline: 2px solid var(--accent-end);
outline-offset: -2px;
}
.language-flag {
position: relative;
width: 18px;
height: 12px;
flex: 0 0 auto;
overflow: hidden;
border: 1px solid rgba(0, 0, 0, .34);
border-radius: 2px;
box-shadow: 0 0 0 1px rgba(255, 255, 255, .08);
}
.language-flag-de {
background: linear-gradient(to bottom, #151515 0 33.33%, #d00 33.33% 66.66%, #ffce00 66.66% 100%);
}
.language-flag-en {
background: repeating-linear-gradient(to bottom, #b22234 0 8.33%, #fff 8.33% 16.66%);
}
.language-flag-en::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 8px;
height: 7px;
background: #3c3b6e;
}
.log-file-path-row {
display: grid !important;
grid-template-columns: 190px minmax(180px, 1fr) auto auto;
align-items: center !important;
column-gap: 8px !important;
flex-wrap: nowrap !important;
}
.log-file-path-row > label {
min-width: 0 !important;
}
.log-file-path-row > .key-input {
width: 100%;
min-width: 0 !important;
}
.log-file-path-row .btn {
white-space: nowrap;
}
.settings-page-header {
margin-bottom: 22px;
}
@@ -3338,6 +3627,11 @@ input[type="checkbox"] {
min-width: 120px;
}
.history-retention-picker,
.history-retention-trigger {
min-width: 120px;
}
.statusbar > span:not(.sb-state):not(.sb-speed):not(.sb-error-count) {
display: none;
}