open.source/espanso
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add footer and donate section

Browse Source
This commit is contained in:
Federico Terzi 2019-09-22 12:12:34 +02:00
parent a2a5ecb854
commit 24efdaa7bf
14 changed files with 145 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
_includes/donate.html Normal file
View File

@ -0,0 +1,16 @@
<div class="container donate">
<a name="donate"></a>
<h2 class="text-center mt-5 mb-4">Donate</h2>
<div class="row">
<div class="col-md-3">
<img src="/assets/images/profile.png" class="mb-3"/>
</div>
<div class="col-md-8">
<p>Hi! I'm Federico, the creator of espanso. I developed espanso in my (little) spare time
and I decided to make it open source because I thought it could be useful to many people.
</p>
<p class="bigger">If you liked the project, please consider making a small donation, it really helps :)</p>
<a class="btn btn-lg" target="_blank" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=FHNLR5DRS267E&source=url" role="button">Donate with PayPal</a>
</div>
</div>
</div>

13
_includes/footer.html
View File

@ -0,0 +1,13 @@
<div class="footer-section">
<div class="contrib-box">
<h2 class="mb-4">Contributing</h2>
<p><b>espanso</b> is open source and <a href="https://github.com/federico-terzi/espanso">hosted on GitHub</a>.</p>
<!-- Place this tag where you want the button to render. -->
<a class="github-button" href="https://github.com/federico-terzi/espanso" data-size="large" data-show-count="true" aria-label="Star federico-terzi/espanso on GitHub">Star</a>
<p>If you find a bug or have an idea for a new feature,
please <a href="https://github.com/federico-terzi/espanso/issues">open an issue on GitHub</a>.</p>
</div>
<div class="copy-box">
<p class="bottom-paragraph">Designed and created by Federico Terzi. Copyright © Federico Terzi 2019</p>
</div>
</div>

2
_includes/navigation.html
View File

@ -13,7 +13,7 @@
</li>
{% endfor %}
<li class="nav-item">
<a class="nav-link btn" href="/donate/">Donate</a>
<a class="nav-link btn" href="#donate">Donate</a>
</li>
</ul>
</div>

3
_layouts/default.html
View File

@ -58,11 +58,14 @@ If you want to see more interesting projects, visit my website: https://federico
</div>
{% endunless %}
{% include donate.html %}
{% include footer.html %}
<script src="/assets/js/jquery.slim.min.js"></script>
<script src="/assets/js/popper.min.js"></script>
<script src="/assets/js/bootstrap.min.js"></script>
<script async defer src="https://buttons.github.io/buttons.js"></script>
{% if page.showParticles %}
<script src="/assets/js/particles.min.js"></script>

3
_sass/_colors.scss
View File

@ -2,4 +2,7 @@ $mainColor: #00b894;
$lightGrayColor: #b2bec3;
$grayColor: #636e72;
$blackColor: #2d3436;
$veryBlackColor: #202426;
$greenDark: #00372c;
$yellowColor: #fdcb6e;
$orangeColor: #e17055;

5
_sass/_default.scss
View File

@ -1,7 +1,12 @@
body {
margin: 0;
font-family: 'Raleway', sans-serif;
}
html {
margin: 0;
}
h1, h2, h3, h4 {
font-weight: 700;
}

34
_sass/_donate.scss Normal file
View File

@ -0,0 +1,34 @@
.donate {
margin-top: 60px;
img {
height: 150px;
display: block;
margin-left: auto;
@media screen and (max-width: $screen-tablet) {
margin-right: auto;
}
}
@media screen and (max-width: $screen-tablet) {
text-align: center;
}
.bigger {
font-size: 1.2em;
}
.btn {
font-weight: 700;
font-size: 1.2em;
background-color: $orangeColor;
color: white !important;
padding: 10px 25px 10px 25px;
border-radius: 40px;
border: 0;
@media screen and (max-width: $screen-tablet) {
font-size: 1.3em;
}
}
}

25
_sass/_footer.scss Normal file
View File

@ -0,0 +1,25 @@
.footer-section {
color: white;
text-align: center;
.contrib-box {
background-image: url("/assets/images/footerback.svg");
background-position: center top;
background-size: cover;
margin: 60px 0 0 0;
padding: 50px 0 10px 0;
}
.copy-box {
padding: 15px 0 0 0;
background-color: $veryBlackColor;
height: 100%;
p {
line-height: 1em;
}
}
a {
color: $lightGrayColor;
}
}

2
_sass/_homepage.scss
View File

@ -30,8 +30,10 @@
}
.btn-subtitle {
display: block;
font-size: 1em;
margin: 10px;
text-decoration: none;
color: $grayColor;
}
}

2
_sass/_install.scss
View File

@ -1,6 +1,6 @@
.install {
@media screen and (min-width: $screen-laptop) {
margin-top: 80px;
margin-top: 30px;
}
img {

2
_sass/main.scss
View File

@ -5,3 +5,5 @@
@import '_homepage';
@import '_syntax';
@import '_install';
@import '_donate';
@import '_footer';

3
assets/images/footerback.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1920" height="574.297" viewBox="0 0 1920 574.297">
<path id="Path_23" data-name="Path 23" d="M8,581.512s88.525-31.123,429.788-32.919,668.22,39.538,1012.43,46.393S1928,576.283,1928,576.283v546.55H8Z" transform="translate(-8 -548.536)" fill="#2d3436"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 307 B

BIN
assets/images/profile.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 84 KiB

37
index.html
View File

@ -9,8 +9,8 @@ showParticles: True
<div class="jumbotron text-center">
<h1 class="display-4" id="jumbo-text">Cross-platform Text Expander written in Rust</h1>
<a class="btn btn-lg" href="#" role="button">Get Started on MacOS</a>
<p class="btn-subtitle">Also available for Windows and Linux</p>
<a class="btn btn-lg" href="/install/mac/" role="button" id="get-started-btn">Get Started on MacOS</a>
<p><a class="btn-subtitle" href="/install/" id="get-started-other">Also available for Windows and Linux</a></p>
</div>
<div class="container-fluid hiw text-center">
@ -119,7 +119,40 @@ showParticles: True
<script src="/assets/js/typeit.min.js"></script>
<script>
function getOS() {
var userAgent = window.navigator.userAgent,
platform = window.navigator.platform,
macosPlatforms = ['Macintosh', 'MacIntel', 'MacPPC', 'Mac68K'],
windowsPlatforms = ['Win32', 'Win64', 'Windows', 'WinCE'],
iosPlatforms = ['iPhone', 'iPad', 'iPod'],
os = null;
if (macosPlatforms.indexOf(platform) !== -1) {
os = 'mac';
} else if (windowsPlatforms.indexOf(platform) !== -1) {
os = 'win';
} else if (!os && /Linux/.test(platform)) {
os = 'linux';
}
return os;
}
function jumboText() {
// Setup get started button
var os = getOS();
var btn = document.getElementById("get-started-btn");
var btnother = document.getElementById("get-started-other");
if (os == "win") {
btn.innerText = "Get Started on Windows";
btn.href = "/install/win/";
btnother.innerText = "Also available for macOS and Linux";
}else if(os == "linux") {
btn.innerText = "Get Started on Linux";
btn.href = "/install/linux/";
btnother.innerText = "Also available for macOS and Windows";
}
document.getElementById("jumbo-text").innerText = "";
new TypeIt('#jumbo-text', {
speed: 50,