Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
@Kevin-771
Kevin-771 authored May 24, 2024
1 parent 9a9c6d3 commit 7c2cab6
Show file tree
Hide file tree
Showing 3 changed files with 119 additions and 65 deletions.
20 changes: 20 additions & 0 deletions send_email.php
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$name = htmlspecialchars($_POST['name']);
$email = htmlspecialchars($_POST['email']);
$message = htmlspecialchars($_POST['message']);

$to = "[email protected]"; // Replace with your email address
$subject = "New Contact Form Submission";
$body = "Name: $name\nEmail: $email\n\nMessage:\n$message";
$headers = "From: $email";

if (mail($to, $subject, $body, $headers)) {
echo "Message successfully sent.";
} else {
echo "Message delivery failed.";
}
} else {
echo "Invalid request method.";
}
?>
77 changes: 77 additions & 0 deletions styles.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
}

h2 {
font-weight: bold;
}

header {
background-color: #333;
color: #fff;
padding: 10px 0;
text-align: center;
}

nav {
display: flex;
justify-content: center;
background-color: #444;
}

nav a {
color: #fff;
padding: 14px 20px;
text-decoration: none;
text-align: center;
}

nav a:hover {
background-color: #555;
}

.container {
padding: 20px 100px;
}

.gallery img {
width: 100%;
height: auto;
}

.gallery {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 10px;
}

.custom-submit-button {
background-color: #4CAF50;
color: white;
padding: 1em;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 1em;
transition: background-color 0.3s ease;
}

.custom-submit-button:hover {
background-color: #45a049;
}

.custom-submit-button:active {
background-color: #3e8e41;
}

footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 10px 0;
bottom: 0;
width: 100%;
}
87 changes: 22 additions & 65 deletions testing.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,98 +4,55 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tattoo Portfolio</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
}
header {
background-color: #333;
color: #fff;
padding: 10px 0;
text-align: center;
}
nav {
display: flex;
justify-content: center;
background-color: #444;
}
nav a {
color: #fff;
padding: 14px 20px;
text-decoration: none;
text-align: center;
}
nav a:hover {
background-color: #555;
}
.container {
padding: 20px;
}
.gallery img {
width: 100%;
height: auto;
}
.gallery {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 10px;
}
footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 10px 0;
position: fixed;
bottom: 0;
width: 100%;
}
</style>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<h1>Tattoo Portfolio</h1>
</header>
<!--
<nav>
<a href="#home">Home</a>
<a href="#about">About</a>
<a href="#gallery">Gallery</a>
<a href="#contact">Contact</a>
<a href="#contact">Contact Us</a>
</nav>
//-->
<div class="container" id="home">
<h2>Welcome to My Tattoo Portfolio</h2>
<p>Explore my collection of tattoos and learn more about my work.</p>
</div>
<div class="container" id="about">
<h2>About Me</h2>
<p>I am a professional tattoo artist with over 10 years of experience. My passion is creating unique and meaningful designs for my clients.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ac ultricies leo. Maecenas vel euismod odio, nec elementum dolor. Praesent vestibulum eget nisi at molestie. Etiam euismod ullamcorper justo, et cursus enim sollicitudin vel. In hac habitasse platea dictumst. Praesent congue tellus non nisi maximus facilisis. Proin tempor massa lorem, ut elementum nibh tempus at. In ornare vulputate metus, vitae porta felis efficitur quis. Nam viverra et sapien sed tincidunt. Curabitur malesuada at orci at rhoncus.</p>
</div>
<div class="container gallery" id="gallery">
<div class="container" id="gallery_description">
<h2>Gallery</h2>
<img src="tattoo1.jpg" alt="Tattoo 1">
<img src="tattoo2.jpg" alt="Tattoo 2">
<img src="tattoo3.jpg" alt="Tattoo 3">
<img src="tattoo4.jpg" alt="Tattoo 4">
<img src="tattoo5.jpg" alt="Tattoo 5">
<img src="tattoo6.jpg" alt="Tattoo 6">
<p>Explore my tattoo portfolio.</p>
</div>
<div class="container gallery" id="gallery">
<img src="images/07.jpg" alt="Tattoo 1">
<img src="images/07.jpg" alt="Tattoo 2">
<img src="images/07.jpg" alt="Tattoo 3">
<img src="images/07.jpg" alt="Tattoo 4">
<img src="images/07.jpg" alt="Tattoo 5">
<img src="images/07.jpg" alt="Tattoo 6" onclick="window.open('https://google.com/');">
</div>
<div class="container" id="contact">
<h2>Contact</h2>
<h2>Contact us</h2>
<p>If you have any questions or would like to book an appointment, please reach out to me.</p>
<form>
<form action="send_email.php" method="post">
<label for="name">Name:</label><br>
<input type="text" id="name" name="name"><br>
<input type="text" id="name" name="name" required><br>
<label for="email">Email:</label><br>
<input type="email" id="email" name="email"><br>
<input type="email" id="email" name="email" required><br>
<label for="message">Message:</label><br>
<textarea id="message" name="message" rows="4" cols="50"></textarea><br>
<input type="submit" value="Submit">
<textarea id="message" name="message" rows="4" cols="50" required></textarea><br>
<button type="submit" class="custom-submit-button">Submit</button>
</form>
</div>
<footer>
<p>&copy; 2024 Tattoo Portfolio. All rights reserved.</p>
</footer>
</body>
</html>
</html>

0 comments on commit 7c2cab6

Please sign in to comment.