1
0
mirror of https://github.com/chinchang/web-maker.git synced 2025-08-01 19:10:22 +02:00

add support developer link

This commit is contained in:
Kushagra Gour
2018-02-10 20:12:45 +05:30
parent 33185bb27a
commit 0cf3955254
6 changed files with 73 additions and 6 deletions

View File

@@ -285,6 +285,10 @@
</svg>
</a>
<a d-open-modal="pledgeModal" data-event-category="ui" data-event-action="supportDeveloperBtnClick" class="footer__link ml-1 hint--rounded hint--top-right" aria-label="Support the developer by pledging some amount" target="_blank">
Support the developer
</a>
</div>
</div>
@@ -372,6 +376,10 @@
</div>
</div>
<div class="modal pledge-modal" id="pledgeModal">
<div class="modal__content" d-html="partials/pledge-modal.html"></div>
</div>
<div class="modal modal--settings" id="settingsModal">
<div class="modal__content">
<a d-click="onModalCloseBtnClick" href="" aria-label="Close Settings" title="Close" class="js-modal__close-btn modal__close-btn">

View File

@@ -0,0 +1,28 @@
<a d-click="onModalCloseBtnClick" href="" aria-label="Close modal" title="Close" class="js-modal__close-btn modal__close-btn">
<svg>
<use xlink:href="#cross-icon"></use>
</svg>
</a>
<div class="tac">
<h1>Support the Developer</h1>
<p>Hi! Web Maker is a free and open-source project. To keep myself motivated for working on such open-source and free side projects, I am accepting donations. Your pledge, no matter how small, will act as an appreciation towards my work and keep me going forward, creating & maintaining more such useful projects. So please consider donating 🙏🏼 (could be as small as $1/month).
</p>
<div class="onboard-selection-wrap flex">
<div class="onboard-selection" id="onboardDontShowInTabOptionBtn" d-click="onDontShowInTabClicked">
<a href="https://patreon.com/kushagra" target="_blank" aria-label="Make a monthly pledge on Patreon">
<img src="patreon.png" height="50" class="mb-1" alt="Become a patron image">
<h3 class="onboard-selection-text">Make a monthly pledge on Patreon</h3>
</a>
</div>
<div style="opacity:0.7;">OR</div>
<div class="onboard-selection" id="onboardShowInTabOptionBtn" d-click="onShowInTabClicked">
<a href="https://www.paypal.me/kushagragour" target="_blank" aria-label="Make a one time donation on Paypal">
<img src="paypal-logo.png" height="50" class="mb-1" alt="Paypal logo">
<h3 class="onboard-selection-text">Make a one time donation</h3>
</a>
</div>
</div>
</div>

BIN
src/patreon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.4 KiB

BIN
src/paypal-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

View File

@@ -3,8 +3,8 @@
onboardModal, layoutBtn1, layoutBtn2, layoutBtn3, layoutBtn4, layoutBtn5, onboardModal,
onboardModal, addLibraryModal, addLibraryModal, notificationsBtn, notificationsModal,
notificationsModal, notificationsBtn, codepenBtn, saveHtmlBtn, saveBtn,
onboardModal, settingsModal, notificationsBtn, onboardShowInTabOptionBtn, editorThemeLinkTag,
onboardDontShowInTabOptionBtn, TextareaAutoComplete, savedItemCountEl, indentationSizeValueEl,
onboardModal, settingsModal, notificationsBtn, editorThemeLinkTag, TextareaAutoComplete,
savedItemCountEl, indentationSizeValueEl, pledgeModal
runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyleTemplate,
customEditorFontInput, cssSettingsModal, cssSettingsBtn, acssSettingsTextarea,
globalConsoleContainerEl, externalLibrarySearchInput, keyboardShortcutsModal, headerAvatarImg,
@@ -688,6 +688,7 @@ loginModal, profileModal, profileAvatarImg, profileUserName, openItemsBtn
keyboardShortcutsModal.classList.remove('is-modal-visible');
loginModal.classList.remove('is-modal-visible');
profileModal.classList.remove('is-modal-visible');
pledgeModal.classList.remove('is-modal-visible');
toggleSavedItemsPane(false);
document.dispatchEvent(new Event('overlaysClosed'));
}
@@ -1415,13 +1416,9 @@ loginModal, profileModal, profileAvatarImg, profileUserName, openItemsBtn
};
scope.onShowInTabClicked = function onShowInTabClicked() {
onboardDontShowInTabOptionBtn.classList.remove('selected');
onboardShowInTabOptionBtn.classList.add('selected');
trackEvent('ui', 'onboardShowInTabClick');
};
scope.onDontShowInTabClicked = function onDontShowInTabClicked() {
onboardDontShowInTabOptionBtn.classList.add('selected');
onboardShowInTabOptionBtn.classList.remove('selected');
trackEvent('ui', 'onboardDontShowInTabClick');
};

View File

@@ -23,6 +23,9 @@ a {
color: crimson;
cursor: pointer;
}
p {
line-height: 1.65;
}
.hide {
display: none !important;
@@ -609,6 +612,9 @@ body > #demo-frame {
/* margin-lef.t: -300px; */
}
}
.pledge-modal .modal__content {
max-width: 800px;
}
.saved-items-pane {
position: fixed;
right: 0;
@@ -1139,6 +1145,34 @@ body:not(.is-app) .show-when-app {
display: none;
}
.onboard-selection-wrap {
justify-content: center;
align-items: center;
}
.onboard-selection {
padding: 10px;
margin: 0 40px;
border-radius: 5px;
transition: 0.25s ease;
position: relative;
border: 1px solid transparent;
}
.onboard-selection:hover {
cursor: pointer;
transform: scale(1.15);
}
.onboard-selection.selected:after {
content: '';
position: absolute;
right: -20px;
bottom: 40px;
width: 80px;
height: 80px;
border-radius: 50%;
background: white
url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="width:32px;height:32px" viewBox="0 0 24 24"><path fill="limegreen" d="M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2M11,16.5L18,9.5L16.59,8.09L11,13.67L7.91,10.59L6.5,12L11,16.5Z" /></svg>');
}
/* Codemirror themes basic bg styles. This is here so that there is no big FOUC
while the theme CSS file is loading */
.cm-s-paraiso-dark.CodeMirror {