caroschulte02-alt
59 lines
1.2 KiB
CSS
59 lines
1.2 KiB
CSS
/* Grund-Design der Navigations-Links */
|
|
nav a {
|
|
display: inline-block;
|
|
text-decoration: none;
|
|
font-family: Arial, sans-serif;
|
|
font-weight: bold;
|
|
font-size: 14px;
|
|
|
|
/* Innenabstände für die Button-Optik */
|
|
padding: 8px 16px;
|
|
|
|
/* Abgerundete Ecken */
|
|
border-radius: 4px;
|
|
|
|
/* Standardfarben (Blau wie im Screenshot) */
|
|
background-color: #2563eb;
|
|
color: #ffffff;
|
|
|
|
/* Sanfter Übergang für Hover-Effekte */
|
|
transition: background-color 0.2s ease, transform 0.1s ease;
|
|
|
|
/* Trennung zwischen den Elementen */
|
|
margin: 0 4px;
|
|
}
|
|
|
|
/* Hover-Zustand (wenn man mit der Maus drüberfährt) */
|
|
nav a:hover {
|
|
background-color: #1d4ed8;
|
|
color: #ffffff;
|
|
}
|
|
|
|
/* Fokus-Zustand (Wichtig für Tastatur-Bedienung/Accessibility) */
|
|
nav a:focus {
|
|
outline: 3px solid #f59e0b; /* Orangefarbener Ring */
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
/* Aktiv-Zustand (beim Klicken) */
|
|
nav a:active {
|
|
transform: scale(0.95);
|
|
}
|
|
|
|
/* Spezial-Klasse für den "Registrieren"-Button (Rot im Screenshot) */
|
|
nav a.register {
|
|
background-color: #ef4444;
|
|
}
|
|
|
|
nav a.register:hover {
|
|
background-color: #dc2626;
|
|
}
|
|
|
|
/* Spezial-Klasse für den "Anmelden"-Button (Orange-Rot) */
|
|
nav a.login {
|
|
background-color: #f97316;
|
|
}
|
|
|
|
nav a.login:hover {
|
|
background-color: #ea580c;
|
|
} |