changed breakpoints, gap in content block, theme slider bug fixed

styles/main_style.css

@@ -8,7 +8,7 @@
     --serif: Georgia, serif;
     --sans: system-ui, sans-serif;
     --nav-w: 230px;
-    --nav-mobile-w: 60vw;
+    --nav-mobile-w: min(60vw, 400px);
     --font-size: 1rem;
 }
 

styles/mobile_bar_style.css

@@ -18,22 +18,30 @@
 }
 
 #navbar-mobile::before {
-  content: "";
-  position: absolute;
-  inset: 0;
-  background: var(--bg);
-  opacity: 0.992;
-  z-index: -1;
+    content: "";
+    position: absolute;
+    inset: 0;
+    background: var(--bg);
+    opacity: 0.992;
+    z-index: -1;
 }
 
 #navbar-mobile.inactive {
     left: calc(var(--nav-mobile-w) * (-1))
 }
 
-@media (min-width: 1001px) {
+.button-mobile.no-navbar {
+    display: inline-block;
+}
+
+@media (min-width: 1001px) and (min-height: 701px) {
     #navbar-mobile {
         display: none;
     }
+
+    .button-mobile.no-navbar {
+        display: none;
+    }
 }
 
 #navbar-mobile-links {
@@ -146,8 +154,9 @@
     width: 100%;
 }
 
-.mobile-config .switch{
-    margin-left: 40px;;
+.mobile-config .switch {
+    margin-left: 40px;
+    ;
 }
 
 .mobile-config .lang-dropdown {

styles/projects_style.css

@@ -10,7 +10,7 @@
     }
 }
 
-@media (max-width: 1000px) {
+@media (max-width: 1000px) or (max-height: 700px) {
     .main-content {
         margin-left: 0;
         --margin-main-content: 20px;
@@ -42,6 +42,7 @@
     display: grid;
     grid-template-columns: 1fr 1fr;
     overflow: hidden;
+    margin-top: -1px;
 }
 
 .section-header {
@@ -80,12 +81,14 @@
     margin-right: var(--margin-main-content);
     border-left: 1px solid var(--border);
     justify-content: left;
+    margin-left: -0.5px;
 }
 
 .block-image.left {
     margin-left: var(--margin-main-content);
     border-right: 1px solid var(--border);
     justify-content: right;
+    margin-right: -0.5px;
 }
 
 .block-image img {
@@ -140,7 +143,7 @@
     color: var(--text);
 }
 
-.text-link::before{
+.text-link::before {
     content: "";
     width: 100%;
     height: 1.2px;

styles/sidebar_style.css

@@ -14,7 +14,7 @@
     --padding: 30px;
 }
 
-@media (max-width: 1000px) {
+@media (max-width: 1000px) or (max-height: 700px) {
     .sidebar {
         display: none;
     }