commit 37eaf6f49ea229c9c124f0fc73b6af03a6a4aad7 · finxol.io/blog

+26
app/components/content/Bookmark.vue
···

       1
       1
       +
       <script setup>

     

       2
       2
       +
       const props = defineProps({

     

       3
       3
       +
           url: String

     

       4
       4
       +
       });

     

       5
       5
       +
       </script>

     

       6
       6
       +
       

     

       7
       7
       +
       <template>

     

       8
       8
       +
           <NuxtLink

     

       9
       9
       +
               :to="url"

     

       10
       10
       +
               :class="[

     

       11
       11
       +
                   'flex flex-row items-center justify-start gap-4',

     

       12
       12
       +
                   'px-2 py-4 md:px-4 md:py-6 not-prose',

     

       13
       13
       +
                   'border border-gray-300 dark:border-gray-700 border-solid border-2 rounded-lg',

     

       14
       14
       +
                   'bg-stone-200/25 hover:bg-stone-200/50 dark:bg-stone-700/25 dark:hover:bg-stone-700/50',

     

       15
       15
       +
                   'transition-colors duration-200'

     

       16
       16
       +
               ]"

     

       17
       17
       +
           >

     

       18
       18
       +
               <Icon name="ri:bookmark-fill" size="1.5rem" class="text-yellow-700" />

     

       19
       19
       +
               <div class="flex flex-col items-start justify-start">

     

       20
       20
       +
                   <slot />

     

       21
       21
       +
                   <span class="text-xs text-gray-400 dark:text-gray-600">

     

       22
       22
       +
                       {{props.url}}

     

       23
       23
       +
                   </span>

     

       24
       24
       +
               </div>

     

       25
       25
       +
           </NuxtLink>

     

       26
       26
       +
       </template>