updates

deepchem · Nov 10, 2023 · 5d21e4d · 5d21e4d
1 parent 2f8c709
commit 5d21e4d
Show file tree

Hide file tree

Showing 6 changed files with 17 additions and 107 deletions.
diff --git a/new-website/deepchem/components/Layers/FilterButton.js b/new-website/deepchem/components/Layers/FilterButton.js
diff --git a/...eepchem/components/Models/FilterButton.js → ...eepchem/components/common/FilterButton.js b/...eepchem/components/Models/FilterButton.js → ...eepchem/components/common/FilterButton.js
diff --git a/new-website/deepchem/pages/index.js b/new-website/deepchem/pages/index.js
@@ -229,11 +229,11 @@ const Home = () => {
             title="Tutorials"
             link={"/tutorials"}
           />
-          {/* <ExploreCardItem
+          <ExploreCardItem
             image={"/images/explore-datasets.png"}
-            title="DATASETS"
-            link={"/datasets"}
-          /> */}
+            title="LAYERS"
+            link={"/layers"}
+          />
         </div>
       </section>
       {/* EXPLORE END */}

diff --git a/new-website/deepchem/pages/layers.js b/new-website/deepchem/pages/layers.js
@@ -3,7 +3,7 @@ import React, { useEffect, useState } from "react";
 import Image from "next/image";
 
 import LayerCard from "/components/Layers/LayerCard";
-import FilterButton from "/components/Layers/FilterButton";
+import FilterButton from "/components/common/FilterButton";
 
 import layers from "/data/layers/layers.json";
 import modelList from "/data/layers/models.json";
@@ -83,7 +83,7 @@ const Layers = () => {
       ></div>
       <div className= "flex flex-col items-start w-full px-[25px] 2xl:px-[300px] py-8 lg:py-16 gap-6">
         {/* HEADING BEGIN */}
-        <div className="flex flex-row w-[100%] items-center justify-between py-2.5">
+        <div className="flex flex-col w-[100%] justify-between py-2.5">
           <div className="lg:text-4xl text-[26px]">Our Layers</div>
           <div className="lg:hidden">
             <button className="min-w-0" onClick={handlePopUp}>
@@ -92,7 +92,7 @@ const Layers = () => {
           </div>
             {/* HEADING END */}
             {/* BODY BEGIN */}
-            <div className="flex flex-row items-start gap-12 w-full">
+            <div className="flex flex-col items-start gap-12 w-full">
               {/* FILTER SECTION BEGIN */}
               <div
                 className={`${

diff --git a/new-website/deepchem/pages/models.js b/new-website/deepchem/pages/models.js
@@ -3,7 +3,7 @@ import React, { useEffect, useState } from "react";
 import Image from "next/image";
 
 import ModelCard from "/components/Models/ModelCard";
-import FilterButton from "/components/Models/FilterButton";
+import FilterButton from "/components/common/FilterButton";
 
 import models from "/data/models/models.json";
 import backendList from "/data/models/backends.json";
@@ -124,7 +124,6 @@ const Models = () => {
             </button>
           </div>
         </div>
-
         {/* HEADING END */}
         {/* BODY BEGIN */}
         <div className="flex flex-row items-start gap-12 w-full">

diff --git a/new-website/deepchem/styles/globals.css b/new-website/deepchem/styles/globals.css
@@ -145,7 +145,7 @@ footer {
   @apply !shadow-none;
 }
 
-/* models page */
+/* models and layers page */
 @layer components {
   .btn-container-filter {
     @apply flex flex-row items-start gap-2.5 flex-wrap;
@@ -186,6 +186,14 @@ footer {
   .model-card {
     @apply h-fit md:min-h-[260px];
   }
+
+  .layer-container {
+    @apply w-full grid grid-cols-1 md:grid-cols-2 2xl:grid-cols-3;
+  }
+
+  .layer-card {
+    @apply h-fit md:min-h-[260px];
+  }
 }
 
 /* tutorials page */
@@ -229,48 +237,4 @@ footer {
   }
 }
 
-/* layers page */
-@layer component {
-
-  .btn-container-filter {
-    @apply flex flex-row items-start gap-2.5 flex-wrap;
-  }
-
-  .rmv-filter {
-    @apply p-0 normal-case min-w-0;
-  }
-
-  .btn-filter {
-    @apply flex flex-row items-center gap-2.5 py-0.5 px-2 box-border bg-white border border-solid border-dc-light-gray rounded-md;
-  }
-
-  .btn-selected-filter {
-    @apply flex flex-row items-center gap-2.5 py-0.5 px-2 box-border bg-dc-light-gray border border-solid border-dc-light-gray rounded-md;
-  }
-
-  .btn-text-filter {
-    @apply text-[0.8rem] text-dc-gray text-ellipsis font-medium;
-  }
-
-  .btn-text-selected-filter {
-    @apply text-[0.8rem] text-dc-white break-all;
-  }
-
-  .category-text-filter {
-    @apply text-lg text-dc-light-blue;
-  }
-
-  .category-filter {
-    @apply flex flex-col items-start gap-2.5;
-  }
-
-  .layer-container {
-    @apply w-full grid grid-cols-1 md:grid-cols-2 3xl:grid-cols-3;
-  }
-
-  .layer-card {
-    @apply h-fit md:min-h-[260px];
-  }
-
-}