Update styles and templates for improved layout and design
- Updated Tailwind CSS to version 4.0.17, introducing new color variables and adjustments to existing styles. - Added a new section template for displaying project sections with a consistent design. - Enhanced card shortcodes to include list styles for better readability. - Modified sidebar links to ensure correct image paths and improved accessibility with added links for projects.
This commit is contained in:
@@ -6,33 +6,36 @@
|
||||
<ul class="flex flex-col gap-1 justify-center">
|
||||
<li class="border-b border-midnight">
|
||||
<a href="/" class="flex items-center gap-2">
|
||||
<img class="w-6 h-6" src="img/icons/home.png" alt="home-icon" />
|
||||
<img class="w-6 h-6" src="/img/icons/home.png" alt="home-icon" />
|
||||
Home
|
||||
</a>
|
||||
</li>
|
||||
<li class="border-b border-midnight flex items-center">
|
||||
<a href="/cv" class="flex items-center gap-2">
|
||||
<img class="w-6 h-6" src="img/icons/cv.png" alt="cv-icon" />
|
||||
<img class="w-6 h-6" src="/img/icons/cv.png" alt="cv-icon" />
|
||||
CV
|
||||
</a>
|
||||
</li>
|
||||
<li class="border-b border-midnight flex items-center gap-2">
|
||||
<a href="/about" class="flex items-center gap-2">
|
||||
<img class="w-6 h-6" src="img/icons/about.png" alt="about-icon" />
|
||||
<img class="w-6 h-6" src="/img/icons/about.png" alt="about-icon" />
|
||||
About
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="aero-gradient-dark text-white p-1 rounded-sm">
|
||||
<p
|
||||
<a
|
||||
class="aero-gradient p-2 border-b border-midnight text-lg flex items-center gap-2"
|
||||
href="/projects"
|
||||
>
|
||||
<img src="img/icons/folder.png" alt="folder-icon" class="w-6 h-6" />
|
||||
<img src="/img/icons/folder.png" alt="folder-icon" class="w-6 h-6" />
|
||||
Projects
|
||||
</p>
|
||||
</a>
|
||||
<ul class="flex flex-col gap-1 justify-center">
|
||||
<li class="border-b border-midnight">Project 1</li>
|
||||
<li class="border-b border-midnight">
|
||||
<a href="/projects/tiny-packer">Tiny packer</a>
|
||||
</li>
|
||||
<li class="border-b border-midnight">Project 2</li>
|
||||
<li class="border-b border-midnight">Project 3</li>
|
||||
</ul>
|
||||
@@ -41,7 +44,7 @@
|
||||
<p
|
||||
class="aero-gradient p-2 border-b border-midnight text-lg flex items-center gap-2"
|
||||
>
|
||||
<img class="w-6 h-6" src="img/icons/games.png" alt="games-icon" />
|
||||
<img class="w-6 h-6" src="/img/icons/games.png" alt="games-icon" />
|
||||
Games
|
||||
</p>
|
||||
<ul class="flex flex-col gap-1 justify-center">
|
||||
@@ -54,13 +57,17 @@
|
||||
<p
|
||||
class="aero-gradient p-2 border-b border-midnight text-lg flex items-center gap-2"
|
||||
>
|
||||
<img src="img/icons/disc.png" alt="disc-icon" class="w-6 h-6" />
|
||||
<img src="/img/icons/disc.png" alt="disc-icon" class="w-6 h-6" />
|
||||
Multimedia
|
||||
</p>
|
||||
<ul class="flex flex-col gap-1 justify-center">
|
||||
<li class="border-b border-midnight flex items-center gap-2">
|
||||
<a href="/podcasts" class="flex items-center gap-2">
|
||||
<img class="w-6 h-6" src="img/icons/podcast.png" alt="podcast-icon" />
|
||||
<img
|
||||
class="w-6 h-6"
|
||||
src="/img/icons/podcast.png"
|
||||
alt="podcast-icon"
|
||||
/>
|
||||
Podcasts
|
||||
</a>
|
||||
</li>
|
||||
|
Reference in New Issue
Block a user