fix: Enhance integration logos display and styling in the UI (#5221)

* feat: Enhance integration logos display and styling in the UI

Signed-off-by: yassinnouh21 <[email protected]>

* feat: add qdrant svg

Signed-off-by: yassinnouh21 <[email protected]>

---------

Signed-off-by: yassinnouh21 <[email protected]>

Author: YassinNouh21

infra/website/public/images/logos/ClickHouse.svg

@@ -195,6 +195,15 @@ features = store.retrieve_online_documents(
               <div class="integration-item">
                 <img src="/images/logos/azure_synapse.png" alt="Azure Synapse" class="integration-logo">
               </div>
+              <div class="integration-item">
+                <img src="/images/logos/dask.svg" alt="Dask" class="integration-logo">
+              </div>
+              <div class="integration-item">
+                <img src="/images/logos/ClickHouse.svg" alt="ClickHouse" class="integration-logo">
+              </div>
+              <div class="integration-item">
+                <img src="/images/logos/MSSQL.svg" alt="MSSQL" class="integration-logo">
+              </div>
             </div>
           </div>
 
@@ -231,6 +240,24 @@ features = store.retrieve_online_documents(
               <div class="integration-item">
                 <img src="/images/logos/singlestore.png" alt="SingleStore" class="integration-logo">
               </div>
+              <div class="integration-item">
+                <div class="text-logo">IKV</div>
+              </div>
+              <div class="integration-item">
+                <img src="/images/logos/hazelcast.png" alt="Hazelcast" class="integration-logo">
+              </div>
+              <div class="integration-item">
+                <img src="/images/logos/scylladb.svg" alt="ScyllaDB" class="integration-logo">
+              </div>
+              <div class="integration-item">
+                <img src="/images/logos/milvus.png" alt="Milvus" class="integration-logo">
+              </div>
+              <div class="integration-item">
+                <img src="/images/logos/qdrant.svg" alt="Qdrant" class="integration-logo">
+              </div>
+              <div class="integration-item">
+                <img src="/images/logos/couchbase.svg" alt="Couchbase" class="integration-logo">
+              </div>
             </div>
           </div>
         </div>

infra/website/public/images/logos/MSSQL.svg

@@ -595,11 +595,32 @@ main::before {
     max-width: 130px;
 }
 
+.integration-item img[alt="MSSQL"] {
+    max-height: 46px;
+    width: auto;
+}
+
 .integration-logo:hover {
     opacity: 1;
     filter: grayscale(0%) contrast(1);
 }
 
+.text-logo {
+    font-family: var(--font-mono);
+    font-size: 14px;
+    font-weight: 600;
+    text-align: center;
+    color: #666;
+    opacity: 0.9;
+    transition: opacity 0.2s ease;
+    padding: 8px 0;
+}
+
+.integration-item:hover .text-logo {
+    opacity: 1;
+    color: var(--color-text);
+}
+
 .integration-grid {
     display: grid;
     grid-template-columns: repeat(5, 1fr);