add man pages for shell commands and implement mkdir, ping, matrix, and about commands

src/components/TerminalShell.tsx

@@ -1,6 +1,7 @@
 import React, { useState, useRef, useEffect } from 'react';
 import { Terminal } from 'lucide-react';
 import { System } from '../shell/system';
+import '../styles/matrix.css';
 
 const TerminalShell: React.FC = () => {
     const [history, setHistory] = useState<string[]>(['Welcome to the terminal! Type "help" for commands.']);
@@ -20,12 +21,13 @@ const TerminalShell: React.FC = () => {
             if (system.knowsCommand(cmdName)) {
                 const output = system.executeCommand(cmdName, args);
 
-                const newLines = output.split('\\n').filter(l => l);
+                const newLines = output.split('\n').filter(l => l);
 
                 setHistory(prev => [...prev, `$ ${command}`, ...newLines]);
             } else {
                 setHistory(prev => [...prev, `$ ${command}`, `Command not found: ${cmdName}`]);
             }
+
             setCurrentCommand('');
         }
     };
@@ -34,8 +36,8 @@ const TerminalShell: React.FC = () => {
         <div className="h-full flex flex-col">
             <div className="flex-1 overflow-y-auto mb-4">
                 {history.map((line, index) => (
-                    <div key={index} className="mb-2">
-                        {line}
+                    <div key={index} className="mb-2" dangerouslySetInnerHTML={{ __html: line }}>
+                        {/* Dangerously set inner HTML */}
                     </div>
                 ))}
                 <div ref={bottomRef} />