site upgraded

docs/index.md

@@ -1,19 +1,26 @@
 ---
+title: Home
 hide:
   - navigation
   - toc
 ---
-# <center>Welcome to **TiLearn**!<center/>
+<div class="homepage-background"></div>
 
-Welcome to our open-source project dedicated to time management and scheduling solutions. This platform is designed to empower individuals and teams to optimize their daily routines, enhance productivity, and achieve their goals more efficiently. By providing a range of tools and resources, we aim to foster a community-driven approach to managing time and tasks effectively. Whether you're a student, a professional, or simply looking to make the most of your day, our project offers innovative strategies and customizable schedules to help you stay on track. Join us in building a future where time management is accessible to everyone.
+<div class="homepage-content">
+  <h1 style="font-size: 5em;">Welcome to <strong>TiLearn</strong>!</h1>
+  <p>
+    Welcome to our open-source project dedicated to <strong>time management</strong> and <strong>scheduling solutions</strong>. This platform is designed to empower individuals and teams to optimize their daily routines, enhance productivity, and achieve their goals more efficiently. By providing a range of tools and resources, we aim to foster a community-driven approach to managing time and tasks effectively. Whether you're a student, a professional, or simply looking to make the most of your day, our project offers innovative strategies and customizable schedules to help you stay on track. Join us in building a future where time management is accessible to everyone.
+  </p>
+  <p>
+    Join us in creating a community where time management tools and effective scheduling practices are accessible to all.
+  </p>
+  <br/>
+  <center><a href="https://github.com/Bancie/TiLearn">
+      <button class="button-29" role="button"><p style="word-spacing: 5px;"><img src="stylesheets/github-mark.png" alt="GitHub Logo" style="width: 25px; height: 25px; margin-right: 10px;"><strong>GitHub</strong></p></button>
+  </a></center>
+  <br/>
+  <!--- <h2>Web mapping</h2> --->
 
-Join us in creating a community where time management tools and effective scheduling practices are accessible to all.
+  <p><em>For any questions, suggestions, or collaborations, feel free to reach out to me. I'm excited to connect with fellow enthusiasts and contributors!</em></p>
 
-<center><a href="https://github.com/Bancie/TiLearn">
-    <button class="button-29" role="button"><p style="word-spacing: 5px;">:fontawesome-brands-github: GitHub</p></button>
-</a></center>
-
-## Web mapping
-
-
-*For any questions, suggestions, or collaborations, feel free to reach out to me. I'm excited to connect with fellow enthusiasts and contributors!*
+</div>

docs/stylesheets/extra.css

@@ -1,4 +1,4 @@
-/* CSS */
+/* Button - github */
 .button-29 {
   align-items: center;
   appearance: none;
@@ -11,23 +11,23 @@
   cursor: pointer;
   display: inline-flex;
   font-family: "JetBrains Mono",monospace;
-  height: 48px;
+  height: 60px;
   justify-content: center;
   line-height: 1;
   list-style: none;
   overflow: hidden;
-  padding-left: 16px;
-  padding-right: 16px;
+  padding-left: 40px;
+  padding-right: 40px;
   position: relative;
   text-align: left;
   text-decoration: none;
-  transition: box-shadow .15s,transform .15s;
+  transition: box-shadow .5s,transform .5s;
   user-select: none;
   -webkit-user-select: none;
   touch-action: manipulation;
   white-space: nowrap;
   will-change: box-shadow,transform;
-  font-size: 18px;
+  font-size: 25px;
 }
 
 .button-29:focus {
@@ -43,3 +43,50 @@
   box-shadow: #3c4fe0 0 3px 7px inset;
   transform: translateY(2px);
 }
+
+/* Font style */
+
+body {
+  font-family: 'M PLUS 1 Code', monospace;
+  margin: 0;
+  padding: 0;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  font-family: 'M PLUS 1 Code', monospace;
+  font-weight: bold; /* Use bold font weight for headings */
+}
+
+p, li, span, a {
+  font-family: 'M PLUS 1 Code', monospace;
+  font-weight: 400; /* Normal font weight for regular text */
+}
+
+/* Background */
+
+/* Light theme background */
+.homepage-background {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-image: url('background-light.png'); /* Light theme background */
+  background-size: cover;
+  background-repeat: no-repeat;
+  background-position: center;
+  opacity: 0.85;
+  z-index: -1;
+}
+
+/* Styles for the content on the homepage */
+.homepage-content {
+  position: relative;
+  z-index: 1;
+  padding: 20px;
+  text-align: center;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}

mkdocs.yml

@@ -50,7 +50,7 @@ theme:
       primary: indigo
       accent: yellow
   font:
-    text: Open Sans
+    text: Source Code Pro
   logo: tilearn2.png
   favicon: tilearn.png
   icon:
@@ -99,6 +99,7 @@ extra_javascript:
 extra_css:
   - https://unpkg.com/katex@0/dist/katex.min.css
   - stylesheets/extra.css
+  - css/extra.css
 
 copyright: |
   &copy; 2024 <a href="https://web.facebook.com/ngchibangg"  target="_blank" rel="noopener">Bancie Nguyen</a>