OS

<script> function openProgram(programId) { const programs = document.querySelectorAll('#appWindows > div'); programs.forEach(program => program.classList.add('hidden')); document.getElementById(programId).classList.remove('hidden'); } // Calculator let calcExpression = ''; function calcInput(value) { calcExpression += value; document.getElementById('calcDisplay').value = calcExpression; } function calcClear() { calcExpression = ''; document.getElementById('calcDisplay').value = calcExpression; } function calcCalculate() { try { calcExpression = eval(calcExpression).toString(); document.getElementById('calcDisplay').value = calcExpression; } catch (e) { calcExpression = ''; document.getElementById('calcDisplay').value = 'Error'; } } // Settings function changeTheme() { const theme = document.getElementById('themeSelect').value;</script><style> body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; margin: 0; background-color: #f3f3f3; } #startMenu { background-color: #0078d7; color: white; padding: 10px; display: flex; justify-content: space-around; border-radius: 10px 10px 0 0; } #startMenu button { background-color: #005a9e; color: white; border: none; padding: 10px 20px; cursor: pointer; font-size: 16px; border-radius: 50px; } #startMenu button:hover { background-color: #004682; } #appWindow { margin: 20px; padding: 20px; background-color: white; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 10px; } #statusBar { background-color: #eeeeee; padding: 10px; display: flex; justify-content: space-between; border-radius: 0 0 10px 10px; } .hidden { display: none; } #calculator div { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; } #calculator button { padding: 20px; font-size: 18px; border-radius: 50%; border: none; background-color: #0078d7; color: white; cursor: pointer; } #calculator button:hover { background-color: #005a9e; } #settings div { margin: 10px 0; } header { background-color: #1877f2; color: white; padding: 1rem; text-align: center; border-radius: 10px 10px 0 0; } nav { background-color: #ffffff; padding: 1rem; text-align: center; border-radius: 0 0 10px 10px; } main { max-width: 800px; margin: 0 auto; padding: 1rem; background-color: #ffffff; border-radius: 10px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } footer { text-align: center; padding: 1rem; background-color: #f0f2f5; border-radius: 0 0 10px 10px; } .post-form { margin-top: 1rem; } .post-form textarea { width: 100%; padding: 0.5rem; border: 1px solid #ccc; border-radius: 10px; resize: vertical; } .post-form button { margin-top: 0.5rem; background-color: #1877f2; color: white; border: none; border-radius: 10px; padding: 0.5rem 1rem; cursor: pointer; } .post { background-color: #f9f9f9; border: 1px solid #ddd; border-radius: 10px; padding: 1rem; margin-top: 1rem; } </style>