alexonthespot7 / calculator

Calculator front-end project with friendly front-end design and two themes

Calculator

This project uses React.js and has two looks: Light (like Windows calculator) and Dark (inspired by iPhone). It's easy to use, with different backgrounds for computers (videos) and mobiles (pictures).

You can find the final version of the application here.

Table of Contents

• Usage Guide
• Features
• Technologies Used
• Dependencies
• Screenshots

Usage Guide

1. Clone the project
   git clone https://github.com/alexonthespot7/calculator.git
   
2. run the following command in a terminal window (in the complete) directory:
   npm install
   
3. run the following command in a terminal window (in the complete) directory:
   npm start
   
4. Navigate to localhost:3000

Features

• Dual Themes: Choose between a Light theme, reminiscent of Windows calculator, and a Dark theme inspired by the iPhone calculator.

• User-Friendly Interface: The calculator is designed to be easy to use, ensuring a straightforward and intuitive experience.

• Responsive Design: Enjoy a consistent experience across devices, with dynamic backgrounds – videos for computers and images for mobiles.

• Versatile Backgrounds: Backgrounds adapt to the device, providing an immersive environment with videos on computers and personalized images on mobile devices.

Technologies Used

• React.js
• css

Dependencies

• @mui/icons-material (^5.6.2): Material-UI Icons library for customizable icons following Material Design guidelines.
• @material-ui/icons (^4.11.3)
• @mui/material (^5.6.4): Material-UI framework providing pre-designed React components.

Screenshots