https://github.com/manuelhenke/ios-calculator-for-web

A calculator as webcomponent following the design of the iOS-Calculator.
https://github.com/manuelhenke/ios-calculator-for-web

calculator javascript js web webcomponent webcomponents webpack

Last synced: 10 months ago
JSON representation

A calculator as webcomponent following the design of the iOS-Calculator.

• Host: GitHub
• URL: https://github.com/manuelhenke/ios-calculator-for-web
• Owner: manuelhenke
• License: mit
• Created: 2020-04-28T08:58:54.000Z (over 6 years ago)
• Default Branch: main
• Last Pushed: 2023-11-10T00:19:17.000Z (over 2 years ago)
• Last Synced: 2025-09-17T04:45:21.194Z (11 months ago)
• Topics: calculator, javascript, js, web, webcomponent, webcomponents, webpack
• Language: JavaScript
• Homepage: https://henkebyte.com/ios-calculator
• Size: 2.44 MB
• Stars: 4
• Watchers: 2
• Forks: 0
• Open Issues: 18
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

          
[![CI](https://github.com/manuelhenke/ios-calculator-for-web/actions/workflows/ci.yml/badge.svg)](https://github.com/manuelhenke/ios-calculator-for-web/actions/workflows/ci.yml)

[![CodeQL](https://github.com/manuelhenke/ios-calculator-for-web/actions/workflows/codeql-analysis.yml/badge.svg)](https://github.com/manuelhenke/ios-calculator-for-web/actions/workflows/codeql-analysis.yml)

[![License](https://img.shields.io/github/license/manuelhenke/ios-calculator-for-web)](./LICENSE)

[![NPM version](https://img.shields.io/npm/v/ios-calculator-for-web.svg?style=flat)](https://www.npmjs.com/package/ios-calculator-for-web)

# ios-calculator-for-web

This is a calculator for the web following the design of the iOS-Calculator.

## Getting Started

Install the package via `npm` or `yarn` and deliver the script to the user.

This can be done via `import`, `require` or just inserting a `script` tag.

```shell

npm i ios-calculator-for-web

```

```shell

yarn add ios-calculator-for-web

```

## Usage

Just add this HTML-Snippet in your code and wrap it into any kind of container.

```html

```

## Example

You can try it at [CodePen](https://codepen.io/manuelhenke/pen/WNXKpbr) or just take a look at the [demo.html](demo.html) included in this project.

![Example Image](ios-calc-example.png)

## License

[MIT License](./LICENSE)