| 123456789101112131415161718192021222324252627282930313233343536 |
- <!DOCTYPE html>
- <html lang="en" class="dark">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Obsidian Admin Interface</title>
- <script src="https://cdn.tailwindcss.com"></script>
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css">
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
- <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
- <style>
- body { font-family: 'Inter', sans-serif; }
- /* 1. Fundalul scrollbar-ului rămâne mereu transparent */
- .custom-scrollbar::-webkit-scrollbar {
- width: 4px; /* Am mărit puțin la 4px pentru a fi utilizabil, dar discret */
- }
- /* 2. Thumb-ul este invizibil implicit (sau foarte transparent) */
- .custom-scrollbar::-webkit-scrollbar-thumb {
- background: transparent;
- border-radius: 10px;
- transition: background 0.3s ease;
- }
- /* 3. Thumb-ul devine vizibil doar când facem HOVER pe containerul părinte */
- .custom-scrollbar:hover::-webkit-scrollbar-thumb {
- background: #52525b; /* O nuanță de zinc/gri medie */
- }
- /* 4. Opțional: Culoare mai intensă când se dă click pe scrollbar */
- .custom-scrollbar::-webkit-scrollbar-thumb:hover {
- background: #71717a;
- }
- </style>
- </head>
|
