refactor(core): cleanup and consistency with themeing

Author: Piyush-r-bhaskar

src/assets/styles/markdown.scss

@@ -130,6 +130,7 @@
     .expressive-code {
         --ec-frm-tooltipSuccessBg: var(--ks-button-background-primary);
         --ec-frm-frameBoxShdCssVal: 0.1rem 0.1rem 0.15rem var(--ks-shadows-light);
+        --code-background: var(--ks-background-primary);
         margin-bottom: 2rem;
 
         pre[data-language] {

src/components/common/PluginsBox.astro

@@ -52,7 +52,7 @@ const plugins = pluginMetadata
             <a href="/plugins" class="btn btn-md btn-primary">See All Plugins</a
             >
         </div>
-        <div class="plugin-logos-grid" data-usal="fade-up">
+        <div class="plugin-logos-grid">
             {
                 plugins.map((plugin) => (
                     <a href={plugin.link}>
@@ -86,24 +86,28 @@ const plugins = pluginMetadata
             display: flex;
             flex-direction: row-reverse;
             gap: 4rem;
+            align-items: center;
         }
     }
 
     .plugin-logos-grid {
         display: grid;
-        grid-template-columns: repeat(5, 1fr);
+        grid-template-columns: repeat(5, minmax(0, 1fr));
         flex: 1;
+        min-width: 0;
         margin: clamp(1rem, 3vw, 2rem);
 
         @include media-breakpoint-up(xl) {
             margin: 0;
         }
 
         a {
-            aspect-ratio: 1;
+            aspect-ratio: 1 / 1;
             padding: clamp(0.6rem, 1vw, 0.8rem);
-            display: grid;
-            place-items: center;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            overflow: hidden;
 
             &:nth-child(even) {
                 background: var(--ks-background-secondary);
@@ -112,12 +116,15 @@ const plugins = pluginMetadata
         }
 
         img {
-            width: 70%;
-            height: 70%;
+            max-width: 100%;
+            max-height: 100%;
+            width: auto;
+            height: auto;
+            object-fit: contain;
             transition: transform 0.2s;
 
             &:hover {
-                transform: scale(1.2);
+                transform: scale(1.1);
             }
         }
     }