Skip to content

ArshdeepSahni/svelte-calculator

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

12 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Svelte-Calculator


NPM downloads


npm i svelte-calculator



npm

Svelte Calculator











Props



Prop About Default Value Format
Sound Key Sounds true Boolean
animation Boolean Value to Enable and Disable Default Animation true Boolean
size Size of Calculator "100" Any Size out of [ "50" , "75" , "90" , "95" , "100" , "105" , "110" , "125" , "150" ]
normalKeyColor Background Color of Normal Numeric Keys of Calculator rgba( 243 , 244 , 246 ) ColorName or rgb or rgba or Hex
operatorKeyColor Background Color of Operator Keys of Calculator rgba( 229 , 231 , 235 ) ColorName or rgb or rgba or Hex
Class Classes to add to the Calculator Component NA ClassName (String)
calculatorBackground Background Color of Calculator #ffffff ColorName or rgb or rgba or Hex
inputBackground Background Color of Screen of Calculator rgba( 229 , 231 , 235 ) ColorName or rgb or rgba or Hex







Steps To Use thus Plugin:


  • 1. Install


    npm i svelte-calculator

  • 2. Import


    // in .js file where you want to use this component
    import Calculator from "svelte-calculator";

  • 4. Usage


    // in the same.js file where you want to use this component outside <script></script> tag
    <Calculator
      size={"200"}
      normalKeyColor="white"
      operatorKeyColor="orange"
      Class={"calculatorClass"}
      animation={true}
      calculatorBackground={"rgba(0,0,0,0.1)"}
      inputBackground={"#DDE5B6"}
    />







+ Developed with ❤️ by Arshdeep Singh