move assets to new location

This commit is contained in:
stefan.tollkuehn committed 2026-10-07 16:27:12 +02:00
1 parent 42464bc72e
commit 3dd0b8d496
12 files changed
+527 -528

No files matched your search

+9 -522
View File
@@ -5,523 +5,10 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Jitsi Meeting</title>
<link rel='shortlink' href='https://meet.bnvb.eu/' />
<link href="https://meet.bnvb.eu/assets/favicon.ico" rel="alternate icon">
<link href="https://meet.bnvb.eu/assets/apple-touch-icon.png" rel="apple-touch-icon" sizes="180x180">
<link href="https://meet.bnvb.eu/assets/favicon.svg" rel="icon" type="image/svg+xml">
<style>
:root {
color-scheme: light;
}
:root.dark {
color-scheme: dark;
}
body {
margin: 0;
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
background: #f5f5f5;
color: #222;
}
.container {
display: flex;
flex-direction: column;
align-items: center;
width: min(700px, calc(100% - 32px));
}
.navbar {
position: fixed;
top: 16px;
left: 2%;
width: 96%;
box-sizing: border-box;
z-index: 100;
display: flex;
align-items: center;
gap: 8px;
padding: 15px;
background: rgba(255, 255, 255, 0.2);
-webkit-backdrop-filter: blur(7px);
backdrop-filter: blur(7px);
border-radius: 14px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.30), 0 12px 40px rgba(0, 0, 0, 0.45);
}
.logo-bar {
display: flex;
align-items: center;
flex: 0 1 auto;
min-width: 0;
}
.logo-bar img {
display: block;
height: 60px;
max-width: 100%;
width: auto;
}
.nav-actions {
display: flex;
align-items: center;
flex-wrap: wrap;
justify-content: flex-end;
gap: 8px;
margin-left: auto;
}
/* Hamburger: nur im Phone-Portrait sichtbar.
* "button.nav-toggle" ist spezifischer als ".button",
* sonst überschreibt display: inline-block diese Regel. */
button.nav-toggle {
display: none;
}
/* Enger als der globale 6px-Margin der Buttons */
.navbar .button {
margin: 0;
}
.lang-menu {
position: relative;
}
.lang-dropdown {
display: none;
position: absolute;
right: 0;
top: 100%;
min-width: 150px;
margin-top: 6px;
padding: 6px;
background: white;
border-radius: 10px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}
.lang-dropdown.open {
display: block;
}
.lang-dropdown button {
display: block;
width: 100%;
margin: 0;
padding: 10px 14px;
border: 0;
border-radius: 6px;
background: none;
text-align: left;
font-size: 14px;
font-family: inherit;
cursor: pointer;
}
.lang-dropdown button:hover {
background: #f0f0f0;
}
.lang-dropdown button.active {
font-weight: 600;
background: #f0f8ff;
}
.lang-flag {
width: 20px;
height: 13px;
margin-right: 6px;
border-radius: 2px;
vertical-align: -2px;
}
.card {
box-sizing: border-box;
width: min(600px, 100%);
padding: 32px;
background: rgba(255, 255, 255, 0.2);
-webkit-backdrop-filter: blur(7px);
backdrop-filter: blur(7px);
border-radius: 14px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.30), 0 12px 40px rgba(0, 0, 0, 0.45);
text-align: center;
}
h1 {
margin-top: 0;
}
p {
color: #555;
}
button, .button {
display: inline-block;
border: 0;
border-radius: 8px;
padding: 12px 20px;
margin: 6px;
font-size: 16px;
font-family: inherit;
cursor: pointer;
text-decoration: none;
}
.primary {
background: #1f73e8;
color: white;
}
.secondary {
background: #e9e9e9;
color: #222;
}
.hidden {
display: none !important;
}
.status {
margin-top: 24px;
padding: 16px;
border-radius: 8px;
background: #f0f0f0;
}
.spinner {
display: inline-block;
width: 16px;
height: 16px;
margin-right: 8px;
border: 2px solid #ccc;
border-top-color: #333;
border-radius: 50%;
animation: spin 0.7s linear infinite;
vertical-align: -3px;
}
.download {
margin-top: 24px;
padding: 20px;
border-radius: 8px;
background: #f5f5f5;
}
.room {
font-family: monospace;
word-break: break-all;
}
.error {
padding: 16px;
border-radius: 8px;
background: #fff0f0;
color: #900;
}
.form-group {
margin-bottom: 16px;
text-align: left;
}
.form-group label {
display: block;
margin-bottom: 4px;
font-weight: 500;
color: #333;
}
.form-group input,
.form-group textarea {
width: 100%;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 6px;
font-size: 14px;
box-sizing: border-box;
}
.form-group textarea {
min-height: 80px;
resize: vertical;
}
.form-actions {
margin-top: 24px;
display: flex;
gap: 12px;
justify-content: center;
flex-wrap: wrap;
}
.success-message {
margin-top: 24px;
padding: 16px;
border-radius: 8px;
background: #f0f8ff;
color: #0066cc;
}
.adhoc-result {
margin-top: 24px;
padding: 16px;
border-radius: 8px;
background: #f0fff4;
color: #1a7f37;
}
.adhoc-link {
margin-top: 12px;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
flex-wrap: wrap;
}
.adhoc-link a {
font-family: monospace;
word-break: break-all;
color: #0066cc;
}
/*
* Verhindert abgeschnittene Inhalte, wenn die Karte
* höher als der Viewport ist ("center" schneidet oben ab).
*/
@supports (align-items: safe center) {
body {
align-items: safe center;
}
}
/*
* Schmale Bildschirme: Navbar umbrechen lassen,
* Abstände und Logo verkleinern.
*/
@media (max-width: 600px) {
body {
/* 130px räumen die fixe Navbar frei */
padding-top: 130px;
/* min-height gilt für die Content-Box: Navbar-Freiraum
* abziehen, sonst sitzt die Karte unter der Mitte */
min-height: calc(100vh - 130px);
}
.navbar {
top: 8px;
left: 4%;
width: 92%;
padding: 10px;
flex-wrap: wrap;
}
.logo-bar img {
height: 40px;
}
button, .button {
padding: 10px 14px;
font-size: 15px;
}
.card {
padding: 20px;
}
}
/* Sehr schmale Telefone: noch kompakter */
@media (max-width: 400px) {
.navbar {
left: 2%;
width: 96%;
padding: 8px;
gap: 6px;
}
.logo-bar img {
height: 32px;
}
.nav-actions {
gap: 6px;
}
.nav-actions .button {
padding: 8px 12px;
font-size: 14px;
}
}
/*
* Phone-Portrait: Navbar-Aktionen hinter dem
* Hamburger-Button als Dropdown anzeigen.
*/
@media (orientation: portrait) and (max-width: 600px) {
body {
/* Navbar ist hier einzeilig */
padding-top: 80px;
min-height: calc(100vh - 80px);
}
button.nav-toggle {
display: inline-flex;
}
/* ".navbar .button" setzt margin: 0 – deshalb
* höher spezifisch ans Ziel: Button nach rechts */
.navbar .nav-toggle {
margin-left: auto;
}
.nav-actions {
display: none;
position: absolute;
top: 100%;
right: 0;
margin: 8px 0 0;
padding: 8px;
min-width: 200px;
background: white;
border-radius: 10px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
flex-direction: column;
align-items: stretch;
}
.nav-actions.open {
display: flex;
}
/* Alle Panel-Buttons gleich breit, Text zentriert */
.nav-actions .button {
text-align: center;
}
/* Sprach-Button liegt im .lang-menu-Wrapper */
.nav-actions .lang-menu .button {
display: block;
width: 100%;
box-sizing: border-box;
}
:root.dark .nav-actions {
background: #242424;
}
}
/*
* Sicherheit: Hamburger im Landscape grundsätzlich
* ausblenden, falls orientation falsch gemeldet wird.
*/
@media (orientation: landscape) {
button.nav-toggle {
display: none;
}
}
/*
* Phone-Landscape: schmaler, hoher Karteninhalt –
* einzeilige Navbar (~106px) freihalten.
*/
@media (orientation: landscape) and (max-height: 500px) {
body {
padding-top: 120px;
/* min-height gilt für die Content-Box: Navbar-Freiraum
* abziehen, sonst sitzt die Karte unter der Mitte */
min-height: calc(100vh - 120px);
}
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
/*
* Dark-Theme über die Klasse "dark" am html-Element.
* JS setzt sie anhand der gespeicherten Wahl oder der
* System-Einstellung (siehe detectTheme).
*/
:root.dark body {
background: #181818;
color: #eee;
}
:root.dark .navbar {
background: rgba(36, 36, 36, 0.72);
}
:root.dark .card {
background: rgba(36, 36, 36, 0.72);
}
:root.dark .lang-dropdown {
background: #242424;
}
:root.dark .lang-dropdown button:hover {
background: #303030;
}
:root.dark .lang-dropdown button.active {
background: #1a3a5a;
}
:root.dark p {
color: #bbb;
}
:root.dark .secondary {
background: #444;
color: #eee;
}
:root.dark .status,
:root.dark .download {
background: #303030;
}
:root.dark .spinner {
border-color: #555;
border-top-color: #ddd;
}
:root.dark .form-group label {
color: #ddd;
}
:root.dark .form-group input,
:root.dark .form-group textarea {
background: #303030;
border-color: #555;
color: #eee;
}
:root.dark .success-message {
background: #1a3a5a;
color: #99ccff;
}
:root.dark .adhoc-result {
background: #1c3527;
color: #7ee2a8;
}
:root.dark .logo-bar img {
filter: url(#logo-dark-tint);
}
:root.dark .adhoc-link a {
color: #99ccff;
}
</style>
<link href="https://meet.bnvb.eu/assets/images/favicon.ico" rel="alternate icon">
<link href="https://meet.bnvb.eu/assets/images/apple-touch-icon.png" rel="apple-touch-icon" sizes="180x180">
<link href="https://meet.bnvb.eu/assets/images/favicon.svg" rel="icon" type="image/svg+xml">
<link rel="stylesheet" href="assets/css/launch.css">
</head>
<body>
@@ -552,14 +39,14 @@
</a>
<div id="langMenu" class="lang-menu">
<button id="langButton" class="button secondary" type="button" aria-haspopup="true" aria-expanded="false">
<img id="langFlag" class="lang-flag" src="assets/uk.svg" alt="">
<img id="langFlag" class="lang-flag" src="assets/images/uk.svg" alt="">
<span id="langLabel">English</span>
</button>
<div id="langDropdown" class="lang-dropdown">
<button type="button" data-lang="en"><img class="lang-flag" src="assets/uk.svg" alt="">English</button>
<button type="button" data-lang="de"><img class="lang-flag" src="assets/de.svg" alt="">Deutsch</button>
<button type="button" data-lang="fr"><img class="lang-flag" src="assets/fr.svg" alt="">Français</button>
<button type="button" data-lang="zh"><img class="lang-flag" src="assets/cn.svg" alt="">中文</button>
<button type="button" data-lang="en"><img class="lang-flag" src="assets/images/uk.svg" alt="">English</button>
<button type="button" data-lang="de"><img class="lang-flag" src="assets/images/de.svg" alt="">Deutsch</button>
<button type="button" data-lang="fr"><img class="lang-flag" src="assets/images/fr.svg" alt="">Français</button>
<button type="button" data-lang="zh"><img class="lang-flag" src="assets/images/cn.svg" alt="">中文</button>
</div>
</div>
<button id="themeButton" class="button secondary" type="button" aria-label="Toggle dark mode">