-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathfooter.html
101 lines (93 loc) · 4.66 KB
/
footer.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<style>
body {
position: relative;
overflow: auto; /* Allow scrolling */
min-height: 100vh; /* Allows body to grow if content exceeds viewport */
margin: 0; /* Remove default margin */
color: white; /* Change text color to white */
}
a {
color: white; /* Change link color to white */
text-decoration: underline; /* Optional */
}
body::before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: url("https://i.pinimg.com/564x/a6/a9/71/a6a9715630d57ab92852b87153acf0cb.jpg");
background-size: cover;
background-repeat: no-repeat;
filter: blur(8px);
z-index: -1; /* Keeps the background behind other content */
}
</style>
Nếu bạn có câu hỏi hay thắc mắc nào, đừng ngần ngại liên hệ với mình qua Gmail. Bên cạnh đó, nếu bạn muốn xem lại các bài viết trước đây của mình, hãy nhấn vào hai nút dưới đây để truy cập trang **Rpubs** hoặc mã nguồn trên **Github**. Rất vui được đồng hành cùng bạn, hẹn gặp lại! 😄😄😄
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contact Me</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/svgs/rstudio.svg">
<style>
body { font-family: Arial, sans-serif; background-color: #f9f9f9; }
.container { max-width: 400px; margin: auto; padding: 20px; background: white; border-radius: 8px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); }
label { display: block; margin: 10px 0 5px; }
input[type="email"] { width: 100%; padding: 10px; margin-bottom: 15px; border: 1px solid #ccc; border-radius: 4px; }
.github-button, .rpubs-button { margin-top: 20px; text-align: center; }
.github-button button, .rpubs-button button { background-color: #333; color: white; border: none; padding: 10px; cursor: pointer; border-radius: 4px; width: 100%; }
.github-button button:hover, .rpubs-button button:hover { background-color: #555; }
.rpubs-button button { background-color: #75AADB; }
.rpubs-button button:hover { background-color: #5A9BC2; }
.rpubs-icon { margin-right: 5px; width: 20px; vertical-align: middle; filter: brightness(0) invert(1); }
.error-message { color: red; font-size: 0.9em; margin-top: 5px; }
</style>
</head>
<body>
<div class="container">
<h2>Contact Me</h2>
<form id="emailForm">
<label for="email">Your Email:</label>
<input type="email" id="email" name="email" required aria-label="Email Address">
<div class="error-message" id="error-message" style="display: none;">Please enter a valid email address.</div>
<button type="submit">Send Email</button>
</form>
<div class="github-button">
<button>
<a href="https://github.com/Loccx78vn" target="_blank" style="color: white; text-decoration: none;">
<i class="fab fa-github"></i> View Code on GitHub
</a>
</button>
</div>
<div class="rpubs-button">
<button>
<a href="https://rpubs.com/loccx" target="_blank" style="color: white; text-decoration: none;">
<img src="https://cdn.jsdelivr.net/npm/[email protected]/icons/rstudio.svg" alt="RStudio icon" class="rpubs-icon"> Visit my RPubs
</a>
</button>
</div>
</div>
<script>
document.getElementById('emailForm').addEventListener('submit', function(event) {
event.preventDefault(); // Prevent default form submission
const emailInput = document.getElementById('email');
const email = emailInput.value;
const errorMessage = document.getElementById('error-message');
// Simple email validation regex
const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (emailPattern.test(email)) {
errorMessage.style.display = 'none'; // Hide error message
const yourEmail = '[email protected]'; // Your email
const gmailLink = `https://mail.google.com/mail/?view=cm&fs=1&to=${yourEmail}&su=Help%20Request%20from%20${encodeURIComponent(email)}`;
window.open(gmailLink, '_blank'); // Open in new tab
} else {
errorMessage.style.display = 'block'; // Show error message
}
});
</script>
</body>
</html>