trevor/drivers_bot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
VPN SaaS Dev
2026-05-12 03:52:13 +09:00
commit d93c88c751
44 changed files with 4108 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1102
web/static/app.js Normal file
View File

File diff suppressed because it is too large Load Diff

5
web/static/icon.svg Normal file
View File

@@ -0,0 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" role="img" aria-label="Гараж">
<rect width="512" height="512" rx="108" fill="#16806a"/>
<path fill="#ffffff" d="M126 283h260l-22-76c-7-23-25-37-49-37H197c-24 0-42 14-49 37l-22 76Zm63-78h134c9 0 15 5 18 14l10 34H161l10-34c3-9 9-14 18-14Z"/>
<path fill="#dff3ec" d="M101 277c0-13 10-23 23-23h264c13 0 23 10 23 23v68c0 13-10 23-23 23h-15v17c0 12-10 22-22 22h-24c-12 0-22-10-22-22v-17h-98v17c0 12-10 22-22 22h-24c-12 0-22-10-22-22v-17h-15c-13 0-23-10-23-23v-68Zm58 57a30 30 0 1 0 0-60 30 30 0 0 0 0 60Zm194 0a30 30 0 1 0 0-60 30 30 0 0 0 0 60Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 623 B

878
web/static/styles.css Normal file
View File

@@ -0,0 +1,878 @@
:root {
color-scheme: light;
--bg: #eef3f1;
--text: #18211f;
--muted: #73807b;
--line: #d8e1de;
--surface: #ffffff;
--soft: #f7faf8;
--accent: #16806a;
--accent-2: #3f7fba;
--fuel: #36a388;
--service: #3f7fba;
--danger: #b5473e;
--shadow: 0 14px 40px rgba(24, 33, 31, 0.08);
}
.top-actions {
display: flex;
gap: 8px;
}
.ghost-btn {
min-height: 34px;
padding: 0 12px;
background: #edf3f0;
color: var(--accent);
box-shadow: none;
}
.progress-strip {
display: grid;
grid-template-columns: 150px 1fr;
gap: 10px 14px;
align-items: center;
padding: 12px;
margin-bottom: 14px;
border: 1px solid var(--line);
border-radius: 8px;
background: #f5faf8;
}
.progress-strip span,
.progress-strip small {
color: var(--muted);
}
.progress-strip strong {
display: block;
margin-top: 2px;
}
.progress-strip small {
grid-column: 2;
}
.progress-track {
height: 10px;
overflow: hidden;
border-radius: 999px;
background: #e3ebe7;
}
.progress-track span {
display: block;
width: 0;
height: 100%;
border-radius: inherit;
background: linear-gradient(90deg, var(--accent), var(--accent-2));
transition: width 360ms ease;
}
.stat {
display: grid;
width: 100%;
color: var(--text);
text-align: left;
box-shadow: none;
}
.quick-actions {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 10px;
margin-bottom: 14px;
}
.action-card {
display: grid;
gap: 4px;
min-height: 72px;
color: var(--text);
text-align: left;
background: var(--soft);
border: 1px solid var(--line);
box-shadow: none;
}
.action-card span {
color: var(--muted);
}
.action-card.active {
color: #fff;
background: var(--accent);
border-color: var(--accent);
}
.action-card.active span {
color: rgba(255, 255, 255, 0.78);
}
.preset-row {
display: flex;
gap: 8px;
align-items: end;
flex-wrap: wrap;
}
.preset-row button {
min-height: 36px;
padding: 0 12px;
background: #edf3f0;
color: var(--text);
box-shadow: none;
}
.drawer,
.report-sheet {
position: fixed;
inset: 0;
z-index: 20;
display: grid;
align-items: end;
background: rgba(17, 25, 22, 0.32);
backdrop-filter: blur(5px);
}
.drawer.hidden,
.report-sheet.hidden {
display: none;
}
.drawer-panel,
.sheet-panel {
max-height: 88vh;
overflow: auto;
padding: 18px;
border-radius: 16px 16px 0 0;
background: var(--surface);
box-shadow: 0 -18px 50px rgba(24, 33, 31, 0.18);
animation: sheetUp 220ms ease both;
}
.drawer-panel {
width: min(520px, 100%);
margin-left: auto;
}
.drawer-section {
margin-top: 14px;
padding-top: 14px;
border-top: 1px solid var(--line);
}
.drawer-form {
grid-template-columns: 1fr;
margin-top: 12px;
}
.menu-row {
display: block;
width: 100%;
margin-bottom: 8px;
background: var(--soft);
color: var(--text);
text-align: left;
border: 1px solid var(--line);
box-shadow: none;
}
.wide-btn {
width: 100%;
margin-top: 10px;
}
.scan-actions {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 8px;
}
.scan-actions button {
width: 100%;
}
.hidden-file {
position: absolute;
width: 1px;
height: 1px;
opacity: 0;
pointer-events: none;
}
.file-hint {
min-height: 42px;
display: flex;
align-items: center;
color: var(--muted);
font-size: 13px;
word-break: break-word;
}
.sheet-panel {
width: min(720px, 100%);
margin: 0 auto;
}
.report-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 10px;
margin-bottom: 12px;
}
.report-metric,
.tip-card {
padding: 12px;
border: 1px solid var(--line);
border-radius: 8px;
background: var(--soft);
}
.report-metric span {
display: block;
color: var(--muted);
font-size: 12px;
}
.report-metric strong {
display: block;
margin-top: 6px;
font-size: 20px;
}
.report-records {
max-height: 360px;
overflow: auto;
}
@keyframes sheetUp {
from {
transform: translateY(24px);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
@media (max-width: 980px) {
.shell {
padding: 14px 12px 96px;
}
.hero-grid {
display: flex;
overflow-x: auto;
scroll-snap-type: x mandatory;
padding-bottom: 2px;
}
.summary-card {
min-width: 78vw;
scroll-snap-align: start;
}
.cars {
display: flex;
overflow-x: auto;
padding-bottom: 2px;
}
.car-item {
min-width: 230px;
}
.quick-actions {
position: sticky;
top: 0;
z-index: 5;
grid-template-columns: repeat(3, minmax(0, 1fr));
padding: 6px 0;
background: rgba(238, 243, 241, 0.92);
backdrop-filter: blur(8px);
}
.action-card {
min-height: 58px;
padding: 8px;
}
.progress-strip,
.report-grid {
grid-template-columns: 1fr;
}
.progress-strip small {
grid-column: auto;
}
}
@media (max-width: 980px) {
.shell {
padding: 14px 12px 96px;
}
.hero-grid {
display: flex;
overflow-x: auto;
scroll-snap-type: x mandatory;
padding-bottom: 2px;
}
.summary-card {
min-width: 78vw;
scroll-snap-align: start;
}
.cars {
display: flex;
overflow-x: auto;
padding-bottom: 2px;
}
.car-item {
min-width: 230px;
}
.quick-actions {
position: sticky;
top: 0;
z-index: 5;
grid-template-columns: repeat(3, minmax(0, 1fr));
padding: 6px 0;
background: rgba(238, 243, 241, 0.92);
backdrop-filter: blur(8px);
}
.action-card {
min-height: 58px;
padding: 8px;
}
.progress-strip,
.report-grid {
grid-template-columns: 1fr;
}
.progress-strip small {
grid-column: auto;
}
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(238, 243, 241, 0)),
var(--bg);
color: var(--text);
font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
button,
input,
select {
font: inherit;
}
button {
border: 0;
background: var(--accent);
color: #fff;
min-height: 42px;
border-radius: 7px;
padding: 0 16px;
cursor: pointer;
transition:
transform 160ms ease,
box-shadow 160ms ease,
background 160ms ease,
border-color 160ms ease;
}
button:hover {
transform: translateY(-1px);
box-shadow: 0 10px 24px rgba(22, 128, 106, 0.18);
}
button:active {
transform: translateY(0) scale(0.99);
}
button:disabled {
opacity: 0.55;
}
.shell {
width: min(1200px, 100%);
margin: 0 auto;
padding: 18px;
}
.topbar {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
padding: 8px 0 18px;
}
.eyebrow {
margin: 0;
color: var(--accent-2);
font-size: 13px;
font-weight: 800;
text-transform: uppercase;
}
h1,
h2 {
margin: 0;
letter-spacing: 0;
}
h1 {
font-size: clamp(30px, 4vw, 42px);
}
h2 {
font-size: 18px;
}
.icon-btn {
width: 44px;
padding: 0;
background: var(--surface);
color: var(--text);
border: 1px solid var(--line);
box-shadow: none;
}
.loading .icon-btn {
animation: spin 800ms linear infinite;
}
.hero-grid {
display: grid;
grid-template-columns: 1.25fr 1fr 1fr;
gap: 12px;
margin-bottom: 16px;
}
.summary-card,
.band,
.panel,
.workspace,
.chart-card {
background: rgba(255, 255, 255, 0.92);
border: 1px solid var(--line);
border-radius: 8px;
box-shadow: var(--shadow);
}
.summary-card {
display: grid;
gap: 6px;
min-height: 112px;
padding: 16px;
overflow: hidden;
position: relative;
animation: rise 420ms ease both;
}
.summary-card::after {
content: "";
position: absolute;
inset: auto -20px -30px auto;
width: 130px;
height: 90px;
background: rgba(54, 163, 136, 0.12);
transform: rotate(-14deg);
}
.summary-card.accent::after {
background: rgba(54, 163, 136, 0.16);
}
.summary-card.blue::after {
background: rgba(63, 127, 186, 0.15);
}
.summary-card span,
.summary-card small,
.stat span,
.stat em {
color: var(--muted);
}
.summary-card strong {
font-size: clamp(22px, 4vw, 31px);
line-height: 1.05;
z-index: 1;
}
.summary-card small {
z-index: 1;
}
.band {
padding: 14px;
margin-bottom: 16px;
}
.section-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-bottom: 12px;
}
.grid-form,
.entry-form {
display: grid;
grid-template-columns: 1.1fr 1fr 1fr 120px auto;
gap: 12px;
align-items: end;
}
label {
display: grid;
gap: 6px;
color: var(--muted);
font-size: 13px;
}
input,
select {
width: 100%;
min-height: 42px;
border: 1px solid var(--line);
border-radius: 7px;
background: #fff;
color: var(--text);
padding: 0 11px;
transition:
border-color 160ms ease,
box-shadow 160ms ease,
transform 160ms ease;
}
input:focus,
select:focus {
outline: none;
border-color: var(--accent);
box-shadow: 0 0 0 4px rgba(22, 128, 106, 0.12);
}
select:disabled {
background: #f1f5f3;
color: #9aa4a0;
}
.layout {
display: grid;
grid-template-columns: 310px 1fr;
gap: 16px;
align-items: start;
}
.panel,
.workspace {
padding: 16px;
}
.report-bar {
display: flex;
align-items: end;
justify-content: space-between;
gap: 14px;
margin-bottom: 14px;
padding-bottom: 14px;
border-bottom: 1px solid var(--line);
}
.report-bar .eyebrow {
margin-bottom: 2px;
}
.period-controls {
display: grid;
grid-template-columns: 140px 150px 150px;
gap: 8px;
align-items: center;
}
.panel {
position: sticky;
top: 12px;
}
.cars {
display: grid;
gap: 9px;
}
.car-item {
display: grid;
grid-template-columns: 42px 1fr;
align-items: center;
gap: 10px;
width: 100%;
min-height: 64px;
background: var(--soft);
color: var(--text);
text-align: left;
border: 1px solid transparent;
box-shadow: none;
}
.car-item small {
display: block;
margin-top: 2px;
color: var(--muted);
}
.car-item.active {
border-color: rgba(22, 128, 106, 0.48);
background: #e5f4ef;
}
.car-badge {
display: grid;
place-items: center;
width: 42px;
height: 42px;
border-radius: 50%;
background: #d7ebe5;
color: #11634f;
font-size: 13px;
font-weight: 800;
}
.stats {
display: grid;
grid-template-columns: repeat(4, minmax(120px, 1fr));
gap: 10px;
margin-bottom: 14px;
}
.stat {
border: 1px solid var(--line);
border-radius: 8px;
padding: 12px;
min-height: 92px;
background: var(--soft);
}
.stat strong {
display: block;
margin-top: 6px;
font-size: 22px;
}
.stat em {
display: block;
margin-top: 4px;
font-size: 12px;
font-style: normal;
}
.pop {
animation: pop 260ms ease both;
}
.charts {
display: grid;
grid-template-columns: minmax(0, 1fr) 300px;
gap: 12px;
margin-bottom: 14px;
}
.chart-card {
min-height: 320px;
padding: 14px;
box-shadow: none;
}
.chart-card canvas {
display: block;
width: 100%;
height: 250px;
}
.chart-card.compact {
min-width: 0;
}
.tabs {
display: flex;
gap: 8px;
margin-bottom: 12px;
padding: 4px;
width: fit-content;
background: #edf2ef;
border-radius: 8px;
}
.tab {
background: transparent;
color: var(--text);
box-shadow: none;
}
.tab:hover {
box-shadow: none;
}
.tab.active {
background: var(--accent-2);
color: #fff;
}
.entry-form {
grid-template-columns: repeat(3, minmax(140px, 1fr));
border-top: 1px solid var(--line);
padding-top: 14px;
animation: fade 180ms ease both;
}
.check {
display: flex;
align-items: center;
gap: 8px;
min-height: 42px;
}
.check input {
width: 18px;
min-height: 18px;
accent-color: var(--accent);
}
.hidden {
display: none;
}
.history {
margin-top: 20px;
border-top: 1px solid var(--line);
padding-top: 16px;
}
.record {
display: grid;
grid-template-columns: 110px 1fr auto;
gap: 12px;
padding: 12px 0;
border-bottom: 1px solid var(--line);
align-items: center;
animation: fade 220ms ease both;
}
.record small {
color: var(--muted);
}
.record .fuel {
color: var(--fuel);
}
.record .service {
color: var(--service);
}
.empty {
color: var(--muted);
padding: 18px 0;
}
.error {
margin: 12px auto;
width: min(920px, calc(100% - 24px));
padding: 12px 14px;
border-radius: 8px;
background: #fff1ef;
border: 1px solid #f0c8c1;
color: var(--danger);
}
.reveal {
animation: rise 360ms ease both;
}
@keyframes rise {
from {
opacity: 0;
transform: translateY(10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes fade {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes pop {
0% {
opacity: 0;
transform: scale(0.98);
}
100% {
opacity: 1;
transform: scale(1);
}
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
@media (max-width: 980px) {
.hero-grid,
.layout,
.charts,
.grid-form,
.entry-form,
.stats,
.period-controls {
grid-template-columns: 1fr;
}
.report-bar {
align-items: stretch;
flex-direction: column;
}
.panel {
position: static;
}
.tabs {
width: 100%;
}
.tab {
flex: 1;
}
.record {
grid-template-columns: 1fr;
}
}