Eskimue/skyview.astronomiemuseum.de
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

GUI verbessert

Browse Source
This commit is contained in:
Eskimue
2026-04-12 18:41:46 +02:00
parent ea9381f463
commit e93e2e3e6a
2 changed files with 93 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/astronomical_conversions.php
+42 -29
View File
@@ -118,31 +118,39 @@ $timeLocationLongitude = isset($currentLocation['longitude']) && is_numeric($cur
.astro-conv-tabs {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
gap: 0.5rem;
margin: 0 0 1.75rem;
border-bottom: 1px solid var(--border);
padding-bottom: 0;
}
.astro-conv-tab {
padding: 0.75rem 1rem;
border-radius: 999px;
border: 1px solid rgba(130, 170, 255, 0.18);
background: rgba(255,255,255,0.04);
color: #dce8ff;
border: 1px solid transparent;
border-bottom: none;
background: transparent;
color: var(--text-dim);
border-radius: var(--radius) var(--radius) 0 0;
padding: 0.6rem 1.25rem;
cursor: pointer;
font: inherit;
font-size: 0.92rem;
letter-spacing: 0.03em;
transition: color 0.15s, background 0.15s, border-color 0.15s;
position: relative;
bottom: -1px;
}
.astro-conv-tab:hover {
color: var(--gold-pale);
background: rgba(201, 168, 76, 0.06);
border-color: var(--border);
}
.astro-conv-tab.is-active {
background: linear-gradient(180deg, rgba(82, 153, 255, 0.28), rgba(49, 112, 255, 0.18));
border-color: rgba(130, 170, 255, 0.4);
color: #ffffff;
}
.astro-conv-panel {
padding: 1.2rem;
border-radius: 1rem;
background:
radial-gradient(circle at top left, rgba(82, 153, 255, 0.12), transparent 36%),
linear-gradient(180deg, rgba(13, 19, 33, 0.96), rgba(8, 11, 20, 0.98));
border: 1px solid rgba(130, 170, 255, 0.16);
color: var(--gold-pale);
background: var(--bg-card);
border-color: var(--border);
border-bottom-color: var(--bg-card);
}
.astro-conv-grid {
@@ -157,29 +165,30 @@ $timeLocationLongitude = isset($currentLocation['longitude']) && is_numeric($cur
}
.astro-conv-field label {
color: #c7d6f4;
color: var(--text-dim);
font-size: 0.94rem;
}
.astro-conv-label-help {
border-bottom: 1px dotted rgba(199, 214, 244, 0.45);
border-bottom: 1px dotted rgba(201, 168, 76, 0.4);
cursor: help;
}
.astro-conv-input {
width: 100%;
padding: 0.72rem 0.8rem;
border-radius: 0.8rem;
border: 1px solid rgba(255,255,255,0.12);
background: rgba(255,255,255,0.05);
color: #f8fbff;
border-radius: var(--radius);
border: 1px solid var(--border);
background: rgba(255,255,255,0.04);
color: var(--text);
font-size: 0.96rem;
font-family: inherit;
}
.astro-conv-input:focus {
outline: none;
border-color: rgba(130, 170, 255, 0.6);
box-shadow: 0 0 0 3px rgba(82, 153, 255, 0.16);
border-color: rgba(201, 168, 76, 0.5);
box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.1);
}
.astro-conv-field {
@@ -195,9 +204,9 @@ $timeLocationLongitude = isset($currentLocation['longitude']) && is_numeric($cur
max-width: 22rem;
padding: 0.7rem 0.8rem;
border-radius: 0.8rem;
background: rgba(10, 15, 27, 0.96);
border: 1px solid rgba(130, 170, 255, 0.2);
color: #eef4ff;
background: rgba(6, 8, 18, 0.97);
border: 1px solid var(--border);
color: var(--text);
font-size: 0.9rem;
line-height: 1.45;
white-space: pre-line;
@@ -228,6 +237,10 @@ $timeLocationLongitude = isset($currentLocation['longitude']) && is_numeric($cur
display: block;
}
.astro-conv-panel {
border-radius: 0 var(--radius) var(--radius) var(--radius);
}
@media (max-width: 960px) {
.astro-conv-grid {
grid-template-columns: 1fr;
public/css/style.css
+51 -3
View File
@@ -1630,9 +1630,28 @@ body.occ-page main > .container {
background: rgba(4, 6, 18, 0.85);
border-right: 1px solid rgba(200,168,75,.08);
}
.controls-panel::-webkit-scrollbar { width: 3px; }
.controls-panel::-webkit-scrollbar-track { background: transparent; }
.controls-panel::-webkit-scrollbar-thumb { background: rgba(200,168,75,.2); border-radius: 2px; }
.controls-panel {
scrollbar-width: thin;
scrollbar-color: rgba(201,168,76,0.45) rgba(201,168,76,0.05);
}
.controls-panel::-webkit-scrollbar {
width: 6px;
}
.controls-panel::-webkit-scrollbar-track {
background: rgba(201,168,76,0.04);
border-radius: 3px;
margin: 4px 0;
}
.controls-panel::-webkit-scrollbar-thumb {
background: linear-gradient(180deg, rgba(240,217,144,0.55), rgba(201,168,76,0.35));
border-radius: 3px;
box-shadow: 0 0 6px rgba(201,168,76,0.25);
transition: background .2s;
}
.controls-panel::-webkit-scrollbar-thumb:hover {
background: linear-gradient(180deg, rgba(240,217,144,0.85), rgba(201,168,76,0.65));
box-shadow: 0 0 10px rgba(201,168,76,0.45);
}
/* Einzelner Steuerungsblock */
.ctrl-block {
@@ -3800,7 +3819,28 @@ body.solarsystem-page main > .container {
gap: 1rem;
max-height: calc(100vh - 10rem);
overflow-y: auto;
overflow-x: hidden;
overscroll-behavior: contain;
scrollbar-width: thin;
scrollbar-color: rgba(201,168,76,0.45) rgba(201,168,76,0.05);
}
.solarsystem-sidebar::-webkit-scrollbar {
width: 6px;
}
.solarsystem-sidebar::-webkit-scrollbar-track {
background: rgba(201,168,76,0.04);
border-radius: 3px;
margin: 4px 0;
}
.solarsystem-sidebar::-webkit-scrollbar-thumb {
background: linear-gradient(180deg, rgba(240,217,144,0.55), rgba(201,168,76,0.35));
border-radius: 3px;
box-shadow: 0 0 6px rgba(201,168,76,0.25);
transition: background .2s;
}
.solarsystem-sidebar::-webkit-scrollbar-thumb:hover {
background: linear-gradient(180deg, rgba(240,217,144,0.85), rgba(201,168,76,0.65));
box-shadow: 0 0 10px rgba(201,168,76,0.45);
}
.solarsystem-sidebar-block {
@@ -4014,6 +4054,14 @@ body.solarsystem-page main > .container {
gap: 0.6rem;
}
.jupitersystem-page .solarsystem-button-grid {
justify-items: start;
}
.jupitersystem-page .solarsystem-button-grid .btn {
padding-inline: 1.1rem;
}
.solarsystem-sidebar .btn.is-active,
.solarsystem-sidebar .btn-secondary.is-active {
background: rgba(201, 168, 76, 0.16);