Enhance PyodideRunner fullscreen functionality: Updated the fullscreen toggle to automatically display the code editor when entering fullscreen mode. Improved user experience by ensuring the code editor is visible by default and auto-resizes to fit content. Additionally, added programming languages to skills list and refined styles in index.astro for better layout consistency.

Author: AhmedAlfahdi

src/components/PyodideRunner.astro

@@ -213,6 +213,9 @@ const { code, title = "Python Code" } = Astro.props;
     button.addEventListener('click', function() {
       const btn = this as HTMLButtonElement;
       const runner = btn.closest('.pyodide-runner') as HTMLElement;
+      const codeWrapper = runner?.querySelector('.code-editor-wrapper') as HTMLElement;
+      const toggleBtn = runner?.querySelector('.toggle-code-btn') as HTMLButtonElement;
+      const textarea = runner?.querySelector('.python-code') as HTMLTextAreaElement;
 
       if (!runner) return;
 
@@ -221,9 +224,21 @@ const { code, title = "Python Code" } = Astro.props;
         runner.classList.remove('fullscreen');
         document.body.style.overflow = '';
       } else {
-        // Enter fullscreen
+        // Enter fullscreen - show code by default
         runner.classList.add('fullscreen');
         document.body.style.overflow = 'hidden';
+        
+        // Show code editor if it's hidden
+        if (codeWrapper && codeWrapper.style.display === 'none') {
+          codeWrapper.style.display = 'flex';
+          if (toggleBtn) {
+            toggleBtn.textContent = 'Hide Code';
+          }
+          // Auto-resize to fit content
+          if (textarea) {
+            autoResizeTextarea(textarea);
+          }
+        }
       }
     });
   });

src/pages/index.astro

@@ -74,6 +74,7 @@ import BaseLayout from '../layouts/BaseLayout.astro';
               <li>SBC prototyping</li>
               <li>Software development and reverse engineering</li>
               <li>Frontend and backend development</li>
+              <li>Programming languages: Assembly (x86-64), C, C++, Python</li>
             </ul>
           </li>
           <li>
@@ -82,6 +83,7 @@ import BaseLayout from '../layouts/BaseLayout.astro';
               <li>Windows/Linux</li>
               <li>Docker (containerization)</li>
               <li>Documentation (LaTeX/Markdown/Typst)</li>
+              <li>Obsidian (knowledge management)</li>
             </ul>
           </li>
           <li>
@@ -422,6 +424,8 @@ import BaseLayout from '../layouts/BaseLayout.astro';
     animation-fill-mode: forwards;
     word-spacing: -0.2em;
     letter-spacing: -0.02em;
+    border-bottom: none;
+    padding-bottom: 0;
   }
 
   .h1-n-wrapper {