├── Styles ├── cute-cat.gif ├── yes.css └── styles.css ├── script.js ├── yes.html ├── README.md └── index.html /Styles/cute-cat.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanurkarPrateek/Valentines_Day_Proposal/HEAD/Styles/cute-cat.gif -------------------------------------------------------------------------------- /script.js: -------------------------------------------------------------------------------- 1 | function nextPage() { 2 | window.location.href = "yes.html"; 3 | } 4 | 5 | function moveButton() { 6 | var x = Math.random() * (window.innerWidth - document.getElementById('noButton').offsetWidth); 7 | var y = Math.random() * (window.innerHeight - document.getElementById('noButton').offsetHeight); 8 | document.getElementById('noButton').style.left = `${x}px`; 9 | document.getElementById('noButton').style.top = `${y}px`; 10 | } 11 | -------------------------------------------------------------------------------- /yes.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 |

11 |

12 |

Hoorayy!!!

13 |

14 |

15 |

16 |

17 | 18 |

You're now Prateek's gf

19 |

20 | 21 | 22 |

Congratulations on this special moment! 🎉 Customize this page to capture and celebrate your unique love story. 💑💖

23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Valentine's Day Website 2 | 3 | A cute Valentine's Day website to express your love! 💖 4 | 5 | ## Getting Started 6 | 7 | These instructions will help you clone and run the project on your local machine. 8 | 9 | ### Prerequisites 10 | 11 | Make sure you have the following installed on your machine: 12 | 13 | - Git 14 | - A modern web browser 15 | 16 | ### Clone the Repository 17 | 18 | Open your terminal and run the following command to clone the repository: 19 | 20 | ```bash 21 | git clone https://github.com/YourUsername/ValentinesDayWebsite.git 22 | ``` 23 | 24 | ### Navigate to the Project Folder 25 | ```bash 26 | cd ValentinesDayWebsite 27 | ``` 28 | 29 | ### Open the Website 30 | Open the index.html file in your preferred web browser. 31 | ```bash 32 | # Example for Linux 33 | xdg-open index.html 34 | 35 | # Example for macOS 36 | open index.html 37 | 38 | # Example for Windows 39 | start index.html 40 | ``` 41 | 42 | # Customization 43 | Feel free to customize the content and styles to make the website your own! You can modify the HTML, CSS, and add your own images. 44 | 45 | ## Contributing 46 | 47 | Pull requests are welcome. For major changes, please open an issue first 48 | to discuss what you would like to change. 49 | -------------------------------------------------------------------------------- /Styles/yes.css: -------------------------------------------------------------------------------- 1 | body { 2 | display: flex; 3 | justify-content: center; 4 | align-items: center; 5 | height: 100vh; 6 | background-color: #CBE6EF; 7 | } 8 | 9 | /* Position the "No" button absolutely within body */ 10 | #noButton { 11 | position: absolute; 12 | margin-left: 150px; 13 | transition: 0.5s; 14 | /* Smooth movement */ 15 | } 16 | 17 | #yesButton { 18 | position: absolute; 19 | margin-right: 150px; 20 | /* Smooth movement */ 21 | } 22 | 23 | .header_text, .text { 24 | font-family: 'Nunito'; 25 | font-size: 50px; 26 | font-weight: bold; 27 | color: white; 28 | text-align: center; 29 | margin-top: 0px; 30 | margin-bottom: 0; 31 | } 32 | 33 | .buttons { 34 | display: flex; 35 | flex-direction: row; 36 | justify-content: center; 37 | align-items: center; 38 | margin-top: 40px; /* Adjusted for better spacing */ 39 | margin-left: 20px; 40 | /* optional: adds some space between the buttons */ 41 | } 42 | 43 | .btn { 44 | background-color: #80c3d8; 45 | color: white; 46 | padding: 15px 32px; 47 | text-align: center; 48 | display: inline-block; 49 | font-size: 16px; 50 | margin: 4px 2px; 51 | cursor: pointer; 52 | border: none; 53 | border-radius: 12px; 54 | transition: background-color 0.3s ease; 55 | } 56 | 57 | .btn:hover { 58 | background-color: #FAF9F6; 59 | } 60 | 61 | .gif_container { 62 | display: flex; 63 | justify-content: center; 64 | align-items: center; 65 | } 66 | 67 | -------------------------------------------------------------------------------- /Styles/styles.css: -------------------------------------------------------------------------------- 1 | body { 2 | display: flex; 3 | justify-content: center; 4 | align-items: center; 5 | height: 100vh; 6 | background-color: #CBE6EF; 7 | } 8 | 9 | /* Position the "No" button absolutely within body */ 10 | #noButton { 11 | position: absolute; 12 | margin-left: 150px; 13 | transition: 0.5s; 14 | border: 2px solid #ffffff; 15 | box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); /* Add a 2px horizontal, 2px vertical, 5px blur, and 0.3 opacity shadow */ 16 | } 17 | 18 | #yesButton { 19 | position: absolute; 20 | margin-right: 150px; 21 | border: 2px solid #ffffff; 22 | box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); 23 | } 24 | 25 | 26 | 27 | .header_text { 28 | font-family: 'Nunito'; 29 | font-size: 50px; 30 | font-weight: bold; 31 | color: white; 32 | text-align: center; 33 | margin-top: 20px; 34 | margin-bottom: 0px; 35 | } 36 | 37 | .buttons { 38 | display: flex; 39 | flex-direction: row; 40 | justify-content: center; 41 | align-items: center; 42 | margin-top: 55px; 43 | margin-left: 20px; 44 | /* optional: adds some space between the buttons */ 45 | } 46 | 47 | .btn { 48 | background-color: #80c3d8; 49 | color: white; 50 | padding: 15px 32px; 51 | text-align: center; 52 | display: inline-block; 53 | font-size: 16px; 54 | margin: 4px 2px; 55 | cursor: pointer; 56 | border: none; 57 | border-radius: 12px; 58 | transition: background-color 0.3s ease; 59 | } 60 | 61 | .btn:hover { 62 | background-color: #FAF9F6; 63 | } 64 | 65 | .gif_container { 66 | display: flex; 67 | justify-content: center; 68 | align-items: flex-end; /* Align to the bottom */ 69 | margin-left: 20px; /* Adjusted for consistency */ 70 | } 71 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 25 | 26 | 27 |

28 |

29 |

Will you be my valentine? hehe

30 |

31 |

32 |

33 |

34 |

35 | 36 | 37 |

38 | 39 | 40 |

41 | Made with love and a sprinkle of creativity by Prateek 💖✨. 42 | ⭐Star the repo on GitHub. 43 |

44 |

45 | 46 | 47 | --------------------------------------------------------------------------------