Add files via upload

mehedyhassanratul · Feb 14, 2024 · 639066b · 639066b
commit 639066b
Show file tree

Hide file tree

Showing 40 changed files with 993 additions and 0 deletions.
diff --git a/README.md b/README.md
@@ -0,0 +1,40 @@
+# Will You Be My Valentine?
+
+Welcome to the "Will You Be My Valentine?" project, a playful and interactive way to ask that special someone the big question this Valentine's Day. Hosted as a GitHub Page, this project offers a unique blend of creativity and technology to make your Valentine's Day proposal unforgettable.
+
+## Overview
+
+"Will You Be My Valentine?" is a web-based application that presents users with the question "Will you be my valentine?" followed by two options: "Yes" and "No". What makes this project special is the interactive and engaging way it handles responses, especially if someone tries to click "No".
+
+## Features
+
+- **Interactive Question**: The core of the project is the interactive Valentine's Day proposal.
+- **Responsive Design**: Crafted to look great on both desktop and mobile devices.
+- **Playful Interaction**: If the user attempts to click "No", watch out for a little surprise that might just sway their decision!
+
+## Technology
+
+This project is built using simple yet powerful web technologies:
+- HTML
+- CSS
+- JavaScript
+
+## How to View
+
+To experience "Will You Be My Valentine?", simply visit [https://byquangthanh.github.io/valentine.github.io/](https://byquangthanh.github.io/valentine.github.io/) from any modern web browser.
+
+## How to Contribute
+
+Contributions to the "Will You Be My Valentine?" project are more than welcome. Whether it's suggesting new features, improving the design, or fixing bugs, here's how you can contribute:
+
+1. **Fork the Repository**: Start by forking the [project repository](https://github.com/byquangthanh/valentine.github.io) on GitHub.
+2. **Clone Your Fork**: Clone your fork to your local machine for development.
+3. **Create a New Branch**: Make a new branch for your changes.
+4. **Make Your Changes**: Implement your feature, fix, or improvement.
+5. **Commit Your Changes**: Commit your changes with a clear and descriptive commit message.
+6. **Push to Your Fork**: Push your changes up to your fork.
+7. **Open a Pull Request**: Back on GitHub, open a pull request from your fork to the main project.
+
+## Support
+
+If you encounter any issues or have questions about the project, feel free to open an issue on the GitHub repository.
diff --git a/activities.html b/activities.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Activities</title>
+    <link rel="stylesheet" href="css/activities.css" />
+  </head>
+  <body>
+    <div id="activityquestion"><b>What are we doing after?</b></div>
+    <div class="activities-selection">
+      <div class="activity-item">
+        <img src="activities/aquarium.jpeg" alt="aquarium" />
+        <label
+          ><input
+            type="checkbox"
+            name="activities"
+            value="aquarium"
+          />aquarium</label
+        >
+      </div>
+      <div class="activity-item">
+        <img src="activities/arcade.jpeg" alt="arcade" />
+        <label
+          ><input
+            type="checkbox"
+            name="activities"
+            value="arcade"
+          />arcade</label
+        >
+      </div>
+      <div class="activity-item">
+        <img src="activities/cinema.jpeg" alt="cinema" />
+        <label
+          ><input
+            type="checkbox"
+            name="activities"
+            value="cinema"
+          />cinema</label
+        >
+      </div>
+      <div class="activity-item">
+        <img src="activities/keramika.jpeg" alt="ceramics" />
+        <label
+          ><input
+            type="checkbox"
+            name="activities"
+            value="ceramics"
+          />ceramics</label
+        >
+      </div>
+      <div class="activity-item">
+        <img src="activities/kunsthalle.jpeg" alt="kunsthalle" />
+        <label
+          ><input
+            type="checkbox"
+            name="activities"
+            value="kunsthalle"
+          />exhibition</label
+        >
+      </div>
+      <div class="activity-item">
+        <img src="activities/park.jpeg" alt="park.jpeg" />
+        <label
+          ><input
+            type="checkbox"
+            name="activities"
+            value="park.jpeg"
+          />park</label
+        >
+      </div>
+    </div>
+    <button class="button" onclick="location.href='lastpage.html'">
+      Last page ... 
+    </button>
+  </body>
+</html>
diff --git a/activities/aquarium.jpeg b/activities/aquarium.jpeg
diff --git a/activities/arcade.jpeg b/activities/arcade.jpeg
diff --git a/activities/cinema.jpeg b/activities/cinema.jpeg
diff --git a/activities/keramika.jpeg b/activities/keramika.jpeg
diff --git a/activities/kunsthalle.jpeg b/activities/kunsthalle.jpeg
diff --git a/activities/park.jpeg b/activities/park.jpeg
diff --git a/congratulations.mp3 b/congratulations.mp3
diff --git a/css/activities.css b/css/activities.css
@@ -0,0 +1,40 @@
+body {
+  text-align: center;
+  margin-top: 30px;
+  font-family: "Courier";
+  background-color: #fff5e4;
+  color: #ff9494;
+}
+#activityquestion {
+  font-size: 50px;
+  margin-bottom: 30px;
+}
+.activity-item {
+  display: inline-block;
+  margin: 10px;
+  vertical-align: top;
+  color: #ff9494;
+}
+.activity-item img {
+  height: 200px;
+  width: 200px;
+  border-radius: 50%;
+  border: 5px solid #ff9494;
+  object-fit: cover;
+  padding: 10px;
+}
+.activity-item label {
+  display: block;
+}
+.button {
+  padding: 10px 20px;
+  font-size: 18px;
+  cursor: pointer;
+  margin: 10px;
+  font-family: "courier";
+  margin-bottom: 20px;
+  background-color: #ffe3e1;
+  color: #e67373;
+  border-radius: 12px;
+  border: 2px solid #ffe3e1;
+}
diff --git a/css/date.css b/css/date.css
@@ -0,0 +1,60 @@
+body {
+  text-align: center;
+  margin-top: 30px;
+  font-family: "Courier";
+  background-color: #fff5e4;
+  color: #ff9494;
+  display: flex;
+  flex-direction: column;
+}
+h1 {
+  font-size: 40px;
+}
+
+form .header {
+  width: 100%;
+  display: flex;
+  font-size: 20px;
+  margin-bottom: 20px;
+  color: #ff9494;
+}
+
+.form-group {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  font-size: 25px;
+}
+
+.button {
+  padding: 6px 10px;
+  font-size: 15px;
+  cursor: pointer;
+  margin: 10px;
+  font-family: "courier";
+  margin-bottom: 10px;
+  background-color: #ffe3e1;
+  color: #e67373;
+  border-radius: 12px;
+  border: 2px solid #ffe3e1;
+  transition: 0.3s;
+}
+
+.button:hover {
+  background-color: #ff9494;
+  color: #ffe3e1;
+  border: 2px solid #ff9494;
+}
+
+input[type="date"] {
+  padding: 6px 10px;
+  font-size: 15px;
+  cursor: pointer;
+  margin: 10px;
+  font-family: "courier";
+  margin-bottom: 10px;
+  background-color: #ffe3e1;
+  color: #e67373;
+  border-radius: 12px;
+  border: 2px solid #ffe3e1;
+}
diff --git a/css/dessert.css b/css/dessert.css
@@ -0,0 +1,41 @@
+body {
+  text-align: center;
+  margin-top: 30px;
+  font-family: courier;
+  background-color: #fff5e4;
+  color: #ff9494;
+}
+#dessertquestion {
+  font-size: 50px;
+  margin-bottom: 30px;
+  font-weight: bold;
+}
+.dessert-item {
+  display: inline-table;
+  margin: 10px;
+  vertical-align: top;
+  color: #ff9494;
+}
+.dessert-item img {
+  height: 200px;
+  width: 200px;
+  border-radius: 50%;
+  border: 5px solid #ff9494;
+  object-fit: cover;
+  padding: 10px;
+}
+.dessert-item label {
+  display: block;
+}
+.button {
+  padding: 10px 20px;
+  font-size: 18px;
+  cursor: pointer;
+  margin: 10px;
+  font-family: "courier";
+  margin-bottom: 20px;
+  background-color: #ffe3e1;
+  color: #e67373;
+  border-radius: 12px;
+  border: 2px solid #ffe3e1;
+}