Crabmodus OK

This commit is contained in:
2026-05-20 08:47:10 +02:00
parent e0cbed612a
commit ced9da92a5
8 changed files with 2314 additions and 23 deletions
+624 -6
View File
@@ -347,6 +347,30 @@ h2 {
font-size: 0.96rem;
}
.admin_quick_link_card {
display: grid;
grid-template-columns: minmax(0, 1fr) 14rem;
gap: 0.9rem;
align-items: center;
padding: 0.95rem 1rem;
border-radius: var(--radius-md);
border: 1px solid var(--line);
background: var(--panel-strong);
}
.admin_quick_link_card p {
margin: 0.35rem 0 0;
color: var(--muted);
line-height: 1.35;
}
.admin_quick_link_button {
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none;
}
.admin_back {
color: var(--muted);
text-decoration: none;
@@ -433,6 +457,8 @@ h2 {
.admin-page {
color: #1b2730;
overflow-y: auto;
overflow-x: hidden;
background:
radial-gradient(circle at top left, rgba(150, 176, 183, 0.32), transparent 24%),
radial-gradient(circle at bottom right, rgba(221, 193, 144, 0.3), transparent 22%),
@@ -540,6 +566,19 @@ h2 {
background: linear-gradient(180deg, #cb6159, #922e28);
}
.admin-page .admin_quick_link_card {
border-color: rgba(116, 143, 152, 0.26);
background:
linear-gradient(180deg, rgba(244, 248, 248, 0.98), rgba(230, 237, 238, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.8),
0 8px 18px rgba(109, 126, 132, 0.08);
}
.admin-page .admin_quick_link_card p {
color: #617781;
}
.admin-page .admin_back {
font-family: Consolas, "Courier New", monospace;
font-size: 0.9rem;
@@ -591,6 +630,429 @@ h2 {
box-shadow: 0 0 0 2px rgba(211, 171, 59, 0.14), 0 0 10px rgba(211, 171, 59, 0.32);
}
.admin_motor_panel {
display: flex;
gap: 0.7rem;
min-height: auto;
overflow: visible;
}
.admin_motor_content {
display: grid;
gap: 0.7rem;
}
.motor_test_status_card {
display: grid;
gap: 0.35rem;
padding: 0.75rem 0.85rem;
border-radius: var(--radius-md);
border: 1px solid rgba(116, 143, 152, 0.26);
background:
linear-gradient(180deg, rgba(244, 248, 248, 0.98), rgba(230, 237, 238, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.8),
0 8px 18px rgba(109, 126, 132, 0.08);
}
.motor_test_status_row {
display: grid;
grid-template-columns: 6.5rem 1fr;
gap: 0.6rem;
align-items: center;
}
.motor_test_control_grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.55rem;
}
.motor_test_tabs {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.55rem;
}
.motor_test_tab_button {
min-height: 2.35rem;
padding: 0.45rem 0.7rem;
border: 1px solid rgba(116, 143, 152, 0.26);
border-radius: var(--radius-md);
background:
linear-gradient(180deg, rgba(244, 248, 248, 0.98), rgba(230, 237, 238, 0.98));
color: #24414e;
cursor: pointer;
font-family: Consolas, "Courier New", monospace;
font-size: 0.74rem;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.8),
0 8px 18px rgba(109, 126, 132, 0.08);
}
.motor_test_tab_button.is_active {
border-color: rgba(44, 102, 190, 0.58);
background:
linear-gradient(180deg, rgba(225, 236, 255, 0.98), rgba(205, 221, 247, 0.98));
color: #163650;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.9),
0 10px 24px rgba(70, 107, 166, 0.18);
}
.motor_test_tab_panel {
display: none;
}
.motor_test_tab_panel.is_active {
display: block;
}
.motor_test_layout_row {
display: grid;
grid-template-columns: minmax(0, 1.2fr) minmax(16rem, 0.9fr);
gap: 0.7rem;
align-items: stretch;
}
.motor_test_box {
min-height: 0;
padding: 0.75rem 0.85rem;
border-radius: var(--radius-md);
border: 1px solid rgba(116, 143, 152, 0.26);
background:
linear-gradient(180deg, rgba(244, 248, 248, 0.98), rgba(230, 237, 238, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.8),
0 8px 18px rgba(109, 126, 132, 0.08);
}
.wheel_selector {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.45rem;
}
.wheel_option {
position: relative;
display: flex;
align-items: center;
min-height: 2.65rem;
padding: 0.48rem 0.7rem;
border-radius: var(--radius-md);
border: 1px solid rgba(116, 143, 152, 0.28);
background:
linear-gradient(180deg, rgba(244, 248, 248, 0.98), rgba(230, 237, 238, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.82),
0 8px 18px rgba(109, 126, 132, 0.08);
cursor: pointer;
font-weight: 700;
}
.wheel_option input {
position: absolute;
opacity: 0;
pointer-events: none;
}
.wheel_option span {
color: #17303b;
font-size: 0.82rem;
}
.wheel_option:has(input:checked) {
border-color: rgba(44, 102, 190, 0.58);
background:
linear-gradient(180deg, rgba(225, 236, 255, 0.98), rgba(205, 221, 247, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.9),
0 10px 24px rgba(70, 107, 166, 0.18);
}
.motor_test_grid {
display: grid;
grid-template-columns: 1fr;
gap: 0.45rem;
}
.motor_test_grid .button {
min-height: 2.65rem;
font-size: 0.76rem;
}
.motor_test_neutral_box {
padding: 0.75rem 0.85rem;
border-radius: var(--radius-md);
border: 1px solid rgba(116, 143, 152, 0.26);
background:
linear-gradient(180deg, rgba(244, 248, 248, 0.98), rgba(230, 237, 238, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.8),
0 8px 18px rgba(109, 126, 132, 0.08);
}
.motor_test_neutral_copy {
margin-top: -0.1rem;
}
.motor_test_neutral_toolbar {
display: grid;
grid-template-columns: repeat(2, minmax(0, 12rem));
gap: 0.55rem;
justify-content: start;
}
.motor_test_neutral_toolbar .button {
width: auto;
min-height: 2.35rem;
padding: 0.5rem 0.9rem;
font-size: 0.74rem;
}
.motor_test_neutral_toolbar .button:disabled {
cursor: not-allowed;
filter: saturate(0.3);
opacity: 0.6;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.22),
0 4px 10px rgba(96, 110, 117, 0.08);
}
.steering_neutral_grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.65rem;
}
.steering_neutral_card {
display: grid;
gap: 0.55rem;
padding: 0.8rem;
border-radius: var(--radius-md);
border: 1px solid rgba(116, 143, 152, 0.26);
background:
linear-gradient(180deg, rgba(248, 251, 251, 0.98), rgba(233, 239, 240, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.84),
0 8px 18px rgba(109, 126, 132, 0.08);
}
.steering_neutral_card.is_dirty {
border-color: rgba(214, 145, 42, 0.52);
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.84),
0 8px 18px rgba(185, 133, 49, 0.14);
}
.drive_neutral_card {
display: grid;
gap: 0.55rem;
max-width: 28rem;
padding: 0.8rem;
border-radius: var(--radius-md);
border: 1px solid rgba(116, 143, 152, 0.26);
background:
linear-gradient(180deg, rgba(248, 251, 251, 0.98), rgba(233, 239, 240, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.84),
0 8px 18px rgba(109, 126, 132, 0.08);
}
.drive_neutral_card.is_dirty {
border-color: rgba(214, 145, 42, 0.52);
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.84),
0 8px 18px rgba(185, 133, 49, 0.14);
}
.drive_neutral_value_row {
max-width: 16rem;
}
.steering_neutral_card_header {
display: grid;
gap: 0.18rem;
}
.steering_neutral_value_row {
display: grid;
grid-template-columns: 2.8rem minmax(0, 1fr) 2.8rem;
gap: 0.45rem;
align-items: center;
}
.steering_neutral_value {
text-align: center;
font-family: Consolas, "Courier New", monospace;
font-size: 1.25rem;
}
.steering_neutral_adjust {
width: auto;
min-height: 2.8rem;
min-width: 2.8rem;
padding: 0.25rem;
font-size: 1.1rem;
line-height: 1;
}
.steering_neutral_meta {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.55rem;
color: #5f7981;
font-family: Consolas, "Courier New", monospace;
font-size: 0.72rem;
}
.motor_test_feedback_box {
padding: 0.75rem 0.85rem;
border-radius: var(--radius-md);
border: 1px solid rgba(116, 143, 152, 0.26);
background:
linear-gradient(180deg, rgba(244, 248, 248, 0.98), rgba(230, 237, 238, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.8),
0 8px 18px rgba(109, 126, 132, 0.08);
}
.motor_test_feedback_card {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 0.7rem;
align-items: center;
}
.motor_test_feedback_summary {
display: grid;
gap: 0.3rem;
}
.motor_test_feedback_buttons {
display: grid;
grid-template-columns: repeat(2, minmax(6rem, 1fr));
gap: 0.5rem;
}
.motor_test_feedback_buttons .button {
min-height: 2.6rem;
font-size: 0.76rem;
}
.motor_test_feedback_buttons .button:disabled {
cursor: not-allowed;
filter: saturate(0.3);
opacity: 0.6;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.22),
0 4px 10px rgba(96, 110, 117, 0.08);
}
.motor_test_hold_box {
padding: 0.75rem 0.85rem;
border-radius: var(--radius-md);
border: 1px solid rgba(116, 143, 152, 0.26);
background:
linear-gradient(180deg, rgba(244, 248, 248, 0.98), rgba(230, 237, 238, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.8),
0 8px 18px rgba(109, 126, 132, 0.08);
}
.motor_test_hold_layout {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.7rem;
}
.motor_test_hold_card {
display: grid;
gap: 0.45rem;
}
.motor_test_hold_buttons {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.45rem;
}
.motor_test_hold_buttons .button {
min-height: 2.6rem;
font-size: 0.74rem;
}
.motor_test_percent_box {
padding: 0.75rem 0.85rem;
border-radius: var(--radius-md);
border: 1px solid rgba(116, 143, 152, 0.26);
background:
linear-gradient(180deg, rgba(244, 248, 248, 0.98), rgba(230, 237, 238, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.8),
0 8px 18px rgba(109, 126, 132, 0.08);
}
.motor_test_percent_card {
display: grid;
gap: 0.55rem;
}
.motor_test_percent_header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
}
.motor_test_percent_live_row {
display: grid;
grid-template-columns: 1fr auto;
gap: 0.6rem;
align-items: center;
}
.motor_test_live_toggle {
min-width: 4.6rem;
min-height: 2.2rem;
padding: 0.35rem 0.7rem;
font-size: 0.72rem;
}
.motor_test_percent_slider_row {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 0.6rem;
align-items: center;
}
.motor_test_percent_slider {
width: 100%;
accent-color: #3271da;
}
.motor_test_percent_buttons {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.45rem;
}
.motor_test_percent_buttons .button {
min-height: 2.6rem;
font-size: 0.74rem;
}
.admin_link_row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.6rem;
}
@media (max-width: 1100px) {
body {
overflow-y: auto;
@@ -613,6 +1075,10 @@ h2 {
grid-template-columns: 1fr;
}
.admin_quick_link_card {
grid-template-columns: 1fr;
}
.admin_actions {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
@@ -621,8 +1087,40 @@ h2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.wheel_selector {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.motor_test_control_grid {
grid-template-columns: 1fr;
}
.motor_test_tabs {
grid-template-columns: 1fr;
}
.motor_test_layout_row {
grid-template-columns: 1fr;
}
.steering_neutral_grid {
grid-template-columns: 1fr;
}
.motor_test_feedback_card {
grid-template-columns: 1fr;
}
.motor_test_hold_layout {
grid-template-columns: 1fr;
}
.motor_test_percent_buttons {
grid-template-columns: 1fr;
}
.button {
min-height: 5.25rem;
min-height: 4rem;
}
}
@@ -693,6 +1191,38 @@ h2 {
.admin_actions {
grid-template-columns: 1fr;
}
.wheel_selector,
.motor_test_grid,
.motor_test_control_grid,
.motor_test_tabs,
.motor_test_neutral_toolbar,
.motor_test_feedback_buttons,
.motor_test_hold_buttons,
.motor_test_percent_buttons {
grid-template-columns: 1fr;
}
.steering_neutral_grid {
grid-template-columns: 1fr;
}
.motor_test_status_row {
grid-template-columns: 1fr;
gap: 0.25rem;
}
.motor_test_percent_header,
.motor_test_percent_live_row,
.motor_test_percent_slider_row {
grid-template-columns: 1fr;
justify-content: flex-start;
}
.admin_link_row {
flex-direction: column;
align-items: flex-start;
}
}
@media (max-height: 760px) and (min-width: 761px) {
@@ -706,19 +1236,107 @@ h2 {
}
.admin_panel {
gap: 0.7rem;
gap: 0.45rem;
}
.admin_copy {
font-size: 0.86rem;
font-size: 0.78rem;
}
.admin_motor_content {
gap: 0.45rem;
}
.admin_section {
gap: 0.35rem;
}
.panel_header {
gap: 0.45rem;
}
.pilot_logo {
width: 3.2rem;
}
.status_badge {
padding: 0.45rem 0.7rem;
font-size: 0.76rem;
}
.eyebrow {
margin: 0 0 0.2rem;
font-size: 0.68rem;
}
h1 {
font-size: 1.45rem;
}
.motor_test_status_card,
.motor_test_box,
.motor_test_neutral_box,
.motor_test_feedback_box,
.motor_test_hold_box,
.motor_test_percent_box {
padding: 0.58rem 0.7rem;
}
.motor_test_status_row {
grid-template-columns: 5.4rem 1fr;
gap: 0.45rem;
}
.wheel_option {
min-height: 2.35rem;
padding: 0.4rem 0.55rem;
}
.wheel_option span {
font-size: 0.76rem;
}
.motor_test_grid .button,
.motor_test_tab_button,
.motor_test_neutral_toolbar .button,
.motor_test_feedback_buttons .button,
.motor_test_hold_buttons .button,
.motor_test_control_grid .button,
.motor_test_percent_buttons .button {
min-height: 2.35rem;
font-size: 0.7rem;
}
.steering_neutral_adjust {
min-height: 2.35rem;
min-width: 2.35rem;
font-size: 1.05rem;
}
.motor_test_live_toggle {
min-height: 2.1rem;
min-width: 4rem;
font-size: 0.68rem;
}
.motor_test_control_grid,
.motor_test_layout_row,
.motor_test_feedback_card,
.motor_test_hold_layout,
.motor_test_hold_buttons,
.motor_test_feedback_buttons,
.motor_test_percent_buttons,
.wheel_selector,
.motor_test_grid {
gap: 0.35rem;
}
.admin_actions .button {
min-height: 3.35rem;
font-size: 0.9rem;
min-height: 2.8rem;
font-size: 0.82rem;
}
.info_card {
padding: 0.7rem 0.8rem;
padding: 0.6rem 0.7rem;
}
}