recorder.py aktualisiert
This commit is contained in:
+20
-91
@@ -820,99 +820,28 @@ a.button:hover {
|
||||
}
|
||||
|
||||
@media (max-width:800px) {
|
||||
body {
|
||||
padding: 12px;
|
||||
body { padding:12px; }
|
||||
.finished-table, .finished-table tbody, .finished-table tr, .finished-table td { display:block; }
|
||||
.finished-table { background:transparent; border:0; overflow:visible; }
|
||||
.finished-table thead { display:none; }
|
||||
.finished-table tbody { display:grid; gap:18px; }
|
||||
.finished-table tr { display:grid; grid-template-columns:1fr auto; grid-template-areas:"event date" "title title" "speaker speaker" "duration duration" "audio audio" "actions actions"; gap:0 12px; margin:0; padding:20px; background:var(--color-surface); border:1px solid var(--color-border); border-radius:20px; box-shadow:0 8px 24px var(--color-shadow); }
|
||||
.finished-table td { border:0; padding:0; min-width:0; }
|
||||
.finished-table td:nth-child(4) { grid-area:event; justify-self:start; align-self:start; padding:6px 10px; color:var(--color-primary-hover); background:var(--color-selection); border-radius:999px; font-size:12px; font-weight:700; line-height:1.2; }
|
||||
.finished-table td:nth-child(1) { grid-area:date; justify-self:end; align-self:center; color:var(--color-text-muted); font-size:12px; white-space:nowrap; }
|
||||
.finished-table td:nth-child(3) { grid-area:title; margin-top:16px; color:var(--color-text); font-size:20px; font-weight:750; line-height:1.25; }
|
||||
.finished-table td:nth-child(2) { grid-area:speaker; margin-top:6px; color:var(--color-text-muted); font-size:14px; font-weight:600; }
|
||||
.finished-table td:nth-child(5) { grid-area:duration; margin-top:16px; color:var(--color-text-muted); font-size:13px; }
|
||||
.finished-table td:nth-child(5)::before { content:"⏱ "; font-size:14px; }
|
||||
.finished-table td:nth-child(6) { grid-area:audio; margin-top:4px; }
|
||||
.finished-table td:nth-child(7) { grid-area:actions; margin-top:14px; padding-top:14px; border-top:1px solid var(--color-border-subtle); }
|
||||
.finished-table audio { width:100%; height:42px; margin:0; }
|
||||
.finished-table a.button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 16px; margin:0; border-radius:12px; }
|
||||
.live-panel { display:block; }
|
||||
.live-item + .live-item { border-left:0; border-top:1px solid var(--color-recording-border); padding-left:0; padding-top:16px; margin-top:16px; }
|
||||
a.button { margin-left:0; margin-right:8px; }
|
||||
}
|
||||
|
||||
.finished-table,
|
||||
.finished-table tbody,
|
||||
.finished-table tr,
|
||||
.finished-table td {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.finished-table {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.finished-table thead {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.finished-table tbody {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.finished-table tr {
|
||||
padding: 12px 14px;
|
||||
border: 1px solid var(--color-border);
|
||||
border-radius: 12px;
|
||||
background: var(--color-surface);
|
||||
box-shadow: 0 2px 8px var(--color-shadow);
|
||||
}
|
||||
|
||||
.finished-table td {
|
||||
display: grid;
|
||||
grid-template-columns: 92px minmax(0, 1fr);
|
||||
gap: 10px;
|
||||
align-items: baseline;
|
||||
border: 0;
|
||||
padding: 7px 0;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.finished-table td::before {
|
||||
color: var(--color-text-muted);
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: .04em;
|
||||
}
|
||||
|
||||
.finished-table td:nth-child(1)::before { content: "Zeitpunkt"; }
|
||||
.finished-table td:nth-child(2)::before { content: "Redner"; }
|
||||
.finished-table td:nth-child(3)::before { content: "Beschreibung"; }
|
||||
.finished-table td:nth-child(4)::before { content: "Veranstaltung"; }
|
||||
.finished-table td:nth-child(5)::before { content: "Dauer"; }
|
||||
.finished-table td:nth-child(6) {
|
||||
display: block;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.finished-table td:nth-child(6)::before {
|
||||
content: "Wiedergabe";
|
||||
display: block;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
.finished-table td:nth-child(7) {
|
||||
display: block;
|
||||
padding-top: 8px;
|
||||
border-top: 1px solid var(--color-border-subtle);
|
||||
margin-top: 4px;
|
||||
}
|
||||
.finished-table td:nth-child(7)::before { content: none; }
|
||||
|
||||
audio {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.live-panel {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.live-item + .live-item {
|
||||
border-left: 0;
|
||||
border-top: 1px solid var(--color-recording-border);
|
||||
padding-left: 0;
|
||||
padding-top: 16px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
a.button {
|
||||
margin-left: 0;
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
#dynamic-content {
|
||||
background: var(--color-surface-dark);
|
||||
|
||||
Reference in New Issue
Block a user