+
+-----------------------------------------------------------------------
+Thank you for using Digital Business Card Generator!
+-----------------------------------------------------------------------
+
+Digital Business Card Generator is a free and open-source front-end web application that lets user to quickly generate an interactive and responsive HTML-based digital business card that can be hosted in their website.
+
+Visit https://dbizcard.vercel.app/ for more
+
+-----------------------------------------------------------------------
+
+Follow the instructions given below to get your generated digital business card online
+
+
+The folder named "{{
+ name
+ }}" located next to this file ( README.txt ) contains the generated files. This folder will be referred as "dbizcard folder" throughout this document.
+
+
+
++ I have a personal WordPress website
+
+ - Login to your cPanel account. Locate and open the file manager
+ - In the file manager, locate the folder named "public_html" and create a new folder called "vcard" ( or whatever you like ) inside it.
+ - Upload the dbizcard folder into the new folder that you have created in the previous step
+ - Now your business card should be online at the address https://your-domain.com/vcard/{{
+ name
+ }}/ and is ready to be shared.
+
+
++ My website is maintained by a developer
+
+ - Contact your developer to host the business card for you. Just send them the downloaded package.
+
+
++ We are a company. Our website is maintained by a developer / website administrator.
+
+ - Generate as many business cards you may require for your employees. ( optional )
+ - Contact your developer / website administrator to host the business cards for you. Just send them the downloaded packages.
+
+
++ I'm the developer / administrator of a website
+
+ - Create a folder called "vcard" ( or whatever you like ) in the project"s static folder
+ - Move the dbizcard folder inside the "vcard" folder
+ - Commit changes and deploy.
+ - Now the business card should be online at the address https://your-domain.com/vcard/dbizcard-folder/ and is ready to be shared.
+
+
++ I do not have a website
+
+ - You can host your business card using a free hosting services such as Surge ( https://surge.sh ), a static web hosting service.
+ - System Requirement:
+ - Make sure you have installed Node.js ( https://nodejs.org ) in your system.
+ - Instructions for Windows
+ 1. Install Surge
+ - Open Window PowerShell as ADMIN and type the following command to install Surge in your system.
+ npm install --global surge
+ 2. Open File Explorer, create a folder called "vcard" ( or whatever you like ) in your preferred location and move your dbizcard folder inside it.
+ 3. Within the "vcard" folder, open a PowerShell by selecting "Open PowerShell window here" from the [Shift + Right click] context menu.
+ 4. Type "surge" and press Enter.
+ 5. Create a surge account with your email and password.
+ 6. Edit your domain name and press Enter few times.
+ 7. Enable HTTPS encryption
+ - In the same PowerShell window, run the following command to enable HTTPS for your website. Don"t forget to replace "your-domain" with your actual domain.
+ surge --domain https://your-domain.surge.sh
+ - Instructions for Linux / Mac
+ 1. Install Surge
+ - Open Terminal and type the following command to install Surge in your system.
+ sudo npm install --global surge
+ 2. Open File Manager, create a folder called "vcard" ( or whatever you like ) in your preferred location and move your dbizcard folder inside it.
+ 3. Within the "vcard" folder, open a Terminal and type "surge" and press Enter.
+ 4. Create a surge account with your email and password.
+ 5. Edit your domain name and press Enter few times.
+ 6. Enable HTTPS encryption
+ - In the same Terminal window, run the following command to enable HTTPS for your website. Don"t forget to replace "your-domain" with your actual domain.
+ surge --domain https://your-domain.surge.sh
+ 7. Now your business card should be online at the address https://your-domain.surge.sh/vcard/businesscardfoldername/ and is ready to be shared.
+
+
++ How do I update my business card details?
+
+ - Simply go to the website https://dbizcard.vercel.app/ and generate a new digital business card.
+ - Extract the package and copy your dbizcard folder containing your updated files.
+ - Replace your old folder with this updated one.
+ - Follow the exact same steps as per your category to update your digital business card.
+
+
++ How do I add another business card to my website?
+
+ - Simply go to the website https://dbizcard.vercel.app/ and generate a digital business card.
+ - Extract the package and copy the dbizcard folder.
+ - Place the copied folder inside the same folder where you already have your dbizcard folders.
+ - Follow the exact same steps as per your category to add the digital business card.
+
+
+??????????????????????????????????????
+
+Cannot find what you were looking for?
+- You can get help by joining the Telegram group using this link https://t.me/dbizcard
+
+??????????????????????????????????????
+
+
+
+
+
+
+
+
diff --git a/components/StyleSheet.vue b/components/StyleSheet.vue
new file mode 100644
index 0000000..f13f84e
--- /dev/null
+++ b/components/StyleSheet.vue
@@ -0,0 +1,3 @@
+
+ body{margin:0 auto;width:100%;padding:0;max-width:30rem;color:#1a202c;font-family:sans-serif;position:relative}#shareContainer{position:absolute;z-index:1;width:100%;bottom:0;background:#fff;-webkit-transition:top 0.2s ease-out, opacity 0.1s ease-out;transition:top 0.2s ease-out, opacity 0.1s ease-out;-webkit-transform:translateZ(0);transform:translateZ(0)}#closeBtnContainer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;margin:1rem 1rem 0 0}#closeBtn{padding:0.75rem;cursor:pointer;line-height:0}.icon{width:1.5rem;height:1.5rem}#shareContent,#copyURL,#displayQRCode,#pubKeyInfo{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}#copyURL p,#pubKeyInfo p{margin:2rem 2em 0;line-height:1.5;text-align:center}#copyShareURL,#downloadKey{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:5rem;margin-top:2rem;padding:0.75rem 1.5rem;cursor:pointer}#copyShareURL span,#downloadKey span{margin-left:0.5rem}#displayQRCode{text-align:center;width:100%}#displayQRCode h2,#displayQRCode p{padding:0 2rem}#displayQRCode h2{font-weight:700;font-size:1.5rem;margin:0}#displayQRCode p{margin-top:0.5rem}#qrcode{margin:2rem}header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;height:16rem}#logo{height:6rem;text-align:center;color:gray;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#actions{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;position:absolute;left:1rem;right:0;top:1rem}#actions a{padding:0.75rem;cursor:pointer;border-radius:100%;line-height:0;margin-right:1rem}#shareActions{display:-webkit-box;display:-ms-flexbox;display:flex}main{background:#fff;border-radius:1.5rem 1.5rem 0 0;padding:1.5rem;-webkit-box-shadow:0 -1px 4px -1px rgba(0,0,0,0.2);box-shadow:0 -1px 4px -1px rgba(0,0,0,0.2)}#profile{display:-webkit-box;display:-ms-flexbox;display:flex}#profile img{width:6rem;height:6rem;border-radius:100%;border:1px solid #edf2f7;margin-right:0.75rem;text-align:center;color:gray;-ms-flex-item-align:start;align-self:flex-start;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#profileInfo{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;line-height:1.25;word-break:break-word}.name{font-weight:700;font-size:1.25rem;margin:0}.jobtitle{font-size:0.875rem;margin:0.25rem 0 0 0}.bizDescription{color:#4a5568;font-size:0.875rem;white-space:pre-line;line-height:1.5;margin-top:1rem}#contactBtns,#socialBtns{margin-top:2rem;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.contactBtnContainer,.socialBtnContainer{width:33.333333%}.contactBtn,.socialBtn{padding:0.5rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.contactBtn a,.socialBtn a{border-radius:100%;padding:0.75rem;line-height:0}.contactBtn p,.socialBtn p{margin:0.5rem 0 0;font-size:0.875rem}a{text-decoration:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}a:not(#closeBtn){-webkit-box-shadow:0 1px 4px -1px rgba(0,0,0,0.2);box-shadow:0 1px 4px -1px rgba(0,0,0,0.2)}a:not(#closeBtn):hover,a:not(#closeBtn):focus{-webkit-box-shadow:none;box-shadow:none}#ctaContainer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:100%}#downloadVcard{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:5rem;margin-top:1.5rem;padding:0.75rem 1.5rem;cursor:pointer;line-height:0}#downloadVcard .icon{margin-right:0.5rem}#downloadVcard p{color:#fff;margin:0}#socialBtns{margin-top:1.25rem}.socialBtn{padding:1rem}#featuredContent{margin-top:1.5rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.images,.music,.video,.document{overflow:hidden;border-radius:0.5rem;-webkit-box-shadow:0 2px 8px -2px rgba(0,0,0,0.2);box-shadow:0 2px 8px -2px rgba(0,0,0,0.2);margin-top:1rem}.images img,.music img,.video img,.document img{display:block;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.music,.video{width:100%}.mediaPlayerContainer,.documentContainer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:space-evenly;-ms-flex-pack:space-evenly;justify-content:space-evenly;-webkit-box-align:center;-ms-flex-align:center;align-items:center}video{width:100%}.infoControls{padding:1rem 2rem 2rem;font-size:0.75rem;text-align:center;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}.title{font-size:1rem;font-weight:700}.artistAlbum,.fileSize{margin-top:0.25rem}.playerControl,.downloadDocument{display:none;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%}.downloadDocument{display:-webkit-box;display:-ms-flexbox;display:flex}.seekBar{width:100%;height:0.5rem;margin-top:2rem;border-radius:5rem;background:#edf2f7;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.playPause,.downloadBtn{margin:2rem 0.5rem 0;padding:0.75rem;border-radius:5rem;line-height:0;cursor:pointer}.pause{display:none}footer{background:#fff;padding:1.5rem 1.5rem 2rem}footer div{margin-top:1rem;font-size:0.75rem;text-align:center;color:#4a5568}footer div a{text-decoration:underline;color:#4a5568}hr{border:0;border-top:1px solid #edf2f7;border-bottom:1px solid #fff}
+
\ No newline at end of file
diff --git a/components/Vcard.vue b/components/Vcard.vue
new file mode 100644
index 0000000..58a6917
--- /dev/null
+++ b/components/Vcard.vue
@@ -0,0 +1,22 @@
+
+ 
