Skip to content

zekena / Unit-calculator

Go to a project
Commit f1f29dab by zekena
Options

contact+styles

parent 3ab4db56
Inline Side-by-side
Showing with 205 additions and 121 deletions
categories/contact.php 0 → 100644
<?php
if (isset($_POST["submit"])) {
if (empty($_POST["name"])) {
$error .= '<p><label class="text-danger">Please Enter your Name</label></p>';
} else {
$name = clean_text($_POST["name"]);
if (!preg_match("/^[a-zA-Z ]*$/", $name)) {
$error .= '<p><label class="text-danger">Only letters and white space allowed</label></p>';
}
}
if (empty($_POST["email"])) {
$error .= '<p><label class="text-danger">Please Enter your Email</label></p>';
} else {
$email = clean_text($_POST["email"]);
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
$error .= '<p><label class="text-danger">Invalid email format</label></p>';
}
}
if (empty($_POST["message"])) {
$error .= '<p><label class="text-danger">Message is required</label></p>';
} else {
$message = clean_text($_POST["message"]);
}
if ($error == '') {
$file_open = fopen("contact_data.csv", "a");
$no_rows = count(file("contact_data.csv"));
if ($no_rows > 1) {
$no_rows = ($no_rows - 1) + 1;
}
$form_data = array(
'sr_no' => $no_rows,
'name' => $name,
'email' => $email,
'message' => $message
);
fputcsv($file_open, $form_data);
$error = '<label class="text-success">Thank you for contacting us</label>';
$name = '';
$email = '';
$message = '';
}
}
categories/contact_data.csv 0 → 100644
Name,Email,Message
contact_data.csv 0 → 100644
zeyad
23facas
zida@gma.com
3,zeyad,zida@gma.com,23facas
4,zeyad,zida@gma.com,23facas
5,zeyad,zida@gma.com,23facas
6,zeyad,zida@gma.com,23facas
css/simp-Volume.css
...@@ -137,7 +137,7 @@ body{background-image: url("../Volume.jpg"); ...@@ -137,7 +137,7 @@ body{background-image: url("../Volume.jpg");
border-radius: 17px; border-radius: 17px;
width: 50%; width: 50%;
position: relative; position: relative;
top: 150px; top: 10px;
} }
#theme { #theme {
position: relative; position: relative;
......
css/simp-area.css
...@@ -137,7 +137,7 @@ body{ background-image: url("../Area.jpg"); ...@@ -137,7 +137,7 @@ body{ background-image: url("../Area.jpg");
border-radius: 17px; border-radius: 17px;
width: 50%; width: 50%;
position: relative; position: relative;
top: 150px; top: 10px;
} }
#theme { #theme {
position: relative; position: relative;
......
css/simp-length.css
...@@ -133,13 +133,12 @@ body{ ...@@ -133,13 +133,12 @@ body{
-moz-box-shadow: 16px 1px 15px -1px rgba(0,0,0,0.61); -moz-box-shadow: 16px 1px 15px -1px rgba(0,0,0,0.61);
box-shadow: 16px 1px 15px -1px rgba(0,0,0,0.61); box-shadow: 16px 1px 15px -1px rgba(0,0,0,0.61);
background-color: #3FB74F; background-color: #3FB74F;
padding:25px 32px; padding:5px 32px;
height:50%; height:50%;
border-radius: 17px; border-radius: 17px;
width: 50%; width: 80%;
position: relative; position: relative;
top: 150px; top: 10px;
} }
#theme { #theme {
position: relative; position: relative;
......
css/simp-speed.css
...@@ -139,7 +139,7 @@ body{ ...@@ -139,7 +139,7 @@ body{
border-radius: 17px; border-radius: 17px;
width: 50%; width: 50%;
position: relative; position: relative;
top: 150px; top: 10px;
} }
#theme { #theme {
position: relative; position: relative;
......
css/simp-temp.css
...@@ -135,9 +135,9 @@ body{background-image: url("../temp.jpg"); ...@@ -135,9 +135,9 @@ body{background-image: url("../temp.jpg");
height:50%; height:50%;
border-radius: 17px; border-radius: 17px;
width: 50%; width: 80%;
position: relative; position: relative;
top: 150px; top: 10px;
} }
#theme { #theme {
position: relative; position: relative;
......
css/simp-weight.css
...@@ -139,7 +139,7 @@ body{ ...@@ -139,7 +139,7 @@ body{
border-radius: 17px; border-radius: 17px;
width: 50%; width: 50%;
position: relative; position: relative;
top: 150px; top: 10px;
} }
#theme { #theme {
position: relative; position: relative;
......
home.html → home.php
<?php
$name = '';
$email = '';
$message = '';
if ($_POST['submit']) {
$name = $_POST['name'];
$message = $_POST['message'];
$email = $_POST['email'];
}
$file_open = fopen("contact_data.csv", "a");
$no_rows = count(file("contact_data.csv"));
if ($no_rows > 1) {
$no_rows = ($no_rows - 1) + 1;
}
$form_data = array(
'sr_no' => $no_rows,
$name,
$email,
$message
);
fputcsv($file_open, $form_data);
$error = '<label class="text-success">Thank you for contacting us</label>';
$name = '';
$email = '';
$subject = '';
$message = '';
?>
<!DOCTYPE html> <!DOCTYPE html>
<!-- <!--
This is the front page of the unit calculator, This is the front page of the unit calculator,
the user can choose between three themes: the user can choose between three themes:
Simple, Fancy and Currency conversion Simple, Fancy and Currency conversion
--> -->
<html lang="en"> <html lang="en">
<head>
<head>
<title>Unit Calc.</title> <title>Unit Calc.</title>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="description" content="Unit Calc."> <meta name="description" content="Unit Calc.">
<meta name="author" content="Yusef,Zeyad"> <meta name="author" content="Yusef,Zeyad">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--Browsing for Tablet or Phone dimensions--> <!--Browsing for Tablet or Phone dimensions-->
<link rel="stylesheet" href="css/style.css"/> <link rel="stylesheet" href="css/style.css" />
<style> <style>
@import url('https://fonts.googleapis.com/css?family=Passion+One|Roboto+Slab'); @import url('https://fonts.googleapis.com/css?family=Passion+One|Roboto+Slab');
#myBtn {
display: none; #myBtn {
position: fixed; display: none;
bottom: 20px; position: fixed;
right: 30px; bottom: 20px;
z-index: 99; right: 30px;
font-size: 18px; z-index: 99;
border: none; font-size: 18px;
outline: none; border: none;
background-color: rgb(108, 53, 176); outline: none;
color: white; background-color: rgb(108, 53, 176);
cursor: pointer; color: white;
padding: 15px; cursor: pointer;
border-radius: 4px; padding: 15px;
} border-radius: 4px;
}
#myBtn:hover {
background-color: #555; #myBtn:hover {
} background-color: #555;
</style> }
</head> </style>
<body> </head>
<button onclick="topFunction()" id="myBtn" title="Go to top">Top</button>
<script> <body>
// When the user scrolls down 20px from the top of the document, show the button <button onclick="topFunction()" id="myBtn" title="Go to top">Top</button>
window.onscroll = function() {scrollFunction()}; <script>
// When the user scrolls down 20px from the top of the document, show the button
function scrollFunction() { window.onscroll = function() {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) { scrollFunction()
};
function scrollFunction() {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
document.getElementById("myBtn").style.display = "block"; document.getElementById("myBtn").style.display = "block";
} else { } else {
document.getElementById("myBtn").style.display = "none"; document.getElementById("myBtn").style.display = "none";
}
}
// When the user clicks on the button, scroll to the top of the document
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
} }
}
// When the user clicks on the button, scroll to the top of the document
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
</script> </script>
<a class="navbar"> <a class="navbar">
<span class ="open-slide"> <span class="open-slide">
<a href="#" onclick="openSlideMenu()"> <a href="#" onclick="openSlideMenu()">
<svg width="30" height="30"> <svg width="30" height="30">
<path d="M0,5 30,5" stroke="#000" stroke-width="5"/> <path d="M0,5 30,5" stroke="#000" stroke-width="5" />
<path d="M0,14 30,14" stroke="#000" stroke-width="5"/> <path d="M0,14 30,14" stroke="#000" stroke-width="5" />
<path d="M0,23 30,23" stroke="#000" stroke-width="5"/> <path d="M0,23 30,23" stroke="#000" stroke-width="5" />
</svg> </svg>
</a> </a>
</span> </span>
</nav> </nav>
<div id="side-menu" class="side-nav"> <div id="side-menu" class="side-nav">
<a href="#" class="btn-close" onclick="closeSlideMenu()">&times;</a> <a href="#" class="btn-close" onclick="closeSlideMenu()">&times;</a>
<a href ="#">About Us</a> <a href="#">About Us</a>
<a href="categories/length.php">Length</a> <a href="categories/length.php">Length</a>
<a href="categories/temperature.php">Temperature</a> <a href="categories/temperature.php">Temperature</a>
<a href="categories/area.php">Area</a> <a href="categories/area.php">Area</a>
...@@ -79,90 +112,90 @@ Simple, Fancy and Currency conversion ...@@ -79,90 +112,90 @@ Simple, Fancy and Currency conversion
<a href="categories/speed.php">Speed</a> <a href="categories/speed.php">Speed</a>
<a href="login">Log in</a> <a href="login">Log in</a>
<a href="login/signup.php">Sign up</a> <a href="login/signup.php">Sign up</a>
</div> </div>
<script src="js/frontSide.js"></script> <script src="js/frontSide.js"></script>
<section id="banner"> <section id="banner">
<div class="inner"> <div class="inner">
<header> <header>
<h1>Unit Calc.</h1> <h1>Unit Calc.</h1>
<p> An interactive Unit Calculator for all your needs. </p> <p> An interactive Unit Calculator for all your needs. </p>
<a href="#main" class="more">Choose Conversion</a> <a href="#main" class="more">Choose Conversion</a>
</header> </header>
<a class="log" href="/login/index.html">login <a class="log" href="/login/index.html">login
<p>Restore your calculations</p></a> <p>Restore your calculations</p></a>
</div> </div>
</section> </section>
<div id="main"> <div id="main">
<div class="inner"> <div class="inner">
<div id="items" class ="box"> <div id="items" class="box">
<div class="box"> <div class="box">
<a href="" class="image fit"><img src="icons/length.png" width="400" height="355" alt="Length" /></a> <a href="" class="image fit"><img src="icons/length.png" width="400" height="355" alt="Length" /></a>
<div class="inner"> <div class="inner">
<h2>Length</h2> <h2>Length</h2>
<a href="categories/length.php" class="button style3 fit" >Select</a> <a href="categories/length.php" class="button style3 fit">Select</a>
</div>
</div> </div>
</div>
<div class="box"> <div class="box">
<a href="" class="image fit"><img src="icons/area.png" width="400" height="355" alt="Area" /></a> <a href="" class="image fit"><img src="icons/area.png" width="400" height="355" alt="Area" /></a>
<div class="inner"> <div class="inner">
<h2>Area</h2> <h2>Area</h2>
<a href="categories/area.php" class="button style3 fit">Select</a> <a href="categories/area.php" class="button style3 fit">Select</a>
</div> </div>
</div> </div>
<div class="box"> <div class="box">
<a href="" class="image fit"><img src="icons/temperature.png" width="400" height="355" alt="Temperature" /></a> <a href="" class="image fit"><img src="icons/temperature.png" width="400" height="355" alt="Temperature" /></a>
<div class="inner"> <div class="inner">
<h2>Temperature</h2> <h2>Temperature</h2>
<a href="categories/temperature.php" class="button style3 fit">Select</a> <a href="categories/temperature.php" class="button style3 fit">Select</a>
</div> </div>
</div> </div>
<div class="box"> <div class="box">
<a href="" class="image fit"><img src="icons/volume.png" width="400" height="355" alt="Volume" /></a> <a href="" class="image fit"><img src="icons/volume.png" width="400" height="355" alt="Volume" /></a>
<div class="inner"> <div class="inner">
<h2>Volume</h2> <h2>Volume</h2>
<a href="categories/volume.php" class="button style3 fit">Select</a> <a href="categories/volume.php" class="button style3 fit">Select</a>
</div> </div>
</div> </div>
<div class="box"> <div class="box">
<a href="" class="image fit"><img src="icons/weight.png" width="400" height="355" alt="Weight" /></a> <a href="" class="image fit"><img src="icons/weight.png" width="400" height="355" alt="Weight" /></a>
<div class="inner"> <div class="inner">
<h2>Weight</h2> <h2>Weight</h2>
<a href="categories/weight.php" class="button style3 fit">Select</a> <a href="categories/weight.php" class="button style3 fit">Select</a>
</div> </div>
</div> </div>
<div class="box"> <div class="box">
<a href="" class="image fit"><img src="icons/speed.png" width="400" height="355" alt="speed" /></a> <a href="" class="image fit"><img src="icons/speed.png" width="400" height="355" alt="speed" /></a>
<div class="inner"> <div class="inner">
<h2>Speed</h2> <h2>Speed</h2>
<a href="categories/speed.php" class="button style3 fit">Select</a> <a href="categories/speed.php" class="button style3 fit">Select</a>
</div> </div>
</div> </div>
</div>
</div> </div>
</div>
</div> </div>
<footer id="footer"> <footer id="footer">
<div class="inner"> <div class="inner">
<section> <section>
<h3>Contact Us</h3> <h3>Contact Us</h3>
<form method="POST" action=""> <form id="Contact_form" method="POST" action="">
<div class="entry"> <div class="entry">
<input id="Input" class="Input-text" name="name" placeholder="Name"> <input id="Input-name" class="Input-text" name="name" placeholder="Name" required>
<input id="Input" class="Input-text" type="email" name="email" placeholder="Email"> <input id="Input-email" class="Input-text" type="email" name="email" placeholder="Email" required>
<input id="Input" class="Input-text" name="message" placeholder="Message"> <input id="Input-message" class="Input-text" name="message" placeholder="Message" required>
</div> </div>
<div class="registerSubmit"> <div class="registerSubmit">
<input type="submit" name="submit" value="Submit"> <input type="submit" name="submit" value="Submit">
</div> </div>
</form> </form>
<div id="results"></div>
</section> </section>
</footer> </footer>
</body> </body>
</html> </html>
\ No newline at end of file \ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment