home page: update own-db layout and redis and elasticsearch icons

lyubov-voloshko · lyubov-voloshko · commit 90aa37e381d0 · 2025-11-23T22:13:07.000+02:00
diff --git a/frontend/src/app/app.component.ts b/frontend/src/app/app.component.ts
@@ -109,6 +109,8 @@ export class AppComponent {
     this.matIconRegistry.addSvgIcon("dynamodb", this.domSanitizer.bypassSecurityTrustResourceUrl("/assets/icons/db-logos/dynamodb_logo.svg"));
     this.matIconRegistry.addSvgIcon("ibmdb2", this.domSanitizer.bypassSecurityTrustResourceUrl("/assets/icons/db-logos/db2_logo.svg"));
     this.matIconRegistry.addSvgIcon("cassandra", this.domSanitizer.bypassSecurityTrustResourceUrl("/assets/icons/db-logos/сassandra_logo.svg"));
+    this.matIconRegistry.addSvgIcon("redis", this.domSanitizer.bypassSecurityTrustResourceUrl("/assets/icons/db-logos/redis_logo.svg"));
+    this.matIconRegistry.addSvgIcon("elasticsearch", this.domSanitizer.bypassSecurityTrustResourceUrl("/assets/icons/db-logos/elasticsearch_logo.svg"));
     this.matIconRegistry.addSvgIcon("github", this.domSanitizer.bypassSecurityTrustResourceUrl("/assets/icons/github.svg"));
     this.matIconRegistry.addSvgIcon("google", this.domSanitizer.bypassSecurityTrustResourceUrl("/assets/icons/google.svg"));
     this.matIconRegistry.addSvgIcon("ai_rocket", this.domSanitizer.bypassSecurityTrustResourceUrl("/assets/icons/ai-rocket.svg"));
diff --git a/frontend/src/app/components/connections-list/own-connections/own-connections.component.css b/frontend/src/app/components/connections-list/own-connections/own-connections.component.css
@@ -53,6 +53,7 @@
 
 .addConnectionLink {
     display: flex;
+    flex-direction: column;
     align-items: center;
     gap: 6px;
     border-radius: 4px;
@@ -62,8 +63,7 @@
         0px 0px 2px 0px rgba(0, 0, 0, 0.14);
     color: inherit;
     font-weight: 600;
-    height: 48px;
-    padding-left: 6px;
+    padding: 12px;
     text-decoration: none;
     transition: box-shadow 200ms, background 200ms, border 200ms;
 }
@@ -98,14 +98,14 @@
     justify-content: center;
     background-color: #fff;
     border-radius: 4px;
-    height: 36px;
-    width: 36px;
+    height: 40px;
+    width: 40px;
 }
 
 .addConnectionLink__icon {
     flex-shrink: 0;
-    height: 20px;
-    width: 20px;
+    height: 30px;
+    width: 30px;
 }
 
 .showAllButton {
diff --git a/frontend/src/assets/icons/db-logos/elasticsearch_logo.svg b/frontend/src/assets/icons/db-logos/elasticsearch_logo.svg
@@ -0,0 +1,10 @@
+<svg enable-background="new 0 0 250 250" viewBox="77,83,100,90" xmlns="http://www.w3.org/2000/svg">
+ <path d="m178 102.5h313v41h-313z" fill="none"/>
+ <path d="m141.8 115.5h-20.9c.1.5.3 1 .4 1.4.7 2.4 1.1 4.9 1.3 7.5.1 1 .1 2.1.1 3.1s0 2.1-.1 3.1c-.2 2.6-.6 5.1-1.3 7.5-.1.5-.3 1-.4 1.4h20.9c6.6 0 11.9-5.4 11.9-12s-5.3-12-11.9-12z" fill="#00a9e5"/>
+ <path d="m122.6 130.6c.1-1 .1-2.1.1-3.1s0-2.1-.1-3.1c-.2-2.6-.6-5.1-1.3-7.5-.1-.5-.3-1-.4-1.4h-32.3c-1.2 3.8-1.8 7.8-1.8 12s.6 8.2 1.8 12h32.3c.1-.5.3-1 .4-1.4.7-2.4 1.1-4.9 1.3-7.5z" fill="#353535"/>
+ <path d="m145.4 143.5h-26c-.8 1.8-1.7 3.5-2.7 5.1-1.5 2.5-3.3 4.7-5.3 6.8-.7.7-1.4 1.3-2.1 2-1.4 1.3-3 2.4-4.6 3.5 6.3 4.2 13.9 6.6 22 6.6 13.9 0 26.1-7.1 33.3-17.8-3.7-3.8-8.9-6.2-14.6-6.2z" fill="#00bfb3"/>
+ <path d="m116.7 148.6c1-1.6 1.9-3.3 2.7-5.1h-29.3c3.1 7.1 8.2 13.2 14.7 17.4 1.6-1.1 3.1-2.2 4.6-3.5.7-.6 1.4-1.3 2.1-2 1.9-2 3.7-4.3 5.2-6.8z" fill="#019b8f"/>
+ <path d="m111.4 99.6c-.7-.7-1.4-1.3-2.1-2-1.4-1.3-3-2.4-4.6-3.5-6.4 4.2-11.5 10.3-14.7 17.4h29.3c-.8-1.8-1.7-3.5-2.7-5.1-1.4-2.5-3.2-4.8-5.2-6.8z" fill="#f9b110"/>
+ <path d="m126.7 87.5c-8.1 0-15.7 2.4-22 6.6 1.6 1.1 3.1 2.2 4.6 3.5.7.6 1.4 1.3 2.1 2 2 2.1 3.8 4.3 5.3 6.8 1 1.6 1.9 3.3 2.7 5.1h26c5.7 0 10.9-2.4 14.6-6.2-7.2-10.7-19.4-17.8-33.3-17.8z" fill="#fed10a"/>
+<script xmlns=""/>
+</svg>
diff --git a/frontend/src/assets/icons/db-logos/redis_logo.svg b/frontend/src/assets/icons/db-logos/redis_logo.svg
@@ -0,0 +1,22 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 150.59 125.59">
+    <defs>
+        <style>.cls-1{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#a32422;}.cls-4{fill:#dc382c;}.cls-5{fill:#fff;}.cls-6{fill:#741113;}.cls-7{fill:#ac2724;}.cls-8{fill:#494c4d;}</style>
+        <clipPath id="clip-path" transform="translate(0.01 0.01)"><rect class="cls-1" width="146.42" height="125.48"/></clipPath>
+    </defs>
+    <g id="Layer_2" data-name="Layer 2">
+        <g id="Layer_1-2" data-name="Layer 1">
+            <g class="cls-2">
+                <path class="cls-3" d="M140.66,96.74c-7.8,4.08-48.28,20.73-57,25.3s-13.39,4.44-20.21,1.18S13.7,102.5,5.92,98.78C2,96.94,0,95.37,0,93.9V79.09S56.08,66.92,65.13,63.64,77.31,60.28,85,63.1,138.79,74.24,146.4,77V91.6c0,1.52-1.75,3-5.74,5.13Z" transform="translate(0.01 0.01)"/>
+                <path class="cls-4" d="M140.66,82c-7.8,4.06-48.28,20.71-57,25.2s-13.39,4.45-20.21,1.2S13.7,87.69,5.92,84s-7.93-6.27-.3-9.25S56.08,55,65.13,51.7,77.31,48.33,85,51.16,133,70,140.57,72.79s7.92,5.08.09,9.13Z" transform="translate(0.01 0.01)"/>
+                <path class="cls-3" d="M140.66,72.62c-7.8,4.07-48.28,20.71-57,25.2S70.31,102.27,63.49,99,13.7,78.37,5.92,74.66C2,72.8,0,71.24,0,69.76V55S56.08,42.79,65.13,39.51,77.31,36.14,85,39,138.79,50.1,146.4,52.88v14.6C146.4,69,144.65,70.52,140.66,72.62Z" transform="translate(0.01 0.01)"/>
+                <path class="cls-4" d="M140.66,57.81c-7.8,4.08-48.28,20.72-57,25.21s-13.39,4.46-20.21,1.2S13.7,63.57,5.92,59.85-2,53.6,5.62,50.62s50.46-19.79,59.51-23S77.31,24.21,85,27,133,45.94,140.57,48.65s7.92,5.09.09,9.13Z" transform="translate(0.01 0.01)"/>
+                <path class="cls-3" d="M140.66,47.59c-7.8,4.08-48.28,20.73-57,25.21S70.31,77.25,63.49,74,13.7,53.34,5.92,49.63C2,47.79,0,46.22,0,44.74V29.93S56.08,17.76,65.13,14.49,77.31,11.12,85,13.94s53.77,11.14,61.38,13.92v14.6C146.4,44,144.65,45.5,140.66,47.59Z" transform="translate(0.01 0.01)"/>
+                <path class="cls-4" d="M140.66,32.8c-7.8,4-48.28,20.75-57,25.2s-13.39,4.44-20.21,1.2S13.7,38.53,5.92,34.83s-7.93-6.27-.3-9.25S56.08,5.8,65.13,2.54,77.31-.82,85,2,133,20.85,140.57,23.63s7.92,5.09.09,9.14Z" transform="translate(0.01 0.01)"/>
+            </g>
+            <polygon class="cls-5" points="75.51 11.78 85.17 8.61 82.55 14.87 92.38 18.55 79.71 19.87 76.86 26.71 72.28 19.08 57.63 17.76 68.57 13.82 65.28 7.76 75.51 11.78 75.51 11.78 75.51 11.78"/>
+            <polygon class="cls-5" points="76.12 51.71 52.44 41.88 86.36 36.67 76.12 51.71 76.12 51.71 76.12 51.71"/><path class="cls-5" d="M43.28,22.34c10,0,18.13,3.15,18.13,7s-8.15,7-18.13,7-18.14-3.15-18.14-7S33.27,22.34,43.28,22.34Z" transform="translate(0.01 0.01)"/>
+            <polygon class="cls-6" points="107.39 20.42 127.46 28.35 107.41 36.28 107.39 20.42 107.39 20.42 107.39 20.42"/><polygon class="cls-7" points="107.39 20.42 107.41 36.28 105.23 37.13 85.17 29.2 107.39 20.42 107.39 20.42 107.39 20.42"/>
+        </g>
+    </g>
+    <script xmlns=""/>
+</svg>
