chore: wip

Author: chrisbbreuer

resources/views/projects/index.vue

@@ -130,6 +130,10 @@ useHead({
  # Projects
  </h1>
 
+ <p class="mb-14">
+ Here are some of the projects I've worked on.
+ </p>
+
  <!-- Overview -->
  <div class="space-y-12 mb-16">
  <div>
@@ -142,8 +146,8 @@ useHead({
  </p>
 
  <div class="mb-8 space-y-2 pl-4">
- <div v-for="(feature, index) in featureList" :key="index" class="flex items-baseline py-2">
- <span :class="isDarkMode ? 'text-gray-400' : 'text-gray-600'" class="mr-2">—</span>
+ <div v-for="(feature, index) in featureList" :key="index" class="flex items-baseline py-1">
+ <span :class="isDarkMode ? 'text-gray-400' : 'text-gray-600'" class="mr-2">•</span>
  <span>{{ feature }}</span>
  </div>
  </div>
@@ -183,38 +187,38 @@ useHead({
  </div>
  </div>
 
- <!-- Tag Cloud -->
- <div class="mb-10">
- <h2 class="text-lg font-bold mb-4 font-mono">Filter by Tag:</h2>
- <div class="flex flex-wrap gap-2 mb-4">
- <button @click="selectedTag = ''"
- class="px-3 py-1 rounded-full text-sm font-medium transition-colors duration-200"
- :class="!selectedTag ?
- (isDarkMode ? 'bg-gray-600 text-white' : 'bg-gray-700 text-white') :
- (isDarkMode ? 'bg-gray-800 text-gray-300 hover:bg-gray-700' : 'bg-gray-200 text-gray-700 hover:bg-gray-300')">
- All
- </button>
- <button v-for="tag in allTags" :key="tag" @click="selectedTag = tag"
- class="px-3 py-1 rounded-full text-sm font-medium transition-colors duration-200"
- :class="selectedTag === tag ?
- (isDarkMode ? 'bg-gray-600 text-white' : 'bg-gray-700 text-white') :
- (isDarkMode ? 'bg-gray-800 text-gray-300 hover:bg-gray-700' : 'bg-gray-200 text-gray-700 hover:bg-gray-300')">
- {{ tag }}
- </button>
- </div>
- <div v-if="selectedTag" class="mb-6">
- <button @click="selectedTag = ''" class="text-sm flex items-center"
- :class="isDarkMode ? 'text-gray-400 hover:text-gray-300' : 'text-gray-600 hover:text-gray-800'">
- <span class="mr-1">×</span> Clear filter "{{ selectedTag }}"
- </button>
- </div>
- </div>
-
  <!-- All Projects -->
  <div class="space-y-12">
  <!-- Projects List -->
  <h2 class="text-2xl font-bold mb-6 font-mono">## All Projects</h2>
 
+ <!-- Tag Cloud -->
+ <div class="mb-10">
+ <h2 class="text-lg font-bold mb-4 font-mono">Filter by Tag:</h2>
+ <div class="flex flex-wrap gap-2 mb-4">
+ <button @click="selectedTag = ''"
+ class="px-3 py-1 rounded-full text-sm font-medium transition-colors duration-200"
+ :class="!selectedTag ?
+ (isDarkMode ? 'bg-gray-600 text-white' : 'bg-gray-700 text-white') :
+ (isDarkMode ? 'bg-gray-800 text-gray-300 hover:bg-gray-700' : 'bg-gray-200 text-gray-700 hover:bg-gray-300')">
+ All
+ </button>
+ <button v-for="tag in allTags" :key="tag" @click="selectedTag = selectedTag === tag ? '' : tag"
+ class="px-3 py-1 rounded-full text-sm font-medium transition-colors duration-200"
+ :class="selectedTag === tag ?
+ (isDarkMode ? 'bg-gray-600 text-white' : 'bg-gray-700 text-white') :
+ (isDarkMode ? 'bg-gray-800 text-gray-300 hover:bg-gray-700' : 'bg-gray-200 text-gray-700 hover:bg-gray-300')">
+ {{ tag }}
+ </button>
+ </div>
+ <div v-if="selectedTag" class="mb-6">
+ <button @click="selectedTag = ''" class="text-sm flex items-center"
+ :class="isDarkMode ? 'text-gray-400 hover:text-gray-300' : 'text-gray-600 hover:text-gray-800'">
+ <span class="mr-1">×</span> Clear filter "{{ selectedTag }}"
+ </button>
+ </div>
+ </div>
+
  <div v-if="filteredProjects.length === 0" class="py-8 text-center">
  <p>No projects match the selected tag.</p>
  </div>