Wedding Invitation :ring:

SAVE THE DATE: APR 24, 2021
akhiarya.netlify.app

Wedding Invitation :ring:

View Invitation

Inivitation letter

A kerala style wedding inivitaion website designed for my friend's marriage. This invitation website is inspired from clean and amazing work of Vinitshahdeo. Take a look and feel free to give him a star.

Additional features

• A responsive photo gallery
• Embedded pre wedding video (muted)
  • Because the main attraction of the original content is in the background score.

Feel free to use this template to build your wedding website!

To reuse this, follow the steps:

• Replace the date in script.js to have a timer running for your big day!

// Set the date we're counting down to
var countDownDate = new Date("Nov 29, 2020 00:00:00").getTime();

• If you wish to change the track which plays on click, edit the src in index.html

<div class="music">
   <audio src="./assets/mp3/song.mp3" id="my_audio" loop="loop"></audio> 
</div>

Song: Inkem Inkem by Gopi Sundar. Cover: flutesiva

• *Responsive image gallery can be modified by adding the images in /assets/img folder . Also change the paths in the html index.html.

body {
  margin: 0;
  padding: 0;
}

.containerw3 {

	display: flex;
	overflow: hidden;
	flex-wrap: wrap;
	margin: -2.5px;
}
.containerw3:after {
	content: '';
	flex-grow: 999999999;
	min-width: 200px;
	height: 0;
}
.containerw3 > * {
	position: relative;
	display: block;
	height: 250px;
	margin: 2.5px;
	flex-grow: 1;
}
.containerw3 > * > img {
	height: 250px;
	object-fit: cover;
	max-width: 100%;
	min-width: 100%;
	vertical-align: bottom;
}
.containerw3.containerw3-margin {
	margin: 2.5px;
}

Html part:

<div class="containerw3 containerw3-margin">
            <a href="#">
                <img src="assets/img/d11.webp" />
            </a>
</div>

• *Pre-wedding video
  • Save the video in the /assests/video folder and replace the file name index.html.

<div>
<video width="100%" height="100%" autoplay loop muted>
  <source src="assets/video/save_s.mp4" type="video/mp4">
  <source src="assets/video/save_s.mp4" type="video/ogg">
Your browser does not support the video tag.
</video>
</div>

• *Bonus tip. You can replace the beautiful flowers on the top of the website with Cassia fistula and yellow flower shower.

Do not forget to leave a star! :hugs:

^{With warm regards,
Arun Gopinath}