Added Ko-fi donation option

This commit is contained in:
wweverma1
2021-10-01 17:23:32 +05:30
parent 9eb2ab1260
commit bbf6cf6018
3 changed files with 50 additions and 21 deletions
+5 -2
View File
@@ -266,6 +266,9 @@ const DisplaySupport = props => {
{props.support.buyMeACoffee &&
`<a href="https://www.buymeacoffee.com/${props.support.buyMeACoffee}">
<img align="left" src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" height="50" width="210" alt="${props.support.buyMeACoffee}" /></a>`}
{props.support.buyMeAKofi &&
`<a href="https://ko-fi.com/${props.support.buyMeAKofi}">
<img align="left" src="https://cdn.ko-fi.com/cdn/kofi3.png?v=3" height="50" width="210" alt="${props.support.buyMeAKofi}" /></a>`}
{`</p><br><br>`}
<br />
<br />
@@ -277,7 +280,7 @@ const DisplaySupport = props => {
const Markdown = props => {
const icon_base_url =
"https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/";
return (
<div id="markdown-content" className="break-words">
<>
@@ -405,7 +408,7 @@ const Markdown = props => {
</>
<>
<DisplaySocial
base="https://linkedin.com/in"
base="https://linkedin.com/in"
icon={icon_base_url + "linked-in-alt.svg"}
username={props.social.linkedin}
/>
+28 -16
View File
@@ -122,7 +122,7 @@ export const DisplaySocial = props => {
export const SocialPreview = props => {
let viewSocial = false
const icon_base_url =
const icon_base_url =
"https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/";
Object.keys(props.social).forEach(key => {
if (props.social[key] && key != "github") viewSocial = true
@@ -153,7 +153,7 @@ export const SocialPreview = props => {
</>
<>
<DisplaySocial
base="https://linkedin.com/in"
base="https://linkedin.com/in"
icon={icon_base_url + "linked-in-alt.svg"}
username={props.social.linkedin}
/>
@@ -413,24 +413,36 @@ export const SupportPreview = props => {
viewSupport = true
}
})
return (
<div className="mb-4">
return props.support.buyMeACoffee || props.support.buyMeAKofi ? (
<div className="flex flex-wrap justify-start items-center">
<SectionTitle label="Support:" visible={viewSupport} />
{props.support.buyMeACoffee && (
<div style={{ width: "210px" }}>
<a
href={`https://www.buymeacoffee.com/` + props.support.buyMeACoffee}
target="_blank"
>
<img
src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png"
alt="Buy Me A Coffee"
className="w-36 h-8 sm:w-52 sm:h-12"
/>
</a>
</div>
<a
href={`https://www.buymeacoffee.com/` + props.support.buyMeACoffee}
target="_blank"
>
<img
src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png"
alt="Buy Me A Coffee"
className="mb-4 mr-4 w-36 h-8 sm:w-52 sm:h-12"
/>
</a>
)}
{props.support.buyMeAKofi && (
<a
href={`https://ko-fi.com/` + props.support.buyMeAKofi}
target="_blank"
>
<img
src="https://cdn.ko-fi.com/cdn/kofi3.png?v=3"
alt="Buy Me A Ko-fi"
className="mb-4 mr-4 w-36 h-8 sm:w-52 sm:h-12"
/>
</a>
)}
</div>
) : (
""
)
}
+17 -3
View File
@@ -7,20 +7,34 @@ const Support = props => {
Support
</div>
<div className="flex flex-wrap justify-start items-center">
<div className="w-2/5 flex justify-between items-center text-xxs sm:text-lg py-4 pr-2 sm:pr-0">
<div className="w-1/2 flex justify-start items-center text-xxs sm:text-lg py-4 pr-2 sm:pr-0">
<img
src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png"
className="w-36 h-8 sm:w-52 sm:h-12"
className="w-36 h-8 sm:w-52 sm:h-12 mr-1 sm:mr-4"
alt="buymeacoffee"
/>
<input
id="buy-me-a-coffee"
placeholder="buymeacoffee username"
className="outline-none placeholder-gray-700 w-32 sm:w-1/2 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-1 sm:px-2 ml-2 sm:ml-0 focus:border-blue-700"
className="outline-none placeholder-gray-700 w-32 sm:w-1/2 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-1 focus:border-blue-700"
value={props.support.buyMeACoffee || ""}
onChange={event => props.handleSupportChange("buyMeACoffee", event)}
/>
</div>
<div className="w-1/2 flex justify-start items-center text-xxs sm:text-lg py-4 pr-2 sm:pr-0">
<img
src="https://cdn.ko-fi.com/cdn/kofi3.png?v=3"
className="w-36 h-8 sm:w-52 sm:h-12 mr-1 sm:mr-4"
alt="buymeakofi"
/>
<input
id="buy-me-a-kofi"
placeholder="Ko-fi username"
className="outline-none placeholder-gray-700 w-32 sm:w-1/2 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-1 sm:px-2 ml-2 sm:ml-0 focus:border-blue-700"
value={props.support.buyMeAKofi || ""}
onChange={event => props.handleSupportChange("buyMeAKofi", event)}
/>
</div>
</div>
</div>
)