diff --git a/assets/css/main.css b/assets/css/main.css
index d5cfa68..5975b58 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -275,4 +275,8 @@ ul.marquee li, ul.marquee2 li {
   to {
     transform: translateX(0%);
   }
+}
+
+article > * {
+  overflow-wrap:anywhere;
 }
\ No newline at end of file
diff --git a/includes/keys.html b/includes/keys.html
index 102ab2a..0e7c4a5 100644
--- a/includes/keys.html
+++ b/includes/keys.html
@@ -1,8 +1,8 @@
 <div class="fixed bottom-0 left-0 z-[999999] hidden p-3 space-x-2 xl:flex">
-    <button @click="document.getElementById('prev-active-button').click()" @keydown.left.window="$el.classList.remove('opacity-90')" @keyup.left.window="$el.classList.add('opacity-90')" class="relative flex items-center justify-center w-10 h-10 font-medium border border-gray-200 rounded-md shadow-sm opacity-90 bg-gradient-to-b from-white to-gray-50">
+    <button @click="document.getElementById('prev-active-button').click()" @keydown.left.window="$el.classList.remove('opacity-90')" @keyup.left.window="$el.classList.add('opacity-90')" class="relative flex items-center justify-center w-10 h-10 dark:text-white font-medium border border-gray-200 rounded-md shadow-sm opacity-90 bg-gradient-to-b from-white to-gray-50 dark:from-gray-800 dark:to-gray-900 dark:border-gray-800">
         <svg @keydown.left.window="$el.classList.remove('opacity-30')" @keyup.left.window="$el.classList.add('opacity-30')" class="flex-shrink-0 w-4 h-4 fill-current opacity-30" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><path fill="none" d="M0 0h256v256H0z"/><path d="M163.06 40.61a8 8 0 0 0-8.72 1.73l-80 80a8 8 0 0 0 0 11.32l80 80A8 8 0 0 0 168 208V48a8 8 0 0 0-4.94-7.39Z"/></svg>
     </button>
-    <button @click="document.getElementById('next-active-button').click()" @keydown.right.window="$el.classList.remove('opacity-90')" @keyup.right.window="$el.classList.add('opacity-90')" class="relative flex items-center justify-center w-10 h-10 font-medium border border-gray-200 rounded-md shadow-sm opacity-90 bg-gradient-to-b from-white to-gray-50">
+    <button @click="document.getElementById('next-active-button').click()" @keydown.right.window="$el.classList.remove('opacity-90')" @keyup.right.window="$el.classList.add('opacity-90')" class="relative flex items-center justify-center w-10 h-10 dark:text-white font-medium border border-gray-200 rounded-md shadow-sm opacity-90 bg-gradient-to-b from-white to-gray-50 dark:from-gray-800 dark:to-gray-900 dark:border-gray-800">
         <svg @keydown.right.window="$el.classList.remove('opacity-30')" @keyup.right.window="$el.classList.add('opacity-30')" class="flex-shrink-0 w-4 h-4 fill-current opacity-30" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><path fill="none" d="M0 0h256v256H0z"/><path d="m181.66 122.34-80-80A8 8 0 0 0 88 48v160a8 8 0 0 0 13.66 5.66l80-80a8 8 0 0 0 0-11.32Z"/></svg>
     </button>
 </div>
\ No newline at end of file
diff --git a/pages/docs/[content].html b/pages/docs/[content].html
index 94737e3..5cfc8ce 100644
--- a/pages/docs/[content].html
+++ b/pages/docs/[content].html
@@ -1,7 +1,7 @@
 <layout title="Wave · {frontmatter.title}" src="main.html">
    
     <div class="border-t border-gray-200 dark:border-neutral-800">
-        <div  class="flex items-start w-full px-6 mx-auto break-all max-w-7xl md:px-8 docs">
+        <div  class="flex items-start w-full px-6 mx-auto max-w-7xl md:px-8 docs">
 
             <include src="sidebar.html"></include>