torsten/harheimertc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add fixed headers to all CMS editors for better UX

Browse Source
This commit is contained in:
Torsten Schulz (local)
2025-10-22 12:27:10 +02:00
parent 0d4bcc9f73
commit bc3b5b53f5
11 changed files with 652 additions and 620 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
pages/cms/einstellungen.vue
View File

@@ -1,24 +1,32 @@
<template>
<div class="min-h-full py-16 bg-gray-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center justify-between mb-6">
<div>
<h1 class="text-4xl sm:text-5xl font-display font-bold text-gray-900">
Einstellungen
</h1>
<div class="w-24 h-1 bg-primary-600 mt-2" />
</div>
<div class="space-x-3">
<button
@click="saveConfig"
class="inline-flex items-center px-4 py-2 rounded-lg bg-primary-600 text-white hover:bg-primary-700 disabled:opacity-50 disabled:cursor-not-allowed"
:disabled="isSaving"
>
<Loader2 v-if="isSaving" :size="16" class="animate-spin mr-2" />
{{ isSaving ? 'Speichern...' : 'Speichern' }}
</button>
<div class="min-h-full bg-gray-50">
<!-- Fixed Header -->
<div class="fixed top-0 left-0 right-0 z-50 bg-white border-b border-gray-200 shadow-sm">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
<div class="flex items-center justify-between">
<div>
<h1 class="text-4xl sm:text-5xl font-display font-bold text-gray-900">
Einstellungen
</h1>
<div class="w-24 h-1 bg-primary-600 mt-2" />
</div>
<div class="space-x-3">
<button
@click="saveConfig"
class="inline-flex items-center px-4 py-2 rounded-lg bg-primary-600 text-white hover:bg-primary-700 disabled:opacity-50 disabled:cursor-not-allowed"
:disabled="isSaving"
>
<Loader2 v-if="isSaving" :size="16" class="animate-spin mr-2" />
{{ isSaving ? 'Speichern...' : 'Speichern' }}
</button>
</div>
</div>
</div>
</div>
<!-- Content with top padding -->
<div class="pt-24 pb-16">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<!-- Loading State -->
<div v-if="isLoading" class="flex items-center justify-center py-12">

20
pages/cms/geschichte.vue
View File

@@ -1,12 +1,20 @@
<template>
<div class="min-h-full py-16 bg-gray-50">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center justify-between mb-6">
<h1 class="text-3xl sm:text-4xl font-display font-bold text-gray-900">Geschichte bearbeiten</h1>
<div class="space-x-3">
<button @click="save" class="inline-flex items-center px-4 py-2 rounded-lg bg-primary-600 text-white hover:bg-primary-700">Speichern</button>
<div class="min-h-full bg-gray-50">
<!-- Fixed Header -->
<div class="fixed top-0 left-0 right-0 z-50 bg-white border-b border-gray-200 shadow-sm">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
<div class="flex items-center justify-between">
<h1 class="text-3xl sm:text-4xl font-display font-bold text-gray-900">Geschichte bearbeiten</h1>
<div class="space-x-3">
<button @click="save" class="inline-flex items-center px-4 py-2 rounded-lg bg-primary-600 text-white hover:bg-primary-700">Speichern</button>
</div>
</div>
</div>
</div>
<!-- Content with top padding -->
<div class="pt-24 pb-16">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex flex-wrap items-center gap-2 mb-3">

20
pages/cms/tt-regeln.vue
View File

@@ -1,12 +1,20 @@
<template>
<div class="min-h-full py-16 bg-gray-50">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center justify-between mb-6">
<h1 class="text-3xl sm:text-4xl font-display font-bold text-gray-900">TT-Regeln bearbeiten</h1>
<div class="space-x-3">
<button @click="save" class="inline-flex items-center px-4 py-2 rounded-lg bg-primary-600 text-white hover:bg-primary-700">Speichern</button>
<div class="min-h-full bg-gray-50">
<!-- Fixed Header -->
<div class="fixed top-0 left-0 right-0 z-50 bg-white border-b border-gray-200 shadow-sm">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
<div class="flex items-center justify-between">
<h1 class="text-3xl sm:text-4xl font-display font-bold text-gray-900">TT-Regeln bearbeiten</h1>
<div class="space-x-3">
<button @click="save" class="inline-flex items-center px-4 py-2 rounded-lg bg-primary-600 text-white hover:bg-primary-700">Speichern</button>
</div>
</div>
</div>
</div>
<!-- Content with top padding -->
<div class="pt-24 pb-16">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex flex-wrap items-center gap-2 mb-3">

20
pages/cms/ueber-uns.vue
View File

@@ -1,12 +1,20 @@
<template>
<div class="min-h-full py-16 bg-gray-50">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center justify-between mb-6">
<h1 class="text-3xl sm:text-4xl font-display font-bold text-gray-900">Über uns bearbeiten</h1>
<div class="space-x-3">
<button @click="save" class="inline-flex items-center px-4 py-2 rounded-lg bg-primary-600 text-white hover:bg-primary-700">Speichern</button>
<div class="min-h-full bg-gray-50">
<!-- Fixed Header -->
<div class="fixed top-0 left-0 right-0 z-50 bg-white border-b border-gray-200 shadow-sm">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
<div class="flex items-center justify-between">
<h1 class="text-3xl sm:text-4xl font-display font-bold text-gray-900">Über uns bearbeiten</h1>
<div class="space-x-3">
<button @click="save" class="inline-flex items-center px-4 py-2 rounded-lg bg-primary-600 text-white hover:bg-primary-700">Speichern</button>
</div>
</div>
</div>
</div>
<!-- Content with top padding -->
<div class="pt-24 pb-16">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex flex-wrap items-center gap-2 mb-3">