src/NexusReader.UI.Shared/Components/Atoms/NexusButton.razor.css

@@ -4,32 +4,35 @@
     justify-content: center;
     min-width: 44px;
     min-height: 44px;
-    padding: 0.5rem 1rem;
+    padding: 0.5rem 1.25rem;
-    background-color: var(--nexus-card);
+    background-color: rgba(255, 255, 255, 0.05);
-    color: var(--nexus-neon);
+    color: #ffffff;
-    border: 1px solid var(--nexus-neon);
+    border: 1px solid rgba(255, 255, 255, 0.1);
     font-family: var(--nexus-font-sans);
     font-weight: 500;
-    font-size: 1rem;
+    font-size: 0.95rem;
-    border-radius: 8px;
+    border-radius: 10px;
     cursor: pointer;
-    transition: all 0.2s ease;
+    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
-    box-shadow: 0 0 5px rgba(0, 255, 153, 0.1);
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
 }
 
-.nexus-btn:hover:not(:disabled) {
+.nexus-btn:hover:not(:disabled),
-    background-color: rgba(0, 255, 153, 0.1);
+.nexus-btn:focus:not(:disabled) {
+    background-color: rgba(255, 255, 255, 0.08);
+    border-color: rgba(0, 255, 153, 0.4);
+    color: var(--nexus-neon);
     box-shadow: 0 0 15px rgba(0, 255, 153, 0.3);
+    outline: none;
+    transform: translateY(-1px);
 }
 
 .nexus-btn:active:not(:disabled) {
-    transform: scale(0.98);
+    transform: translateY(0) scale(0.98);
 }
 
 .nexus-btn:disabled {
-    opacity: 0.5;
+    opacity: 0.4;
     cursor: not-allowed;
-    border-color: #555;
+    filter: grayscale(1);
-    color: #555;
-    box-shadow: none;
 }

src/NexusReader.UI.Shared/Pages/Library.razor

@@ -2,16 +2,52 @@
 @attribute [Authorize]
 
 <div class="library-page">
+    <header class="library-header">
         <h1>Biblioteka</h1>
+        <AuthorizeView Roles="Admin, ContentManager">
+            <NexusButton Class="add-book-trigger">
+                [+] Add New Book
+            </NexusButton>
+        </AuthorizeView>
+    </header>
+    
+    <div class="library-content glass-panel">
+        <div class="empty-state">
             <p>Twoja kolekcja książek i dokumentów pojawi się tutaj wkrótce.</p>
+        </div>
+    </div>
 </div>
 
 <style>
     .library-page {
-        padding: 2rem;
+        padding: 3rem 2rem;
+        max-width: 1200px;
+        margin: 0 auto;
     }
+
+    .library-header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 2.5rem;
+    }
+
     h1 {
-        margin-bottom: 1rem;
+        font-family: var(--nexus-font-serif);
-        color: #fff;
+        font-size: 2.5rem;
+        margin: 0;
+        color: var(--nexus-text);
+    }
+
+    .library-content {
+        min-height: 400px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .empty-state {
+        text-align: center;
+        opacity: 0.6;
     }
 </style>