Michael Schiemer
fc3d7e6357
- Add comprehensive health check system with multiple endpoints - Add Prometheus metrics endpoint - Add production logging configurations (5 strategies) - Add complete deployment documentation suite: * QUICKSTART.md - 30-minute deployment guide * DEPLOYMENT_CHECKLIST.md - Printable verification checklist * DEPLOYMENT_WORKFLOW.md - Complete deployment lifecycle * PRODUCTION_DEPLOYMENT.md - Comprehensive technical reference * production-logging.md - Logging configuration guide * ANSIBLE_DEPLOYMENT.md - Infrastructure as Code automation * README.md - Navigation hub * DEPLOYMENT_SUMMARY.md - Executive summary - Add deployment scripts and automation - Add DEPLOYMENT_PLAN.md - Concrete plan for immediate deployment - Update README with production-ready features All production infrastructure is now complete and ready for deployment.
100 lines
2.1 KiB
CSS
100 lines
2.1 KiB
CSS
/**
|
|
* Mixins & Utilities - Admin Interface
|
|
*
|
|
* Wiederverwendbare CSS-Patterns als @apply Rules.
|
|
* Hinweis: @apply ist nicht Teil des CSS-Standards, aber von PostCSS unterstützt.
|
|
* Alternativ: Plain CSS Custom Properties oder Utility Classes verwenden.
|
|
*/
|
|
|
|
@layer admin-tools {
|
|
/**
|
|
* Visually Hidden
|
|
*
|
|
* Versteckt Elemente visuell, aber behält sie für Screen Reader zugänglich.
|
|
*/
|
|
.admin-visually-hidden {
|
|
position: absolute;
|
|
width: 1px;
|
|
height: 1px;
|
|
padding: 0;
|
|
margin: -1px;
|
|
overflow: hidden;
|
|
clip: rect(0, 0, 0, 0);
|
|
white-space: nowrap;
|
|
border-width: 0;
|
|
}
|
|
|
|
/**
|
|
* Focus Visible
|
|
*
|
|
* Konsistenter Focus-Ring für Tastatur-Navigation.
|
|
*/
|
|
.admin-focus-ring {
|
|
outline: 2px solid var(--admin-focus-ring);
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
/**
|
|
* Smooth Scroll
|
|
*/
|
|
.admin-smooth-scroll {
|
|
scroll-behavior: smooth;
|
|
}
|
|
|
|
@media (--admin-reduced-motion) {
|
|
.admin-smooth-scroll {
|
|
scroll-behavior: auto;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Clearfix
|
|
*
|
|
* Für float-basierte Layouts (falls benötigt).
|
|
*/
|
|
.admin-clearfix::after {
|
|
content: "";
|
|
display: table;
|
|
clear: both;
|
|
}
|
|
|
|
/**
|
|
* Truncate Text
|
|
*
|
|
* Einzeiliger Text mit Ellipsis.
|
|
*/
|
|
.admin-truncate {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
/**
|
|
* Multi-line Truncate
|
|
*
|
|
* Mehrzeiliger Text mit Ellipsis (WebKit only).
|
|
*/
|
|
.admin-line-clamp {
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 3;
|
|
-webkit-box-orient: vertical;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/**
|
|
* Backdrop Blur
|
|
*
|
|
* Für Overlays und Modals.
|
|
*/
|
|
.admin-backdrop-blur {
|
|
backdrop-filter: blur(8px);
|
|
background-color: oklch(0% 0 0 / 0.5);
|
|
}
|
|
|
|
@supports not (backdrop-filter: blur(8px)) {
|
|
.admin-backdrop-blur {
|
|
background-color: oklch(0% 0 0 / 0.75);
|
|
}
|
|
}
|
|
}
|