diff --git a/Easy/MayureshSurveIssue10/RetroCon.jpeg b/Easy/MayureshSurveIssue10/RetroCon.jpeg new file mode 100644 index 0000000..b3e6bd8 Binary files /dev/null and b/Easy/MayureshSurveIssue10/RetroCon.jpeg differ diff --git a/Easy/MayureshSurveIssue10/back.png b/Easy/MayureshSurveIssue10/back.png new file mode 100644 index 0000000..63eb9f3 Binary files /dev/null and b/Easy/MayureshSurveIssue10/back.png differ diff --git a/Easy/MayureshSurveIssue10/calc.css b/Easy/MayureshSurveIssue10/calc.css new file mode 100644 index 0000000..e7c4c65 --- /dev/null +++ b/Easy/MayureshSurveIssue10/calc.css @@ -0,0 +1,52 @@ +*{ + font-family: "Press Start 2P"; +} + +body{ + background: url(retrobg.jpeg) no-repeat center center fixed; + background-size: 100vw 100vh; + overflow: hidden; + margin: 2em 0em; +} + +.calculator{ + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + width: 100vw; + height: 100vh; + gap: 0.25em; +} + +.display{ + width: 69.5%; + height: 1.5em; + font-size: 2em; + text-align: right; + background: transparent; + color: white; +} + +.back{ + width: 3.25em; + height: 3.25em; +} + +.options{ + display: grid; + grid-template-columns: repeat(4,1fr); + gap: 1em; + margin-bottom: 4em; + max-width: 70vw; + max-height: 70vh; + width: 75%; + height: 50%; +} + +button{ + font-size: 0.5em; + padding: 1em; + color: white; + background-color: rgb(127, 136, 117); +} \ No newline at end of file diff --git a/Easy/MayureshSurveIssue10/calc.html b/Easy/MayureshSurveIssue10/calc.html new file mode 100644 index 0000000..066bf52 --- /dev/null +++ b/Easy/MayureshSurveIssue10/calc.html @@ -0,0 +1,59 @@ + + + + + + Retro PC | Calculator + + + + + + + + + +
+
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ + + + \ No newline at end of file diff --git a/Easy/MayureshSurveIssue10/calc.png b/Easy/MayureshSurveIssue10/calc.png new file mode 100644 index 0000000..3c6c221 Binary files /dev/null and b/Easy/MayureshSurveIssue10/calc.png differ diff --git a/Easy/MayureshSurveIssue10/close.png b/Easy/MayureshSurveIssue10/close.png new file mode 100644 index 0000000..49a54a0 Binary files /dev/null and b/Easy/MayureshSurveIssue10/close.png differ diff --git a/Easy/MayureshSurveIssue10/gallery.png b/Easy/MayureshSurveIssue10/gallery.png new file mode 100644 index 0000000..f7051a6 Binary files /dev/null and b/Easy/MayureshSurveIssue10/gallery.png differ diff --git a/Easy/MayureshSurveIssue10/index.html b/Easy/MayureshSurveIssue10/index.html new file mode 100644 index 0000000..d1a98ee --- /dev/null +++ b/Easy/MayureshSurveIssue10/index.html @@ -0,0 +1,35 @@ + + + + + + Retro Personal Computer + + + + + + + + + +
+
+
+

My PC

+
+
+

Gallery

+
+
+

Calculator

+
+ +
+
+ + + + \ No newline at end of file diff --git a/Easy/MayureshSurveIssue10/mypc.png b/Easy/MayureshSurveIssue10/mypc.png new file mode 100644 index 0000000..82e13a5 Binary files /dev/null and b/Easy/MayureshSurveIssue10/mypc.png differ diff --git a/Easy/MayureshSurveIssue10/next.png b/Easy/MayureshSurveIssue10/next.png new file mode 100644 index 0000000..6fbfa42 Binary files /dev/null and b/Easy/MayureshSurveIssue10/next.png differ diff --git a/Easy/MayureshSurveIssue10/retro.css b/Easy/MayureshSurveIssue10/retro.css new file mode 100644 index 0000000..afe3288 --- /dev/null +++ b/Easy/MayureshSurveIssue10/retro.css @@ -0,0 +1,131 @@ +*{ + font-family: "Press Start 2P"; +} + +body{ + background: url(retrobg.jpeg) no-repeat center center fixed; + background-size: 100vw 100vh; + overflow: hidden; + margin: 2em 0em; +} + +.bg{ + width: 100vw; + height: 100vh; + align-items: center; + margin: 2em 0em; +} + +.home{ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + gap: 3em; + width: 100vw; + height: 100vh; +} + +.app{ + display: flex; + flex-direction: column; + align-items: center; +} + +.appname{ + font-size: 0.7em; + text-align: center; + color: white; +} + +.homeimg, .back{ + width: 3.25em; + height: 3.25em; +} + + +.box{ + display: none; + margin-top: 3em; + margin-left: 3.5em; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + position: relative; + gap: 0.5em; + max-width:100vw; + max-height: 100vh; + width: 90%; + height: 80%; + padding: 0.75em; +} + +.back{ + position: absolute; + left: 5.25em; +} + +.gallery{ + display: grid; + grid-template-columns: repeat(3,1fr); + grid-template-rows: repeat(3,1fr); + gap: 2em; + height: auto; +} + +.userimg{ + width: 100%; + max-width: 7em; + height: auto; + border: 1px solid rgb(191, 191, 191); +} + +.popup{ + display: none; + z-index: 1000; + position: fixed; + top: 0; + left: 50%; + transform: translate(-50%,50%); + width: 22em; + height: 22em; + background-color: rgb(179, 179, 179); + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: center; + border: 1px solid gray; +} + +.close, .prev, .next{ + width:2em; + height:2em; +} + +.close{ + background-color: rgb(169, 29, 29); + margin-right: 0.25em; +} + +.navbar, .slide{ + display: flex; + justify-content: space-between; + align-items: center; + width: 22em; + background-color: rgb(22, 22, 112); + border: 1px solid white; + border-left: 0; + border-right: 0; +} + +.popimg{ + margin-top: 0.25em; + width: 16em; + height: 16em; +} + +.name{ + color:white; + margin-left: 0.25em; +} \ No newline at end of file diff --git a/Easy/MayureshSurveIssue10/retrobg.jpeg b/Easy/MayureshSurveIssue10/retrobg.jpeg new file mode 100644 index 0000000..fb2c4d1 Binary files /dev/null and b/Easy/MayureshSurveIssue10/retrobg.jpeg differ diff --git a/Easy/MayureshSurveIssue10/script.js b/Easy/MayureshSurveIssue10/script.js new file mode 100644 index 0000000..545bf61 --- /dev/null +++ b/Easy/MayureshSurveIssue10/script.js @@ -0,0 +1,54 @@ + +let ans = document.querySelector('.display'); + + +function appendValue(value) { + console.log("Before : ", ans.value) + ans.value += value; + console.log("After : ", ans.value) +} + +function cleardisplay() { + ans.value = ""; +} + +function del() { + ans.value = ans.value.slice(0,-1); +} + +function dtor(degrees) { + return degrees*(Math.PI/180); +} + +function rtod(radians) { + return radians*(180/Math.PI); +} + +function calc() { + + try{ + let expression = ans.value; + + expression = expression.replace(/÷/g,'/'); + expression = expression.replace(/x/g,'*'); + expression = expression.replace(/sin⁻¹([^)]+)/g,'rtod(Math.asin($1))'); + expression = expression.replace(/cos⁻¹([^)]+)/g,'rtod(Math.acos($1))'); + expression = expression.replace(/tan⁻¹([^)]+)/g,'rtod(Math.atan($1))'); + expression = expression.replace(/\bsin([^)]+)/g,'Math.sin(dtor($1))'); + expression = expression.replace(/\bcos([^)]+)/g,'Math.cos(dtor($1))'); + expression = expression.replace(/\btan([^)]+)/g,'Math.tan(dtor($1))'); + expression = expression.replace(/π/g,'Math.PI'); + expression = expression.replace(/e/g,'Math.E'); + expression = expression.replace(/\^/g,'**'); + expression = expression.replace(/√([^)]+)/g,'Math.sqrt($1)'); + + let answer = eval(expression); + + ans.value = answer; + } + + catch(error) { + ans.value = "Error"; + } +} +