92 lines
1.6 KiB
CSS
92 lines
1.6 KiB
CSS
/* ============================================
|
||
Richtig Prompten mit KI – Custom Styles
|
||
Design System: Rust-Orange / Burn-Akzent / Dark Mode
|
||
============================================ */
|
||
|
||
/* Scrollbar Styling */
|
||
::-webkit-scrollbar {
|
||
width: 8px;
|
||
height: 8px;
|
||
}
|
||
|
||
::-webkit-scrollbar-track {
|
||
background: #242424;
|
||
}
|
||
|
||
::-webkit-scrollbar-thumb {
|
||
background: #CE412B;
|
||
border-radius: 4px;
|
||
}
|
||
|
||
::-webkit-scrollbar-thumb:hover {
|
||
background: #E89165;
|
||
}
|
||
|
||
/* Selection Styling */
|
||
::selection {
|
||
background: rgba(206, 65, 43, 0.3);
|
||
color: #E0E0E0;
|
||
}
|
||
|
||
/* Smooth Scrolling */
|
||
html {
|
||
scroll-behavior: smooth;
|
||
}
|
||
|
||
/* Code Block Overflow */
|
||
pre {
|
||
white-space: pre;
|
||
tab-size: 4;
|
||
}
|
||
|
||
/* Blockquote Styling */
|
||
blockquote em {
|
||
color: #E89165;
|
||
}
|
||
|
||
/* Table Row Hover */
|
||
tbody tr:hover {
|
||
background: rgba(255, 255, 255, 0.03);
|
||
}
|
||
|
||
/* Card Hover Effects */
|
||
.group:hover .group-hover\:bg-rust\/30 {
|
||
background: rgba(206, 65, 43, 0.3);
|
||
}
|
||
|
||
/* Focus Visible for Accessibility */
|
||
*:focus-visible {
|
||
outline: 2px solid #CE412B;
|
||
outline-offset: 2px;
|
||
border-radius: 4px;
|
||
}
|
||
|
||
/* Print Styles */
|
||
@media print {
|
||
body {
|
||
background: white;
|
||
color: #242424;
|
||
}
|
||
|
||
nav, #scroll-top, footer {
|
||
display: none;
|
||
}
|
||
|
||
.bg-layer, .bg-deep-grey, .bg-layer\/50 {
|
||
background: #f5f5f5;
|
||
border-color: #ddd;
|
||
}
|
||
|
||
.text-rust, .text-burn {
|
||
color: #CE412B;
|
||
}
|
||
|
||
.text-white {
|
||
color: #242424;
|
||
}
|
||
|
||
.text-off-white, .text-off-white\/80, .text-off-white\/70, .text-off-white\/60 {
|
||
color: #555;
|
||
}
|
||
}
|