Added calculator project

This commit is contained in:
BuildTools 2021-03-03 09:47:11 +01:00
parent 1ef296f832
commit 084dbbd664
6 changed files with 144 additions and 8 deletions

65
calc.css Normal file
View file

@ -0,0 +1,65 @@
#eingabe {
resize: none;
overflow: auto;
background-color: rgba(0, 0, 0, 0.5);
color:aliceblue;
height: 100px;
font-family: 'Ubuntu', sans-serif;
font-size: 35px;
width: 400px;
border-top: rgba(0, 0, 0, 0);
border-left: rgba(0, 0, 0, 0);
border-right: rgba(0, 0, 0, 0);
border-bottom: rgba(0, 0, 0, 1);
text-align: right;
}
.numberbutton {
width: 100px;
height: 100px;
background-color: rgba(0, 0, 0, 0.5);
color:aliceblue;
font-family: 'Ubuntu', sans-serif;
font-size: 50px;
border: rgba(0, 0, 0, 0);
margin-left: -2;
margin-right: -2;
}
.zerobutton {
width: 200px;
height: 100px;
background-color: rgba(0, 0, 0, 0.5);
color:aliceblue;
font-family: 'Ubuntu', sans-serif;
font-size: 50px;
border: rgba(0, 0, 0, 0);
margin-left: -3;
}
.comabutton {
width: 100px;
height: 100px;
background-color: rgba(0, 0, 0, 0.5);
color:aliceblue;
font-family: 'Ubuntu', sans-serif;
font-size: 50px;
border: rgba(0, 0, 0, 0);
margin-left: -4;
margin-right: -2;
}
.numberbutton:hover {
background-color: rgba(10, 10, 10, 0.5);
}
.comabutton:hover {
background-color: rgba(10, 10, 10, 0.5);
}
.zerobutton:hover {
background-color: rgba(10, 10, 10, 0.5);
}
.numberbutton:active {
background-color: rgba(110, 110, 110, 0.5);
}
.comabutton:active {
background-color: rgba(110, 110, 110, 0.5);
}
.zerobutton:active {
background-color: rgba(110, 110, 110, 0.5);
}

76
calculator.php Normal file
View file

@ -0,0 +1,76 @@
<html>
<head>
<meta charset="utf-8">
<title>Tronax - Calculator</title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="calc.css">
<link rel="shortcut icon" href="./img/logo.ico">
<link href="https://fonts.googleapis.com/css?family=Roboto:500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Ubuntu&display=swap" rel="stylesheet">
</head>
<body>
<!-- HEADER ---------------------------------------->
<?php
require 'header.php';
?>
<!-- HOME ---------------------------------------->
<section id="imprint" class="container" class="vertical-center">
<form>
<textarea id="eingabe" readonly></textarea>
</br>
<button type="button" onclick="seven()" class="numberbutton" id="7">7</button>
<button type="button" onclick="eight()" class="numberbutton" id="8">8</button>
<button type="button" onclick="nine()" class="numberbutton" id="9">9</button>
<button type="button" onclick="back()" class="numberbutton" id="backspace">«</button>
</br>
<button type="button" onclick="four()" class="numberbutton" id="4">4</button>
<button type="button" onclick="five()" class="numberbutton" id="5">5</button>
<button type="button" onclick="six()" class="numberbutton" id="6">6</button>
<button type="button" onclick="CE()" class="numberbutton" id="ce">CE</button>
</br>
<button type="button" onclick="one()" class="numberbutton" id="1">1</button>
<button type="button" onclick="two()" class="numberbutton" id="2">2</button>
<button type="button" onclick="three()" class="numberbutton" id="3">3</button>
<button type="button" onclick="plus()" class="numberbutton" id="plus">+</button>
</br>
<button type="button" onclick="zero()" class="zerobutton" id="0">0</button>
<button type="button" onclick="coma()" class="comabutton" id="coma">,</button>
<button type="button" onclick="equals()" class="numberbutton" id="equals">=</button>
</form>
</section>
<script>
function one() {
var t1 = document.getElementById("eingabe").value
document.getElementById("eingabe").value = t1 + "1";
}
function two() {
var t1 = document.getElementById("eingabe").value
document.getElementById("eingabe").value = t1 + "2";
}
function three() {
var t1 = document.getElementById("eingabe").value
document.getElementById("eingabe").value = t1 + "3";
}
function four() {
var t1 = document.getElementById("eingabe").value
document.getElementById("eingabe").value = t1 + "4";
}
</script>
<!-- FOOTER ---------------------------------------->
<?php
require 'footer.php';
?>
</body>
</html>

View file

@ -8,7 +8,7 @@
</div>
<nav id="main-nav">
<ul>
<ul id="rightlist">
<li id="twitch"> <a href="https://www.twitch.tv/tronaxyt"><img src="./img/twitchlogo.png" alt="Twitch"></a> </li>
<li id="twitter"> <a href="https://twitter.com/Tronax"><img src="./img/twitterlogo.png" alt="Twitter"></a> </li>
<li id="instagram"> <a href="https://www.instagram.com/tronax_/"><img src="./img/instagramlogo.png" alt="Instagram"></a> </li>

View file

@ -4,7 +4,7 @@
<html>
<head>
<meta charset="utf-8">
<title>Tronax</title>
<title>Tronax - Impressum</title>
<link rel="stylesheet" href="style.css">
<link rel="shortcut icon" href="./img/logo.ico">

View file

@ -1,6 +1,4 @@
<!DOCTYPE html>
<!DOCTYPE html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">

View file

@ -17,7 +17,7 @@ h1, h2, h3, a {
font-family: 'Ubuntu', sans-serif;
font-weight: 500;
color: #494949
text-transform: uppercase;
text-transform: uppsercase;
}
#logo { transition: all 300ms; -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms;}
#biglogo { position: absolute; left: 50%; top:50%; transition: all 300ms; -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms;
@ -105,9 +105,6 @@ footer a {
}
footer a:hover {
text-decoration: underline;
}
#biglogo:hover {
}
#imprint h1 {
font-family: 'Ubuntu', sans-serif;