mirror of
https://github.com/UNITRONIX/BetterDesk.git
synced 2026-09-10 09:35:39 +00:00
UNITRONIX
9e9230b467
The Help panel now replaces guided tours with a right-side panel displaying project supporters and GitHub sponsorship links. The previous tutorial features, including spotlight tutorials and the floating help FAB, have been removed. Additionally, updates to the sponsors update process and relevant documentation have been made to reflect these changes.
261 lines
7.1 KiB
CSS
261 lines
7.1 KiB
CSS
/**
|
|
* BetterDesk Console — Theme Bridge
|
|
* Imports from ui-polish.css light theme. This file exists because the
|
|
* main layout references /css/theme.css as a separate stylesheet entry.
|
|
*
|
|
* All theme variables are defined in ui-polish.css.
|
|
* Desktop-specific light theme overrides are below.
|
|
*/
|
|
|
|
/* ═══════════════════════════════════════════════════════════════════════
|
|
LIGHT THEME — Console Components
|
|
═══════════════════════════════════════════════════════════════════════ */
|
|
|
|
[data-theme="light"] .sidebar-rail,
|
|
.theme-light .sidebar-rail {
|
|
background: var(--sidebar-glass-bg-rail, rgba(255, 255, 255, 0.72));
|
|
border-right-color: #d0d7de;
|
|
}
|
|
|
|
[data-theme="light"] .sidebar-rail-btn,
|
|
.theme-light .sidebar-rail-btn {
|
|
color: #656d76;
|
|
}
|
|
|
|
[data-theme="light"] .sidebar-rail-btn:hover,
|
|
.theme-light .sidebar-rail-btn:hover {
|
|
background: rgba(0, 0, 0, 0.06);
|
|
color: #1f2328;
|
|
}
|
|
|
|
[data-theme="light"] .sidebar-rail-btn.active,
|
|
.theme-light .sidebar-rail-btn.active {
|
|
background: rgba(9, 105, 218, 0.1);
|
|
color: #0969da;
|
|
}
|
|
|
|
[data-theme="light"] .sidebar-rail,
|
|
.theme-light .sidebar-rail {
|
|
background: var(--sidebar-glass-bg-rail, rgba(255, 255, 255, 0.72));
|
|
}
|
|
|
|
[data-theme="light"] .sidebar-flyout,
|
|
.theme-light .sidebar-flyout {
|
|
background: var(--sidebar-glass-bg-flyout, rgba(255, 255, 255, 0.82));
|
|
border-right-color: #d0d7de;
|
|
}
|
|
|
|
[data-theme="light"] .sidebar-rail-btn,
|
|
.theme-light .sidebar-rail-btn {
|
|
color: var(--sidebar-btn-color, #656d76);
|
|
}
|
|
|
|
[data-theme="light"] .sidebar-link,
|
|
.theme-light .sidebar-link {
|
|
color: var(--sidebar-btn-color, #656d76);
|
|
}
|
|
|
|
[data-theme="light"] .sidebar-link:hover,
|
|
.theme-light .sidebar-link:hover {
|
|
background: rgba(0, 0, 0, 0.06);
|
|
color: #1f2328;
|
|
}
|
|
|
|
[data-theme="light"] .sidebar-flyout-title,
|
|
.theme-light .sidebar-flyout-title {
|
|
color: var(--sidebar-section-title, #656d76);
|
|
}
|
|
|
|
[data-theme="light"] .navbar,
|
|
.theme-light .navbar {
|
|
background: rgba(255, 255, 255, 0.9);
|
|
backdrop-filter: blur(12px);
|
|
border-bottom-color: #d0d7de;
|
|
}
|
|
|
|
[data-theme="light"] .content-wrapper,
|
|
.theme-light .content-wrapper {
|
|
background: #f6f8fa;
|
|
}
|
|
|
|
[data-theme="light"] .card,
|
|
.theme-light .card {
|
|
background: #ffffff;
|
|
border-color: #d0d7de;
|
|
}
|
|
|
|
[data-theme="light"] .table th,
|
|
.theme-light .table th {
|
|
background: #f6f8fa;
|
|
color: #656d76;
|
|
border-color: #d0d7de;
|
|
}
|
|
|
|
[data-theme="light"] .table td,
|
|
.theme-light .table td {
|
|
border-color: #eaeef2;
|
|
color: #1f2328;
|
|
}
|
|
|
|
[data-theme="light"] .table tbody tr:hover,
|
|
.theme-light .table tbody tr:hover {
|
|
background: rgba(0, 0, 0, 0.02);
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════════════════
|
|
LIGHT THEME — Desktop Mode
|
|
═══════════════════════════════════════════════════════════════════════ */
|
|
|
|
.desktop-theme-light .desktop-topbar {
|
|
background: rgba(255, 255, 255, 0.85);
|
|
backdrop-filter: blur(20px);
|
|
-webkit-backdrop-filter: blur(20px);
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.08);
|
|
color: #1f2328;
|
|
}
|
|
|
|
.desktop-theme-light .topbar-clock {
|
|
color: #1f2328;
|
|
}
|
|
|
|
.desktop-theme-light .topbar-btn {
|
|
color: #656d76;
|
|
}
|
|
|
|
.desktop-theme-light .topbar-btn:hover {
|
|
background: rgba(0, 0, 0, 0.06);
|
|
color: #1f2328;
|
|
}
|
|
|
|
.desktop-theme-light .desktop-taskbar {
|
|
background: rgba(255, 255, 255, 0.85);
|
|
backdrop-filter: blur(20px);
|
|
-webkit-backdrop-filter: blur(20px);
|
|
border-top: 1px solid rgba(0, 0, 0, 0.08);
|
|
}
|
|
|
|
.desktop-theme-light .taskbar-item {
|
|
color: #656d76;
|
|
}
|
|
|
|
.desktop-theme-light .taskbar-item:hover {
|
|
background: rgba(0, 0, 0, 0.06);
|
|
color: #1f2328;
|
|
}
|
|
|
|
.desktop-theme-light .taskbar-item.active {
|
|
background: rgba(9, 105, 218, 0.1);
|
|
color: #0969da;
|
|
}
|
|
|
|
.desktop-theme-light .taskbar-clock {
|
|
color: #656d76;
|
|
}
|
|
|
|
.desktop-theme-light .app-drawer {
|
|
background: rgba(255, 255, 255, 0.95);
|
|
backdrop-filter: blur(24px);
|
|
-webkit-backdrop-filter: blur(24px);
|
|
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
color: #1f2328;
|
|
}
|
|
|
|
.desktop-theme-light .app-drawer-search input {
|
|
background: rgba(0, 0, 0, 0.04);
|
|
border-color: #d0d7de;
|
|
color: #1f2328;
|
|
}
|
|
|
|
.desktop-theme-light .app-tile {
|
|
color: #1f2328;
|
|
}
|
|
|
|
.desktop-theme-light .app-tile:hover {
|
|
background: rgba(0, 0, 0, 0.04);
|
|
}
|
|
|
|
.desktop-theme-light .app-category-label {
|
|
color: #656d76;
|
|
}
|
|
|
|
/* Desktop windows — light theme */
|
|
.desktop-theme-light .desktop-window {
|
|
background: rgba(255, 255, 255, 0.92);
|
|
border-color: rgba(0, 0, 0, 0.1);
|
|
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
|
|
}
|
|
|
|
.desktop-theme-light .window-titlebar {
|
|
background: rgba(246, 248, 250, 0.95);
|
|
border-bottom-color: rgba(0, 0, 0, 0.06);
|
|
color: #1f2328;
|
|
}
|
|
|
|
.desktop-theme-light .window-title {
|
|
color: #1f2328;
|
|
}
|
|
|
|
.desktop-theme-light .window-btn:hover {
|
|
background: rgba(0, 0, 0, 0.06);
|
|
}
|
|
|
|
/* Widget canvas — light theme */
|
|
.desktop-theme-light .widget-canvas {
|
|
scrollbar-color: rgba(0, 0, 0, 0.12) transparent;
|
|
}
|
|
|
|
.desktop-theme-light .widget {
|
|
background: rgba(255, 255, 255, 0.82);
|
|
backdrop-filter: blur(24px);
|
|
-webkit-backdrop-filter: blur(24px);
|
|
border-color: rgba(0, 0, 0, 0.08);
|
|
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
|
|
color: #1f2328;
|
|
}
|
|
|
|
.desktop-theme-light .widget:hover {
|
|
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
.desktop-theme-light .widget-header {
|
|
border-bottom-color: rgba(0, 0, 0, 0.05);
|
|
}
|
|
|
|
.desktop-theme-light .widget-title {
|
|
color: #1f2328;
|
|
}
|
|
|
|
.desktop-theme-light .widget-body {
|
|
color: #656d76;
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════════════════
|
|
AUTO THEME (OS preference)
|
|
═══════════════════════════════════════════════════════════════════════ */
|
|
|
|
@media (prefers-color-scheme: light) {
|
|
[data-theme="auto"] .sidebar-rail {
|
|
background: var(--sidebar-glass-bg-rail, rgba(255, 255, 255, 0.72));
|
|
border-right-color: #d0d7de;
|
|
}
|
|
|
|
[data-theme="auto"] .sidebar-flyout {
|
|
background: var(--sidebar-glass-bg-flyout, rgba(255, 255, 255, 0.82));
|
|
border-right-color: #d0d7de;
|
|
}
|
|
|
|
[data-theme="auto"] .navbar {
|
|
background: rgba(255, 255, 255, 0.9);
|
|
border-bottom-color: #d0d7de;
|
|
}
|
|
|
|
[data-theme="auto"] .content-wrapper {
|
|
background: #f6f8fa;
|
|
}
|
|
|
|
[data-theme="auto"] .card {
|
|
background: #ffffff;
|
|
border-color: #d0d7de;
|
|
}
|
|
}
|