update docs (sponsors)

Author: tuhuynh27

website/docusaurus.config.js

@@ -88,10 +88,6 @@ const config = {
                 label: 'Cloud',
                 href: 'https://cloud.keva.dev/',
               },
-              {
-                label: 'Enterprise',
-                href: 'https://cloud.keva.dev/',
-              },
             ],
           },
           {

website/src/pages/index.js

@@ -49,10 +49,16 @@ export default function Home() {
       <main>
         <HomepageFeatures />
       </main>
-      <div className={styles.grokking}>
-        <h3>Coordinated by</h3>
-        <div><img src="https://i.imgur.com/5k8qMpf.png" alt="Grokking Vietnam"/></div>
-        <div><a href="https://www.grokking.org/" target="_blank" rel="noreferrer">Grokking Vietnam</a></div>
+      <div className={styles.sponsors}>
+        <h3>Supported by</h3>
+        <div className={styles.sponsor}>
+          <div><img src="https://i.imgur.com/5k8qMpf.png" alt="Grokking Vietnam"/></div>
+          <div><a href="https://www.grokking.org/" target="_blank" rel="noreferrer">Grokking Vietnam</a></div>
+        </div>
+        <div className={styles.sponsor}>
+          <div><img src="https://i.imgur.com/2FmPAWC.png" alt="Grokking Vietnam"/></div>
+          <div><a href="https://www.jetbrains.com/" target="_blank" rel="noreferrer">Jetbrains IDEs</a></div>
+        </div>
       </div>
     </Layout>
   );

website/src/pages/index.module.scss

@@ -55,21 +55,34 @@
     }
 }
 
-.grokking {
+.sponsors {
     display: flex;
-    flex-direction: column;
+    flex-direction: row;
     align-items: center;
     justify-content: center;
-    gap: 10px;
+    gap: 25px;
 
-    img {
-        width: 100px;
-        height: 100px;
-        border-radius: 50%;
+    // For mobile
+    @media screen and (max-width: 1068px) {
+        flex-direction: column;
     }
 
-    a {
-        text-decoration: none;
+    .sponsor {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        gap: 10px;
+
+        img {
+            width: 100px;
+            height: 100px;
+            border-radius: 50%;
+        }
+
+        a {
+            text-decoration: none;
+        }
     }
 
     margin-bottom: 2rem;