fixed issue with sidebar not loading profile info on view switch and updated sidebar styling

This commit is contained in:
Keep Creating Online
2025-02-05 22:29:28 -05:00
parent 22ab53d338
commit 6f05fd8ca3
7 changed files with 144 additions and 93 deletions

View File

@@ -3,54 +3,58 @@
class="bg-gray-900 text-white transition-transform duration-300 ease-in-out fixed top-0 left-0 w-64 h-full -translate-x-full hidden md:translate-x-0 md:block"
>
<div class="flex flex-col h-full">
<div class="flex-1 overflow-y-auto">
<nav class="mt-4">
<a
href="#view=most-recent-videos"
class="flex items-center py-2 px-4 hover:bg-gray-800"
>
<img
src="assets/svg/home-icon.svg"
alt="Home"
class="w-6 h-6 mr-3 flex-shrink-0"
/>
<span class="sidebar-text">Home</span>
</a>
<a
href="#view=explore"
class="flex items-center py-2 px-4 hover:bg-gray-800"
>
<img
src="assets/svg/explore-icon.svg"
alt="Explore"
class="w-6 h-6 mr-3 flex-shrink-0"
/>
<span class="sidebar-text">Explore</span>
</a>
<a
href="#view=subscriptions"
class="flex items-center py-2 px-4 hover:bg-gray-800"
>
<img
src="assets/svg/subscriptions-icon.svg"
alt="Subscriptions"
class="w-6 h-6 mr-3 flex-shrink-0"
/>
<span class="sidebar-text">Subscriptions</span>
</a>
</nav>
<!-- Top Navigation Links -->
<div class="flex-1 overflow-y-auto px-4">
<div class="bg-gray-800 rounded-lg shadow-md mt-4 p-4">
<nav class="flex flex-col space-y-2">
<a
href="#view=most-recent-videos"
class="flex items-center py-2 px-4 hover:bg-gray-700 rounded font-semibold"
>
<img
src="assets/svg/home-icon.svg"
alt="Home"
class="w-6 h-6 mr-3 flex-shrink-0"
/>
<span class="sidebar-text">Home</span>
</a>
<a
href="#view=explore"
class="flex items-center py-2 px-4 hover:bg-gray-700 rounded font-semibold"
>
<img
src="assets/svg/explore-icon.svg"
alt="Explore"
class="w-6 h-6 mr-3 flex-shrink-0"
/>
<span class="sidebar-text">Explore</span>
</a>
<a
href="#view=subscriptions"
class="flex items-center py-2 px-4 hover:bg-gray-700 rounded font-semibold"
>
<img
src="assets/svg/subscriptions-icon.svg"
alt="Subscriptions"
class="w-6 h-6 mr-3 flex-shrink-0"
/>
<span class="sidebar-text">Subscriptions</span>
</a>
</nav>
</div>
</div>
<!-- Footer Links -->
<div class="mt-auto">
<hr class="border-gray-700" />
<div class="p-4">
<nav class="space-y-2">
<nav class="space-y-2 text-sm opacity-70">
<a
href="about.html"
class="flex items-center hover:bg-gray-800 px-4 py-2 rounded"
>
<img
src="assets/svg/about-icon.svg"
target="_blank"
alt="About"
class="w-5 h-5 mr-3"
/>
@@ -62,7 +66,6 @@
>
<img
src="assets/svg/guidelines-icon.svg"
target="_blank"
alt="Guidelines"
class="w-5 h-5 mr-3"
/>
@@ -74,7 +77,6 @@
>
<img
src="assets/svg/getting-started-icon.svg"
target="_blank"
alt="Getting Started"
class="w-5 h-5 mr-3"
/>
@@ -114,7 +116,6 @@
>
<img
src="assets/svg/roadmap-icon.svg"
target="_blank"
alt="Roadmap"
class="w-5 h-5 mr-3"
/>