From 2a9a4443be840ac440a00789446b26e90ac9d4e4 Mon Sep 17 00:00:00 2001
From: Alexander Dimitrov <xavortm@gmail.com>
Date: Thu, 22 Aug 2024 12:53:07 +0300
Subject: [PATCH] Increase content width, style updates to ToC'

---
 src/css/custom.css        |  3 ++-
 src/css/global-footer.css | 16 +++++++++++++---
 src/css/global-site.css   |  2 +-
 src/css/toc.css           | 32 ++++++++++++++++++++++++++++++++
 src/css/variables.css     |  5 +++--
 5 files changed, 51 insertions(+), 7 deletions(-)
 create mode 100644 src/css/toc.css

diff --git a/src/css/custom.css b/src/css/custom.css
index f0a1b18..f51a55d 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -18,4 +18,5 @@
 @import "global-sidebar";
 @import "homepage-search";
 @import "homepage-components";
-@import "docs-content";
\ No newline at end of file
+@import "docs-content";
+@import "toc";
diff --git a/src/css/global-footer.css b/src/css/global-footer.css
index fe2f081..4e4b470 100644
--- a/src/css/global-footer.css
+++ b/src/css/global-footer.css
@@ -1,6 +1,12 @@
 .footer {
   padding-inline: 0;
   border-top: 2px solid var(--ifm-color-secondary-lightest);
+
+  & > .container {
+    padding: 0;
+    margin: 0;
+    max-width: 100%;
+  }
 }
 
 .footer-about {
@@ -10,7 +16,7 @@
 
 .footer-about-inner {
   margin: 0 auto;
-  max-width: var(--wide-width);
+  max-width: var(--normal-width);
   text-align: center;
 }
 
@@ -57,6 +63,10 @@
   background-color: var(--ifm-color-primary-dark);
 }
 
+.footer__links {
+  max-width: var(--normal-width);
+  margin: 0 auto;
+}
 
 .footer-10up {
   padding: 3rem var(--ifm-spacing-horizontal);
@@ -64,7 +74,7 @@
 
 .footer-10up .wrap {
   margin: 0 auto;
-  max-width: var(--wide-width);
+  max-width: var(--normal-width);
   text-align: center;
 }
 
@@ -96,4 +106,4 @@
   .footer-10up p {
     margin: 0;
   }
-}
\ No newline at end of file
+}
diff --git a/src/css/global-site.css b/src/css/global-site.css
index dfcec0d..d9babfd 100644
--- a/src/css/global-site.css
+++ b/src/css/global-site.css
@@ -32,7 +32,7 @@ main > .container {
 }
 
 .content-wrapper {
-  width: var(--wide-width);
+  width: var(--normal-width);
   margin-inline: auto;
 }
 
diff --git a/src/css/toc.css b/src/css/toc.css
new file mode 100644
index 0000000..a5cbf7b
--- /dev/null
+++ b/src/css/toc.css
@@ -0,0 +1,32 @@
+.table-of-contents {
+  border-left: none;
+
+  & li {
+	margin: 0 0.25rem 0 0;
+
+	& ul {
+	  margin-left: 0.75rem;
+	}
+  }
+
+  & a {
+	padding: var(--ifm-menu-link-padding-vertical) var(--ifm-menu-link-padding-horizontal);
+	text-decoration: none;
+	border-radius: .5rem;
+
+	&:hover {
+	  color: var(--ifm-color-primary);
+	  text-decoration: underline;
+	}
+  }
+
+  & .table-of-contents__link--active {
+	outline: 1px solid #ddd;
+	box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.1);
+	font-weight: 700;
+  }
+
+  & code {
+	font-size: inherit;
+  }
+}
diff --git a/src/css/variables.css b/src/css/variables.css
index 5dcd84a..11c2c39 100644
--- a/src/css/variables.css
+++ b/src/css/variables.css
@@ -20,7 +20,7 @@
   --ifm-link-decoration: underline;
   --ifm-link-hover-color: var(--ifm-color-primary-dark);
   --ifm-code-font-size: 1rem;
-  --ifm-container-width-xl: 80ch;
+  --ifm-container-width-xl: 120ch;
   --ifm-container-width: 80ch;
   --ifm-font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI",
     Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
@@ -36,6 +36,7 @@
   --c-10up-secondary-dark: #7ED5D4;
   
   --wide-width: min(calc(100vw - 2.5rem), calc(var(--ifm-container-width-xl) + 300px));
+  --normal-width: min(calc(100vw - 2.5rem), calc(var(--ifm-container-width) + 300px));
 
   --docusaurus-highlighted-code-line-bg: #e0e0e0;
-}
\ No newline at end of file
+}