Resolves #32 ### Changes: - Added '[+] Add New Book' button to `Library.razor`. - Wrapped the button in `AuthorizeView` for `Admin` and `ContentManager` roles. - Updated `NexusButton` styling to follow standards: secondary gray background with neon glow on hover/focus. - Refined `Library.razor` layout with a header and glassmorphism panel. --------- Co-authored-by: Marek Jasiński <jasins.marek@gmail.com> Reviewed-on: #38 Reviewed-by: Marek Jaisński <jasins.marek@gmail.com> Co-authored-by: Antigravity <antigravity@google.com> Co-committed-by: Antigravity <antigravity@google.com>
This commit was merged in pull request #38.
This commit is contained in:
@@ -4,32 +4,35 @@
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
min-width: 44px;
|
min-width: 44px;
|
||||||
min-height: 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-family: var(--nexus-font-sans);
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 1rem;
|
font-size: 0.95rem;
|
||||||
border-radius: 8px;
|
border-radius: 10px;
|
||||||
cursor: pointer;
|
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);
|
box-shadow: 0 0 15px rgba(0, 255, 153, 0.3);
|
||||||
|
outline: none;
|
||||||
|
transform: translateY(-1px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.nexus-btn:active:not(:disabled) {
|
.nexus-btn:active:not(:disabled) {
|
||||||
transform: scale(0.98);
|
transform: translateY(0) scale(0.98);
|
||||||
}
|
}
|
||||||
|
|
||||||
.nexus-btn:disabled {
|
.nexus-btn:disabled {
|
||||||
opacity: 0.5;
|
opacity: 0.4;
|
||||||
cursor: not-allowed;
|
cursor: not-allowed;
|
||||||
border-color: #555;
|
filter: grayscale(1);
|
||||||
color: #555;
|
|
||||||
box-shadow: none;
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -2,16 +2,52 @@
|
|||||||
@attribute [Authorize]
|
@attribute [Authorize]
|
||||||
|
|
||||||
<div class="library-page">
|
<div class="library-page">
|
||||||
<h1>Biblioteka</h1>
|
<header class="library-header">
|
||||||
<p>Twoja kolekcja książek i dokumentów pojawi się tutaj wkrótce.</p>
|
<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>
|
</div>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.library-page {
|
.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 {
|
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>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user