Fix some UI styles. (#96)

* Update the cache-dependency-path

* Read the assets from '/kitops'

* UI fixes

docs/.vitepress/config.mts

@@ -92,7 +92,7 @@ export default defineConfig({
     socialLinks: [
       {
         icon: 'discord',
-        link: 'https://discord.gg/XzSmtPn3'
+        link: 'https://discord.gg/bYeHxpT3'
       },
       {
         icon: 'github',

docs/.vitepress/theme/assets/css/tailwind.css

@@ -169,8 +169,8 @@
 @layer components {
   .kit-button {
     @apply inline-block appearance-none;
-    @apply px-6 py-4 relative;
-    @apply text-gold font-bold uppercase;
+    @apply px-5 py-3 relative;
+    @apply text-gold font-bold uppercase text-center;
     @apply hocus:text-white;
 
     border: 2px solid var(--color-gold);
@@ -183,6 +183,7 @@
     background-image: linear-gradient(135deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 10%, rgba(255,255,255,0) 10.1%, rgba(255,255,255,0) 100%);
 
     @media screen(md) {
+      @apply text-left;
       font-size: 16px;
       letter-spacing: 2.4px;
     }
@@ -211,10 +212,11 @@
   }
 
   .kit-cards {
-    @apply grid grid-cols-1 md:grid-cols-3 gap-2;
+    @apply grid grid-cols-1 lg:grid-cols-3 gap-2;
 
     > .kit-card {
       @apply border border-gray-02 p-8 xl:p-10;
+      @apply w-full max-w-md mx-auto;
     }
 
     .kit-card h4 {

docs/.vitepress/theme/components/Blog.vue

@@ -118,7 +118,7 @@ watchEffect(() => {
 
       <h4 class="font-bold mt-4">{{ post.title }}</h4>
 
-      <p class="mt-2">{{ post.description }}</p>
+      <p class="mt-2 p2">{{ post.description }}</p>
 
       <div class="font-bold p2 mt-10">{{ post.author }}</div>
     </a>
@@ -127,6 +127,10 @@ watchEffect(() => {
 </template>
 
 <style scoped>
+.VPNav {
+  display: none !important;
+}
+
 section {
   max-width: calc(var(--vp-layout-max-width) - 64px);
   margin-left: auto;

docs/.vitepress/theme/components/Footer.vue

@@ -19,7 +19,7 @@ const year = (new Date()).getFullYear()
 
     <div class="flex items-center p2 gap-4">
       <strong aria-label="made with love by Jozu">Made with <span class="text-red-500 text-2xl">♥️</span> by</strong>
-      <a href="https://jozu.com">
+      <a href="https://jozu.com" target="_blank">
         <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48" fill="none" title="Jozu">
           <path d="M4.5 5.29955L23.885 0L43.27 5.29955V48C43.27 48 32.924 42.7004 23.885 42.7004C14.846 42.7004 4.5 48 4.5 48V5.29955Z" fill="white"/>
           <path d="M15.1993 21.6987C13.7519 21.6987 12.6008 21.3457 11.7462 20.6397C10.8915 19.9337 10.3194 18.9923 10.03 17.8156L13.0282 16.7151C13.1109 17.1027 13.2349 17.4834 13.4004 17.8572C13.5796 18.2171 13.8139 18.5147 14.1034 18.7501C14.4067 18.9854 14.772 19.1031 15.1993 19.1031C15.8885 19.1031 16.4124 18.8885 16.7708 18.4594C17.143 18.0164 17.3291 17.2411 17.3291 16.1337V7.57852H20.5961V16.1337C20.5961 17.8641 20.1343 19.2277 19.2107 20.2244C18.3009 21.2073 16.9638 21.6987 15.1993 21.6987Z" fill="black"/>
@@ -44,15 +44,15 @@ const year = (new Date()).getFullYear()
   <div class="text-center space-y-6 text-sm font-bold">
     <ul class="flex items-center gap-14 justify-center">
       <li>
-        <a href="https://discord.gg/XzSmtPn3">
+        <a href="https://discord.gg/bYeHxpT3" target="_blank">
           <span class="sr-only">discord</span>
           <svg xmlns="http://www.w3.org/2000/svg" width="25" height="18" fill="none">
             <path fill="#ECECEC" d="M20.83 1.507A20.002 20.002 0 0 0 15.88 0c-.234.414-.446.84-.634 1.276a18.631 18.631 0 0 0-5.495 0C9.56.84 9.35.414 9.115 0A20.143 20.143 0 0 0 4.16 1.511C1.027 6.1.177 10.573.602 14.983A20.04 20.04 0 0 0 6.675 18a14.49 14.49 0 0 0 1.3-2.075 12.98 12.98 0 0 1-2.048-.968c.172-.123.34-.25.502-.374a14.39 14.39 0 0 0 12.142 0c.164.133.332.26.502.374-.654.382-1.34.707-2.052.97.373.726.808 1.42 1.3 2.073a19.952 19.952 0 0 0 6.077-3.015c.498-5.115-.851-9.547-3.568-13.478ZM8.513 12.271c-1.183 0-2.161-1.063-2.161-2.37 0-1.308.944-2.38 2.157-2.38 1.214 0 2.184 1.072 2.164 2.38-.021 1.307-.954 2.37-2.16 2.37Zm7.974 0c-1.186 0-2.16-1.063-2.16-2.37 0-1.308.944-2.38 2.16-2.38 1.215 0 2.178 1.072 2.157 2.38-.02 1.307-.951 2.37-2.157 2.37Z"/>
           </svg>
         </a>
       </li>
       <li>
-        <a href="">
+        <a href="https://github.com/jozu-ai/kitops">
           <span class="sr-only">github</span>
           <svg xmlns="http://www.w3.org/2000/svg" width="25" height="24" fill="none" title="">
             <path fill="#ECECEC" fill-rule="evenodd" d="M12.464 0C5.848 0 .5 5.5.5 12.304c0 5.44 3.427 10.043 8.18 11.673.595.122.813-.265.813-.59 0-.286-.02-1.264-.02-2.282-3.328.733-4.02-1.467-4.02-1.467-.536-1.426-1.328-1.793-1.328-1.793-1.09-.753.08-.753.08-.753 1.207.081 1.841 1.263 1.841 1.263 1.07 1.873 2.793 1.344 3.487 1.018.099-.795.416-1.345.752-1.65-2.654-.285-5.447-1.345-5.447-6.07 0-1.345.475-2.445 1.228-3.3-.119-.306-.535-1.57.12-3.26 0 0 1.01-.326 3.287 1.263.975-.27 1.981-.407 2.991-.408 1.01 0 2.04.143 2.991.408 2.278-1.59 3.288-1.263 3.288-1.263.654 1.69.238 2.954.12 3.26.772.855 1.227 1.955 1.227 3.3 0 4.725-2.792 5.764-5.467 6.07.436.387.812 1.12.812 2.282 0 1.65-.02 2.974-.02 3.381 0 .326.219.713.813.591 4.754-1.63 8.18-6.234 8.18-11.673C24.429 5.5 19.06 0 12.465 0Z" clip-rule="evenodd"/>