Simple Web Calculator

A visually appealing, responsive, and user-friendly calculator designed for basic arithmetic operations. This project provides a seamless calculation experience with clear error handling and a modern dark UI, and works smoothly on both desktop and mobile browsers.

✨ Features

• Basic Arithmetic: Addition, subtraction, multiplication, division
• Clear, Modern UI: Dark-themed, professional calculator look
• Live Input & Results: Responsive user input display and instant output
• Decimal & Large Number Support: Graceful handling of decimals and big values
• Error Handling: Alerts for calculation mistakes and invalid input
• Fast Keyboard-Free Operation: Click-to-enter numbers/operators; “AC” (All Clear) and “DEL” (Delete last character) for control
• Special Button Layout: '0' spans two columns, '=' button spans two rows for easier usability
• Google Fonts: Uses ‘Roboto Mono’ for clear, stylish numerals
• Fully Responsive Design: Mobile and desktop optimized

🗂️ Project Structure

├── index.html      # Main HTML file: interface & structure
├── 1style.css      # CSS styling: modern dark theme, CSS Grid, responsive design
├── script.js       # Calculator logic: all UI interactions and computation
├── LICENSE         # MIT License
└── README.md       # Documentation

🚀 Getting Started

Requirements

• Modern browser (Chrome, Firefox, Safari, Edge)
• Internet connection (for Google Fonts on first load)
• JavaScript enabled

Installation

1. Clone or Download:

   git clone https://github.com/TacticalReader/Simple-Web-Calculator.git

   Or download as ZIP and extract.

2. Open Calculator: Double-click index.html (or right-click → Open with… → your browser).

🕹️ Usage

• Entering Numbers: Use digit buttons (0–9)
• Operations: Click +, -, ×, or ÷
• Decimal: Use . for decimals
• Result: Click = for calculation
• Clear: Click AC to reset all
• Delete: Click DEL to remove last character/digit
• Error Handling: Invalid operations show browser alert

Examples:

• 5 + 3 = → Output: 8
• 12 / 4 = → Output: 3

🔧 Customization

• Styling: Tweak 1style.css for colors and layout using CSS Grid
• Fonts: Uses Roboto Mono from Google Fonts (customizable in HTML/CSS)
• Responsive: Mobile and desktop support by default; adjust breakpoints as needed

🛠️ Technology Stack

• HTML5: Layout and structure
• CSS3 (Grid): Layout, colors, responsive breakpoints
• JavaScript (ES6+): Calculator logic and interactive UI
• Google Fonts: For typography

🤝 Contributing

Contributions welcome!

• Fork this repository
• Create a new branch
• Make your changes and submit a pull request
• Check issues for improvements/bugs

📄 License

Licensed under the MIT License.

📝 Acknowledgments

• Roboto Mono by Google Fonts: for clear, modern text
• UI inspired by popular calculator apps

---