diff --git a/app/web/src/App.svelte b/app/web/src/App.svelte
index ccc66a2..c40da13 100644
--- a/app/web/src/App.svelte
+++ b/app/web/src/App.svelte
@@ -482,10 +482,9 @@
{userProfile?.name || userPubkey.slice(0, 8) + '...'}
-
{:else}
-
+
{/if}
@@ -535,7 +534,7 @@
{:else}
Please log in to access export functionality.
-
+
{/if}
@@ -558,7 +557,7 @@
{:else}
Please log in to access import functionality.
-
+
{/if}
@@ -590,7 +589,7 @@
{:else}
Please log in to view your events.
-
+
{/if}
@@ -626,7 +625,7 @@
{:else}
Please log in to view events.
-
+
{/if}
@@ -657,6 +656,8 @@
{#if userProfile.banner}
{/if}
+
+
{#if userProfile.picture}
@@ -861,26 +862,25 @@
}
.login-btn {
- border: 0 none;
- border-radius: 0;
- display: flex;
- align-items: center;
- background-color: var(--primary);
+ padding: 0.5em 1em;
+ border: none;
+ border-radius: 6px;
+ background-color: #4CAF50;
+ color: white;
cursor: pointer;
- color: var(--text-color);
- height: 3em;
- width: auto;
- min-width: 3em;
- flex-shrink: 0;
- line-height: 1;
+ font-size: 1rem;
+ font-weight: 500;
transition: background-color 0.2s;
+ display: inline-flex;
+ align-items: center;
justify-content: center;
- padding: 1em 1em 1em 1em;
- margin: 0;
+ vertical-align: middle;
+ margin: 0 auto;
+ padding:0.5em 1em;
}
.login-btn:hover {
- background-color: #0056b3;
+ background-color: #45a049;
}
/* App Container */
@@ -1014,23 +1014,32 @@
.logout-btn {
- padding: 0;
+ padding: 0.5rem 1rem;
border: none;
- border-radius: 0;
+ border-radius: 6px;
background-color: var(--warning);
color: white;
cursor: pointer;
- flex-shrink: 0;
- height: 3em;
- width: 3em;
+ font-size: 1rem;
+ font-weight: 500;
+ transition: background-color 0.2s;
display: flex;
align-items: center;
justify-content: center;
+ gap: 0.5rem;
+ }
+
+ .logout-btn:hover {
+ background-color: #e53935;
+ }
+
+ .logout-btn.floating {
+ position: absolute;
+ top: 0.5em;
+ right: 0.5em;
+ z-index: 10;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
-
- /*.logout-btn:hover {*/
- /* background: ;*/
- /*}*/
/* User Profile Button */
.user-profile-btn {
@@ -1139,6 +1148,7 @@
margin-bottom: 2rem;
}
+
.profile-hero {
position: relative;
}
@@ -1281,7 +1291,7 @@
margin-bottom: 1.5rem;
}
- .export-section h3, .import-section h3, .events-section h3 {
+ .export-section h3, .import-section h3 {
margin: 0 0 1rem 0;
color: var(--text-color);
font-size: 1.2rem;