admin/39384-vm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

2

Browse Source
This commit is contained in:
Flatlogic Bot 2026-03-30 11:27:33 +00:00
parent 1b842dbef6
commit e8fb7a1400
2 changed files with 117 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

229
assets/css/custom.css
View File

@ -1,26 +1,26 @@
:root { :root {
--bg: #f6f8fa; --bg: #f8f9fb;
--surface: #ffffff; --surface: #ffffff;
--surface-muted: #f6f8fa; --surface-muted: #fbfcfd;
--surface-soft: #fafff8; --surface-soft: #ffffff;
--border: #d0d7de; --border: #d8dee4;
--border-strong: #8c959f; --border-strong: #b8c0c8;
--text: #1f2328; --text: #1f2328;
--text-muted: #57606a; --text-muted: #5f6b76;
--text-soft: #6e7781; --text-soft: #7a8591;
--accent: #2da44e; --accent: #1f883d;
--accent-dark: #1f883d; --accent-dark: #176f32;
--accent-contrast: #ffffff; --accent-contrast: #ffffff;
--accent-blue: #0969da; --accent-blue: #0969da;
--accent-blue-soft: #ddf4ff; --accent-blue-soft: #f5f9ff;
--nav-bg: #0d1117; --nav-bg: #ffffff;
--nav-text: #f0f6fc; --nav-text: #1f2328;
--success: #1a7f37; --success: #1a7f37;
--danger: #cf222e; --danger: #cf222e;
--shadow: 0 1px 0 rgba(27, 31, 36, 0.04), 0 8px 24px rgba(140, 149, 159, 0.18); --shadow: 0 1px 2px rgba(31, 35, 40, 0.03);
--radius-sm: 10px; --radius-sm: 6px;
--radius-md: 14px; --radius-md: 10px;
--radius-lg: 18px; --radius-lg: 12px;
} }
html { html {
@ -28,36 +28,35 @@ html {
} }
body { body {
background: background: var(--bg);
radial-gradient(circle at top left, rgba(45, 164, 78, 0.08), transparent 26%),
radial-gradient(circle at top right, rgba(9, 105, 218, 0.08), transparent 22%),
var(--bg);
color: var(--text); color: var(--text);
font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;
font-size: 0.96rem;
} }
.app-header { .app-header {
background: rgba(13, 17, 23, 0.92); background: #ffffff;
backdrop-filter: blur(12px); backdrop-filter: none;
border-bottom-color: rgba(240, 246, 252, 0.08) !important; border-bottom-color: var(--border) !important;
} }
.navbar { .navbar {
min-height: 72px; min-height: 56px;
} }
.brand-mark { .brand-mark {
width: 36px; width: 30px;
height: 36px; height: 30px;
border-radius: 11px; border-radius: 8px;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background: linear-gradient(135deg, var(--accent) 0%, var(--accent-blue) 100%); background: #ffffff;
color: var(--accent-contrast); color: var(--text-muted);
font-size: 1rem; font-size: 0.95rem;
box-shadow: 0 10px 22px rgba(9, 105, 218, 0.22); border: 1px solid var(--border);
box-shadow: none;
} }
.brand-title { .brand-title {
@ -69,17 +68,15 @@ body {
} }
.brand-subtitle { .brand-subtitle {
color: rgba(240, 246, 252, 0.72); display: none !important;
font-size: 0.76rem;
line-height: 1.2;
} }
.panel { .panel {
background: rgba(255, 255, 255, 0.94); background: var(--surface);
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-lg); border-radius: var(--radius-lg);
box-shadow: var(--shadow); box-shadow: var(--shadow);
padding: 1.25rem; padding: 1rem;
} }
.panel-hero { .panel-hero {
@ -87,12 +84,12 @@ body {
} }
.eyebrow { .eyebrow {
color: var(--text-muted); color: var(--text-soft);
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.08em; letter-spacing: 0.08em;
font-size: 0.71rem; font-size: 0.68rem;
font-weight: 700; font-weight: 700;
margin-bottom: 0.85rem; margin-bottom: 0.5rem;
} }
.hero-title, .hero-title,
@ -118,10 +115,10 @@ body {
.status-badge { .status-badge {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
gap: 0.4rem; gap: 0.35rem;
padding: 0.42rem 0.7rem; padding: 0.34rem 0.62rem;
border-radius: 999px; border-radius: 999px;
font-size: 0.78rem; font-size: 0.75rem;
font-weight: 600; font-weight: 600;
border: 1px solid var(--border); border: 1px solid var(--border);
background: var(--surface-muted); background: var(--surface-muted);
@ -145,20 +142,24 @@ body {
position: absolute; position: absolute;
inset: 0 auto auto 0; inset: 0 auto auto 0;
width: 100%; width: 100%;
height: 4px; height: 1px;
background: linear-gradient(90deg, var(--accent), var(--accent-blue)); background: var(--border-strong);
}
.stat-card-total::before {
background: #8c959f;
} }
.stat-card-active::before { .stat-card-active::before {
background: linear-gradient(90deg, var(--accent-blue), #54aeff); background: var(--accent-blue);
} }
.stat-card-done::before { .stat-card-done::before {
background: linear-gradient(90deg, var(--accent), #7ee787); background: var(--accent);
} }
.stat-card-urgent::before { .stat-card-urgent::before {
background: linear-gradient(90deg, #fb8500, #f2cc60); background: #fb8500;
} }
.stat-label, .stat-label,
@ -185,15 +186,16 @@ body {
} }
.stat-note { .stat-note {
font-size: 0.85rem; font-size: 0.8rem;
color: var(--text-soft);
} }
.panel-header { .panel-header {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
gap: 1rem; gap: 0.75rem;
margin-bottom: 1rem; margin-bottom: 0.85rem;
} }
.panel-header-stack { .panel-header-stack {
@ -201,8 +203,8 @@ body {
} }
.panel-title { .panel-title {
font-size: 1.15rem; font-size: 1.05rem;
font-weight: 700; font-weight: 650;
} }
.form-control, .form-control,
@ -217,43 +219,44 @@ body {
.form-select, .form-select,
.input-group-text { .input-group-text {
border-color: var(--border); border-color: var(--border);
min-height: 46px; min-height: 42px;
background: #fff; background: #fff;
} }
.form-control:focus, .form-control:focus,
.form-select:focus { .form-select:focus {
border-color: var(--accent-blue); border-color: var(--accent-blue);
box-shadow: 0 0 0 0.2rem rgba(9, 105, 218, 0.14); box-shadow: 0 0 0 0.14rem rgba(9, 105, 218, 0.1);
} }
.btn { .btn {
font-weight: 600; font-weight: 600;
box-shadow: none !important; box-shadow: none !important;
border-width: 1px;
} }
.btn-dark { .btn-dark {
background: linear-gradient(180deg, #3fb950 0%, var(--accent) 100%); background: var(--accent);
border-color: var(--accent-dark); border-color: var(--accent);
color: var(--accent-contrast); color: var(--accent-contrast);
} }
.btn-dark:hover, .btn-dark:hover,
.btn-dark:focus { .btn-dark:focus {
background: linear-gradient(180deg, #2ea043 0%, var(--accent-dark) 100%); background: var(--accent-dark);
border-color: #1a7f37; border-color: var(--accent-dark);
color: var(--accent-contrast); color: var(--accent-contrast);
} }
.btn-light { .btn-light {
background: #f6f8fa; background: #fff;
border-color: var(--border); border-color: var(--border);
color: var(--text); color: var(--text);
} }
.btn-light:hover, .btn-light:hover,
.btn-light:focus { .btn-light:focus {
background: #eef2f6; background: #ffffff;
border-color: var(--border-strong); border-color: var(--border-strong);
color: var(--text); color: var(--text);
} }
@ -265,20 +268,21 @@ body {
.btn-filter { .btn-filter {
border: 1px solid var(--border); border: 1px solid var(--border);
background: var(--surface-muted); background: #fff;
color: var(--text); color: var(--text);
padding-inline: 0.9rem; padding-inline: 0.9rem;
} }
.btn-filter:hover { .btn-filter:hover {
border-color: var(--accent-blue); border-color: var(--border-strong);
color: var(--accent-blue); color: var(--text);
background: #ffffff;
} }
.btn-check:checked + .btn-filter { .btn-check:checked + .btn-filter {
background: var(--accent-blue-soft); background: #ffffff;
color: var(--accent-blue); color: var(--accent-blue);
border-color: #b6e3ff; border-color: #b7c7da;
} }
.sort-select { .sort-select {
@ -295,10 +299,10 @@ body {
position: relative; position: relative;
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
padding: 1rem; padding: 0.9rem;
background: #fff; background: #fff;
cursor: pointer; cursor: pointer;
transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease, background-color 0.18s ease; transition: border-color 0.16s ease, background-color 0.16s ease;
} }
.task-item:focus-visible { .task-item:focus-visible {
@ -308,46 +312,45 @@ body {
} }
.task-item:hover { .task-item:hover {
border-color: var(--accent-blue); border-color: var(--border-strong);
box-shadow: 0 12px 24px rgba(9, 105, 218, 0.08); box-shadow: none;
background: #fbfdff; background: #fff;
transform: translateY(-1px);
} }
.task-item-active { .task-item-active {
border-color: var(--accent-blue); border-color: #b6c8db;
box-shadow: inset 3px 0 0 var(--accent-blue), 0 0 0 1px rgba(9, 105, 218, 0.08); box-shadow: inset 2px 0 0 var(--accent-blue);
background: #f9fcff; background: #ffffff;
} }
.task-item-done { .task-item-done {
background: #f6fff8; background: #ffffff;
} }
.check-button { .check-button {
width: 38px; width: 34px;
height: 38px; height: 34px;
border-radius: 50%; border-radius: 8px;
border: 1px solid var(--border); border: 1px solid var(--border);
background: #fff; background: #fff;
color: var(--text-muted); color: var(--text-muted);
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 1.05rem; font-size: 1rem;
} }
.check-button:hover { .check-button:hover {
border-color: var(--accent); border-color: var(--accent);
color: var(--accent); color: var(--accent);
background: #f6fff8; background: #fff;
} }
.task-title-link { .task-title-link {
font-weight: 700; font-weight: 600;
color: var(--text); color: var(--text);
text-decoration: none; text-decoration: none;
font-size: 0.97rem; font-size: 0.96rem;
} }
.task-title-link:hover { .task-title-link:hover {
@ -357,7 +360,7 @@ body {
.task-snippet, .task-snippet,
.detail-description { .detail-description {
color: var(--text-muted); color: var(--text-muted);
line-height: 1.55; line-height: 1.5;
} }
.task-item-done .task-title-link, .task-item-done .task-title-link,
@ -378,38 +381,38 @@ body {
} }
.priority-high { .priority-high {
background: #fef2f2; background: #ffffff;
color: #991b1b; color: #b42318;
border-color: #fecaca; border-color: #f0c7c7;
} }
.priority-medium { .priority-medium {
background: #fff8c5; background: #ffffff;
color: #9a6700; color: #9a6700;
border-color: #eedb85; border-color: #ead9a2;
} }
.priority-low { .priority-low {
background: #dafbe1; background: #ffffff;
color: #1a7f37; color: #1a7f37;
border-color: #aceebb; border-color: #c9e7cf;
} }
.status-active { .status-active {
background: var(--accent-blue-soft); background: #ffffff;
color: var(--accent-blue); color: var(--accent-blue);
border-color: #b6e3ff; border-color: #c7d7ea;
} }
.status-done { .status-done {
background: #dafbe1; background: #ffffff;
color: var(--success); color: var(--success);
border-color: #aceebb; border-color: #c9e7cf;
} }
.icon-button { .icon-button {
width: 36px; width: 34px;
height: 36px; height: 34px;
padding: 0; padding: 0;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
@ -426,46 +429,46 @@ body {
} }
.detail-title { .detail-title {
font-size: 1.35rem; font-size: 1.2rem;
margin-bottom: 0.7rem; margin-bottom: 0.55rem;
} }
.detail-block { .detail-block {
padding: 0.9rem 1rem; padding: 0.8rem 0.9rem;
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
background: linear-gradient(180deg, #ffffff 0%, #f6f8fa 100%); background: #ffffff;
} }
.detail-value { .detail-value {
margin-top: 0.3rem; margin-top: 0.25rem;
font-weight: 600; font-weight: 500;
} }
.empty-state { .empty-state {
border: 1px dashed var(--border-strong); border: 1px solid var(--border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
background: linear-gradient(180deg, #ffffff 0%, #f6f8fa 100%); background: #ffffff;
padding: 1.25rem; padding: 1rem;
} }
.empty-icon { .empty-icon {
width: 54px; width: 42px;
height: 54px; height: 42px;
margin-inline: auto; margin-inline: auto;
border-radius: 50%; border-radius: 10px;
background: #fff; background: #fff;
border: 1px solid var(--border); border: 1px solid var(--border);
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 1.35rem; font-size: 1rem;
color: var(--text-muted); color: var(--text-muted);
} }
.toast { .toast {
border-radius: 12px; border-radius: 10px;
box-shadow: 0 18px 36px rgba(13, 17, 23, 0.16); box-shadow: 0 6px 14px rgba(31, 35, 40, 0.08);
} }
.stretched-link-reset { .stretched-link-reset {
@ -480,7 +483,7 @@ body {
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 10px; width: 8px;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
@ -503,7 +506,7 @@ body {
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
.panel, .panel,
.panel-hero { .panel-hero {
padding: 1rem; padding: 0.9rem;
} }
.hero-title { .hero-title {

2
index.php
View File

@ -362,7 +362,7 @@ $assetVersion = (string) @filemtime(__DIR__ . '/assets/css/custom.css');
<meta property="og:image" content="<?= h($projectImageUrl) ?>" /> <meta property="og:image" content="<?= h($projectImageUrl) ?>" />
<meta property="twitter:image" content="<?= h($projectImageUrl) ?>" /> <meta property="twitter:image" content="<?= h($projectImageUrl) ?>" />
<?php endif; ?> <?php endif; ?>
<meta name="theme-color" content="#0d1117" /> <meta name="theme-color" content="#ffffff" />
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">