style

docusaurus.config.ts

@@ -63,7 +63,7 @@ const config: Config = {
       title: 'stELLlm',
       logo: {
         alt: 'stELLlm',
-        src: 'img/steellm.png',
+        src: 'img/eel.svg',
       },
       items: [
         {

src/css/custom.css

@@ -6,26 +6,28 @@
 
 /* You can override the default Infima variables here. */
 :root {
-  --ifm-color-primary: #5112af;
-  --ifm-color-primary-dark: #49109e;
-  --ifm-color-primary-darker: #450f95;
-  --ifm-color-primary-darkest: #390d7a;
-  --ifm-color-primary-light: #5914c1;
-  --ifm-color-primary-lighter: #5d15c9;
-  --ifm-color-primary-lightest: #6917e3;
+  --ifm-color-primary: #1e6464;
+  --ifm-color-primary-dark: #1b5a5a;
+  --ifm-color-primary-darker: #195555;
+  --ifm-color-primary-darkest: #154646;
+  --ifm-color-primary-light: #216e6e;
+  --ifm-color-primary-lighter: #227373;
+  --ifm-color-primary-lightest: #278282;
+  --ifm-background-color: #fefefe;
   --ifm-code-font-size: 95%;
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
 }
 
 /* For readability concerns, you should choose a lighter palette in dark mode. */
 [data-theme='dark'] {
-  --ifm-color-primary: #bba8d7;
-  --ifm-color-primary-dark: #a68ecb;
-  --ifm-color-primary-darker: #9c81c5;
-  --ifm-color-primary-darkest: #7d59b3;
-  --ifm-color-primary-light: #d0c2e3;
-  --ifm-color-primary-lighter: #dacfe9;
-  --ifm-color-primary-lightest: #f9f7fb;
+  --ifm-color-primary: #4afafa;
+  --ifm-color-primary-dark: #2af9f9;
+  --ifm-color-primary-darker: #1bf9f9;
+  --ifm-color-primary-darkest: #06dddd;
+  --ifm-color-primary-light: #6afbfb;
+  --ifm-color-primary-lighter: #79fbfb;
+  --ifm-color-primary-lightest: #a9fdfd;
+  --ifm-background-color: #001414;
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
 }
 

src/pages/index.tsx

@@ -29,40 +29,37 @@ const features = [
 export default function Home(): JSX.Element {
   const { siteConfig } = useDocusaurusContext();
   return (
-    <Layout
-      title={`Hello from ${siteConfig.title}`}
-      description="stEELlm"
-    >
+    <Layout title={`Hello from ${siteConfig.title}`} description="stEELlm">
       <main>
         <img
-          src="/steellm-docs/img/bblurryselbat.svg"
-          className="absolute opacity-20 -top-[45rem]"
+          src="/steellm-docs/img/bblurryeel.svg"
+          className="absolute opacity-30 -top-[30rem]"
         />
-        <section className="relative z-10">
-          <div className="place-content-center mx-4 lg:gap-12 xl:gap-12 lg:pt-10 lg:grid-cols-12 pb-12">
-            <h1 className="md:text-center pt-12 mb-12 leading-none text-purple sm:text-6xl md:text-7xl lg:text-8xl dark:text-lightpurple font-bold tracking-widest">
-              stEELlm
-            </h1>
-            <div className="justify-center flex flex-col md:flex-row max-w-6xl gap-20 pb-2 mx-auto">
-              <img
-                alt="Logo"
-                src="/steellm-docs/img/steellm.svg"
-                className="lg:mt-0 lg:col-span-4 lg:flex w-[20rem] object-fit-cover h-auto max-w-full"
-              />
+        <section className="mx-auto max-w-6xl relative z-10">
+          <div className="mx-4 place-content-center lg:gap-12 xl:gap-12 lg:grid-cols-12 pb-12 pt-12">
+            <div className="justify-center flex flex-col md:flex-row max-w-8xl gap-12 pb-2 mx-auto">
               <div className="place-content-center max-w-lg pl-2">
-                <p className=" text-gray-800 dark:text-gray-100 sm:text-xl lg:mb-8 md:text-2xl lg:text-3xl">
-                  {" "}
-                  Supervised and Unsupervised Semantic Table Interpretation
-                  Approach with Feature/Vector Entity Retrieval and
-                  Disambiguation Techniques
+                <h1 className="pt-12 leading-none text-greenblue sm:text-4xl md:text-5xl lg:text-6xl dark:text-neonblue font-bold tracking-wide">
+                  stEELlm
+                </h1>
+                <p className=" text-stone-800 dark:text-stone-100 sm:text-xl lg:mb-8 md:text-xl lg:text-2xl">
+                  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
+                  do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+                  Ut enim ad minim veniam, quis nostrud exercitation ullamco
+                  laboris nisi ut aliquip ex ea commodo consequat.
                 </p>
                 <a
                   href="/steellm-docs/docs/introduction"
-                  className="hover:text-gray-100 text-center inline-flex items-center border-none dark:bg-lightpurple dark:text-gray-900 text-gray-100 font-sm rounded-lg text-sm px-5 py-2.5 me-2 mb-2 bg-purple font-semibold"
+                  className="text-center inline-flex items-center border-none dark:bg-neonblue bg-greenblue dark:text-blackground dark:hover:text-blackground hover:text-stone-100 text-stone-100 font-sm rounded-lg text-sm px-5 py-2.5 me-2 mb-2 font-semibold"
                 >
-                  Learn more <ArrowRight className="ml-2 h-5 w-5" />{" "}
+                  Learn more <ArrowRight className="ml-2 h-5 w-5" />
                 </a>
               </div>
+              <img
+                alt="Logo"
+                src="/steellm-docs/img/eel.svg"
+                className="lg:mt-0 lg:col-span-4 lg:flex w-[28rem] object-fit-cover max-w-full"
+              />
             </div>
           </div>
         </section>
@@ -73,11 +70,10 @@ export default function Home(): JSX.Element {
               <div className="flex flex-col justify-center lg:pr-8 lg:pt-4">
                 <div className="lg:max-w-lg">
                   <p className="mt-4 text-lg leading-6 text-gray-700 dark:text-gray-100">
-                    Discover s-elBat, the cutting-edge solution for Semantic
-                    Table Interpretation (STI) that sets a new standard.
-                    Combining both supervised and unsupervised approaches,
-                    s-elBat effectively addresses all key STI challenges,
-                    offering unparalleled accuracy and efficiency.
+                    lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
+                    do eiusmod tempor incididunt ut labore et dolore magna
+                    aliqua. Ut enim ad minim veniam, quis nostrud exercitation
+                    ullamco laboris nisi ut aliquip ex ea commodo consequat.
                   </p>
                   <p className="mt-4 text-lg leading-6 text-gray-700 dark:text-gray-100">
                     Key Features:
@@ -88,7 +84,7 @@ export default function Home(): JSX.Element {
                         <div className="inline font-bold text-gray-900 dark:text-gray-300">
                           <feature.icon
                             aria-hidden="true"
-                            className="absolute left-1 top-1 h-5 w-5 text-primaryGreen dark:text-secondaryGreen"
+                            className="absolute left-1 top-1 h-5 w-5 text-greenblue dark:text-neonblue"
                           />
                           {feature.name}
                         </div>

tailwind.config.js

@@ -16,8 +16,10 @@ module.exports = {
         lg: "997px",
       },
       colors: {
-        purple: "#33027C",
-        lightpurple: "#bba8d7",
+        neonblue: "#02E3E3",
+        greenblue: "#1E6464",
+        background: "#FEFEFE",
+        blackground: "#001414",
       },
     },
   },