mobile view fixes

config.toml

@@ -1,5 +1,5 @@
 # The URL the site will be built for
-base_url = "https://www4.ourverse.tf"
+base_url = "https://ourverse.tf"
 # Change this to your own URL! Please note this variable **must** be uncommented.
 
 title = "ThreeFold"

content/_index.md

@@ -23,9 +23,7 @@ extra:
 
 ## **IMETANATION**
 
-The only truly decentralized metaverse
+The only truly decentralized metaverse on the planet awaits you
-
-on the planet awaits you
 
 <button>[EXPLORE](#explore)</a></button>
 

content/footer/_index.md

@@ -1,10 +1,10 @@
 ---
 title: "Footer"
-description: "The alternative to the current too centralized and unsustainable internet."
+description: "The only truly decentralized metaverse on the planet awaits you."
 insert_anchor_links: "left"
 extra:
   logoPath: "/images/OurVerse-logo.png"
-  socialLinks: { Facebook: "https://", Github: "https://", Twitter: "https://" }
+  socialLinks: { Github: "https://" }
 ---
 
 {% row(style="center narrow invert-color" bgColor="#2d103e") %}

css/index.css

@@ -68,19 +68,19 @@ img[src*="#tft_img"] {
     @apply font-semibold;
   }
   h2 {
-    @apply text-4xl lg:text-8xl font-normal leading-none;
+    @apply text-5xl lg:text-8xl font-normal leading-none;
   }
   h2 strong {
     @apply font-medium;
   }
   h3 {
-    @apply text-xl lg:text-6xl font-normal leading-none;
+    @apply text-3xl lg:text-6xl font-normal leading-none;
   }
   h3 strong {
     @apply font-semibold;
   }
   h4 {
-    @apply text-sm lg:text-4xl font-normal;
+    @apply text-xl lg:text-4xl font-normal;
   }
   h5 {
     @apply text-md my-1 tracking-widest text-zinc-500 font-semibold;
@@ -89,7 +89,7 @@ img[src*="#tft_img"] {
     @apply text-md not-italic font-normal my-1;
   }
   p {
-    @apply text-2xl leading-tight;
+    @apply text-lg lg:text-2xl leading-tight;
     font-family: "Lato", sans-serif;
   }
   blockquote {

templates/partials/header.html

@@ -61,15 +61,15 @@
     function showHamburger() {
         document.getElementById('header-container').className = "overflow-hidden";
         document.getElementById('hamburger').className = "fixed mt-16 z-20 top-0 inset-x-0 transition transform origin-top-right";
-        document.getElementById('hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out";
+        document.getElementById('hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
-        document.getElementById('close-hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out";
+        document.getElementById('close-hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
     }
 
     function hideHamburger() {
         document.getElementById('header-container').className = "";
         document.getElementById('hamburger').className = "hidden absolute z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden";
-        document.getElementById('hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out";
+        document.getElementById('hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
-        document.getElementById('close-hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out";
+        document.getElementById('close-hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
         if (displayedMenu !== "") { hideMenu(displayedMenu); }
     }
 
@@ -90,20 +90,20 @@
 <header id="header-container">
     <div class="z-10 bg-white fixed w-screen">
         <div class="relative z-50 shadow">
-        <div class="mx-auto flex z-50 shadow justify-between items-center px-6 lg:py-5 sm:px-8 md:px-12 py-2 lg:px-20 lg:justify-start lg:space-x-20">
+        <div class="mx-auto flex z-50 shadow justify-between items-center pl-6 pr-2 md:pl-0 md:pr-0 lg:py-5 sm:px-8 md:px-12 py-2 lg:px-20 lg:justify-start lg:space-x-20">
             <div>
                 <a href="/" class="flex">
                     <img class="w-32 h-auto sm:w-15" src="{{section.extra.logoPath}}" alt="Ourworld Logo" />
                 </a>
             </div>
             <div class="-mr-2 -my-2 lg:hidden">
-                <button id="hamburger-btn" type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out">
+                <button id="hamburger-btn" type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2">
                     <!-- Heroicon name: menu -->
                     <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                     <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
                     </svg>
                 </button>
-            <button id="close-hamburger-btn" type="button" class="hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out">
+            <button id="close-hamburger-btn" type="button" class="hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2">
                 <!-- Heroicon name: x -->
                 <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                     <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
@@ -213,7 +213,6 @@
                           <p class="text-gray-500 text-base leading-6 ">
                             {{section.description}}
                           </p>
-                          {% include "partials/socialLinks.html" %}
                       </div>
                     </nav>                    
                 </div>

templates/shortcodes/row.html

@@ -19,7 +19,7 @@ Parameters:
     {% set row_class = row_class ~ " lg:items-center" %}
 {% endif %}
 
-{% set col_class = "flex-1 mb-8 md:mb-0 md:mx-8" %}
+{% set col_class = "flex-1 mb-20 lg:mb-0 lg:mx-8" %}
 
 {% if style %}
 
@@ -37,7 +37,7 @@ Parameters:
             {% set col_class = col_class ~ "flex-1 lg:m-0 " %}
             {% set row_class = row_class ~ " lg:ml-20 " %}
         {% else %}
-            {% set col_class = col_class ~ "flex-1 m-4 lg:m-0 " %}
+            {% set col_class = col_class ~ "flex-1 lg:m-0 " %}
         {% endif %}    
         {% else %}
             {% set row_class = row_class ~ " mx-8 " %}

templates/shortcodes/space.html

@@ -1 +1 @@
-<div class="h-60"></div>
+<div class="h-20 lg:h-60"></div>