<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Note App</title> <style> body { font-family: Arial, sans-serif; margin: 0; padding: 20px; } textarea { width: 100%; height: 80vh; padding: 10px; font-size: 16px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box; } </style> </head> <body> <textarea id="textarea" placeholder="Write your notes here..." autofocus></textarea> <script> document.addEventListener('DOMContentLoaded', function() { const textarea = document.getElementById('textarea'); const loadValue = () => { const hash = window.location.hash; try { const value = hash ? decodeURIComponent(atob(hash.substring(1))) : ''; textarea.value = value; textarea.selectionStart = value.length; } catch (e) { console.error('Error decoding hash:', e); textarea.value = ''; } }; const storeValue = (value) => window.location.hash = '#' + btoa(encodeURIComponent(value)); textarea.addEventListener('input', () => storeValue(textarea.value), false); window.addEventListener('hashchange', loadValue); loadValue(); }); </script> </body> </html>