feat: Refactor dashboard screens to Modern Deep Dark style (#74)
Refactored Pulpit, Katalog, Moje, Konto screens to a unified, premium Modern Deep Dark style. Resolves #73. --------- Co-authored-by: Marek Jasiński <jasins.marek@gmail.com> Reviewed-on: #74 Co-authored-by: Antigravity <antigravity@google.com> Co-committed-by: Antigravity <antigravity@google.com>
This commit was merged in pull request #74.
This commit is contained in:
@@ -57,10 +57,10 @@
|
||||
</div>
|
||||
<div class="empty-text">
|
||||
<h3>Brak aktywnych lektur</h3>
|
||||
<p>Przejdź do biblioteki, aby rozpocząć przygodę z Nexus Reader.</p>
|
||||
<p>Przejdź do katalogu lub swoich książek, aby rozpocząć przygodę z Nexus Reader.</p>
|
||||
</div>
|
||||
<button class="btn-nexus primary" @onclick='() => NavigationManager.NavigateTo("/library")'>
|
||||
Przejdź do Biblioteki
|
||||
<button class="btn-nexus primary" @onclick='() => NavigationManager.NavigateTo("/my-books")'>
|
||||
Przejdź do Moich Książek
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -2,6 +2,17 @@
|
||||
width: 100%;
|
||||
padding: 2rem;
|
||||
overflow: hidden;
|
||||
background: #1a1a1e;
|
||||
border: 1px solid rgba(255, 255, 255, 0.05);
|
||||
border-radius: 12px;
|
||||
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
|
||||
.current-reading-card:hover {
|
||||
background: #1e1e24;
|
||||
border-color: rgba(16, 185, 129, 0.2);
|
||||
transform: translateY(-4px);
|
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.card-layout {
|
||||
@@ -55,7 +66,7 @@
|
||||
|
||||
.author-name {
|
||||
font-size: 0.9rem;
|
||||
color: #A0A0A0;
|
||||
color: #a1a1aa;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@@ -80,7 +91,7 @@
|
||||
}
|
||||
|
||||
.percentage {
|
||||
color: var(--nexus-neon);
|
||||
color: #10b981;
|
||||
}
|
||||
|
||||
.progress-bar-container {
|
||||
@@ -92,8 +103,8 @@
|
||||
|
||||
.progress-bar-fill {
|
||||
height: 100%;
|
||||
background: var(--nexus-neon);
|
||||
box-shadow: 0 0 10px rgba(0, 255, 153, 0.4);
|
||||
background: #10b981;
|
||||
box-shadow: 0 0 10px rgba(16, 185, 129, 0.4);
|
||||
border-radius: 100px;
|
||||
transition: width 1s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
@@ -101,7 +112,7 @@
|
||||
.book-excerpt {
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.6;
|
||||
color: #B0B0B0;
|
||||
color: #a1a1aa;
|
||||
margin: 0;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
@@ -134,26 +145,26 @@
|
||||
|
||||
.btn-nexus.outline {
|
||||
background: transparent;
|
||||
color: var(--nexus-neon);
|
||||
border: 1px solid rgba(0, 255, 153, 0.3);
|
||||
color: #10b981;
|
||||
border: 1px solid rgba(16, 185, 129, 0.3);
|
||||
}
|
||||
|
||||
.btn-nexus.outline:hover {
|
||||
background: rgba(0, 255, 153, 0.05);
|
||||
border-color: var(--nexus-neon);
|
||||
background: rgba(16, 185, 129, 0.05);
|
||||
border-color: #10b981;
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 5px 15px rgba(0, 255, 153, 0.1);
|
||||
box-shadow: 0 5px 15px rgba(16, 185, 129, 0.1);
|
||||
}
|
||||
|
||||
.btn-nexus.primary {
|
||||
background: var(--nexus-neon);
|
||||
background: #10b981;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.btn-nexus.primary:hover {
|
||||
transform: translateY(-2px);
|
||||
filter: brightness(1.1);
|
||||
box-shadow: 0 5px 15px rgba(0, 255, 153, 0.2);
|
||||
box-shadow: 0 5px 15px rgba(16, 185, 129, 0.2);
|
||||
}
|
||||
|
||||
/* Empty State */
|
||||
@@ -168,9 +179,9 @@
|
||||
}
|
||||
|
||||
.empty-icon {
|
||||
color: var(--nexus-neon);
|
||||
color: #10b981;
|
||||
opacity: 0.3;
|
||||
filter: drop-shadow(0 0 10px rgba(0, 255, 153, 0.2));
|
||||
filter: drop-shadow(0 0 10px rgba(16, 185, 129, 0.2));
|
||||
}
|
||||
|
||||
.empty-text h3 {
|
||||
|
||||
Reference in New Issue
Block a user