https://github.com/dickymuliafiqri/birthday-card
birthday card for your soulmate ❤
https://github.com/dickymuliafiqri/birthday-card
birthday birthday-card
Last synced: 3 months ago
JSON representation
birthday card for your soulmate ❤
- Host: GitHub
- URL: https://github.com/dickymuliafiqri/birthday-card
- Owner: dickymuliafiqri
- Created: 2022-05-18T00:28:37.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2022-05-18T01:10:03.000Z (about 3 years ago)
- Last Synced: 2025-01-15T16:22:57.461Z (4 months ago)
- Topics: birthday, birthday-card
- Language: SCSS
- Homepage: https://damara-birthday.vercel.app/
- Size: 8.34 MB
- Stars: 0
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
Awesome Lists containing this project
README
# Happy Birthday Card
A Web based birthday card to wish your friends and family in a unique way.
Check out the [Preview](https://happy-birthday-card.vercel.app/).
If you liked it, please consider giving it star 🤩⭐. Feel free to fork too 🤗.
---
## How to setup
Setup is very simple. Just edit the configuration object in [config.js](./js/config.js). This is what the configuration object looks like.
```js
export default {
name: "Friend", // actual name of the recipient (Mandatory)
nickname: "Buddy", // nickname(optional)
pic: "", // image url of recipients (Mandatory)
showScrollMsg: true, // set to false if you do not want the scrolling message
openDate: false, // the page only can be opened at this time
timeZone: "Asia/Jakarta", // your timezone, if you use openDate extension
};
```
The `name` and `nickname` are self explainatory and `nickname` is optional. If no nickname is provided, then value of name will be used in its place.
`showScrollMsg` takes `true` or `false`. If set to `false`, the scroll message will be skipped and card will apper directly.
`pic` will take the url of the image of the recipient. This will appear on the birthday card.
`openDate` is used to prevent user open the page too late or too early. Fill this field using this format
mm-dd-yyyy (12-05-2021) or false if you desire to disable it.
### Setting up the pic
You can upload your image to telegra.ph, publish it and then get the image url (image address). It would be good if the image is of 1:1 aspect ratio and not more than 400px in height and width as larger images can affect load times.
Alternatively, you can also manually replace [Asset.png](./resources/img/Asset.png) with your image, make necessary changes at line 97 in [here](./scss/_components.scss) and then rebuild.
---
## Atributions
- Pattern vector created by mokoland - www.freepik.com
- Christmas vector created by freepik - www.freepik.com
- Background vector created by brgfx - www.freepik.com
- Halloween vector created by vectorpouch - www.freepik.com