Skip to content

Commit

Permalink
website: reorganise index page
Browse files Browse the repository at this point in the history
  • Loading branch information
@ifedapoolarewaju
ifedapoolarewaju committed Nov 9, 2019
1 parent 25077a5 commit c614180
Show file tree
Hide file tree
Showing 2 changed files with 97 additions and 35 deletions.
70 changes: 47 additions & 23 deletions docs-src/index.pug
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,8 +24,6 @@ append navigation
h1.text-center.display-1.col-md-auto IG:dm
h3.text-center.col-12.col-md-8.m-auto Continue your Instagram direct messages from your phone to your desktop.
.download.col-md-auto.mt-5
h5
| 2-Factor Authentication is now supported!
h5
| Download the latest
span v2.8.0
Expand All @@ -43,18 +41,44 @@ append navigation

block content
section.features.mt-5
h1.text-center Features
h2.text-center.mb-5 Features
.row.mt-3.justify-content-center
.col-md-4
h5 Continue conversations
p.text-muted You will be able to continue your conversations from where you left off on the mobile app.
.col-md-4
h5 2-Factor Authentication
p.text-muted IGdm has login support for accounts with two-factor authentication enabled.
.row.mt-3.justify-content-center
.col-md-4
h5 Disable Read Receipts
p.text-muted IGdm provides a setting that allows you prevent users from receiving read receipts.
.col-md-4
h5 Unfollowers
p.text-muted View the list of users that are not following you back.
.row.mt-3.justify-content-center
.col-md-4
h5 Quote Messages
p.text-muted IGdm provides a custom and convenient style of quoting chat messages within a conversation
.col-md-4
h5 Save Videos and Images
p.text-muted You can save videos and images in the instagram posts that a shared with you in a chat.
.row.mt-3.justify-content-center
.col-md-4
h5 Search for users
p.text-muted You can search for any user and start a conversation with that user.

.screenshots.row.mt-5.text-center
a.col-md-6.mb-4(href='img/startchat.gif', target='_blank')
a.col-md-4.mb-4(href='img/startchat.gif', target='_blank')
| Search for users and start a conversation
img.mt-3.img-fluid(src='img/startchat.gif')
a.col-md-6.mb-4(href='img/unfollowers.gif', target='_blank')
a.col-md-4.mb-4(href='img/unfollowers.gif', target='_blank')
| View a list of users not following you back
img.mt-3.img-fluid(src='img/unfollowers.gif')
a.col-md-6.mb-4(href='img/quotemessage.gif', target='_blank')
a.col-md-4.mb-4(href='img/quotemessage.gif', target='_blank')
| Quote a chat message
img.mt-3.img-fluid(src='img/quotemessage.gif')
a.col-md-6(href='img/viewimage.gif', target='_blank')
a.col-md-4(href='img/viewimage.gif', target='_blank')
| View chat images
img.mt-3.img-fluid(src='img/viewimage.gif')
section.issues.mt-5.text-center
Expand All @@ -64,23 +88,23 @@ block content
| Try  
b IGdm Pro

section.issues.mt-5.text-center
h2 Issues running IG:dm on your computer?
span
| Please see
a(href='http://igdm.me/blog/igdm-on-windows-linux', target='_blank') common issues and fixes
| for running IG:dm on your desktop.

section.donations.mt-5.text-center
h2 Donations
| IG:dm
| is an open source project that can be used for free by anyone, donations
| and incentives are wholeheartedly welcome.
p
section.row.mt-5.justify-content-center
.col-md-5
h4 Issues running IG:dm on your computer?
span
| Please see
a(href='http://igdm.me/blog/igdm-on-windows-linux', target='_blank') common issues and fixes
| for running IG:dm on your desktop.
.col-md-1
.col-md-5
h4 Donations
| IG:dm
| is an open source project that can be used for free by anyone, donations
| and incentives are wholeheartedly welcome.
a.btn.btn-link.btn-outline-light(role="button" href='http://paypal.me/SolomonOmojola' target="_blank") Donate via PayPal
| You can also donate via BITCOIN to the following Bitcoin address.
.donations
code 3NM9EubVwdvNm9qiTgLC8DHsRtTHvoyaD6
p You can also donate via BITCOIN to the following Bitcoin address.
div
code 3NM9EubVwdvNm9qiTgLC8DHsRtTHvoyaD6

append footer
script.
Expand Down
62 changes: 50 additions & 12 deletions docs/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,30 +47,68 @@
<h1 class="text-center display-1 col-md-auto">IG:dm</h1>
<h3 class="text-center col-12 col-md-8 m-auto">Continue your Instagram direct messages from your phone to your desktop.</h3>
<div class="download col-md-auto mt-5">
<h5>2-Factor Authentication is now supported!</h5>
<h5>Download the latest <span>v2.8.0</span></h5>
<div class="mt-2 btn-group" role="group" aria-label="Download buttons"><a class="btn btn-outline-light" role="button" href="https://github.com/igdmapps/igdm/releases/download/v2.8.1/IGdm-Setup-2.8.1.exe"><i class="mdi mdi-windows"></i><span class="ml-2">Windows</span></a><a class="btn btn-outline-light" role="button" href="https://github.com/igdmapps/igdm/releases/download/v2.8.1/IGdm-2.8.1.dmg"><i class="mdi mdi-apple"> </i><span class="ml-2">macOS</span></a><a class="btn btn-outline-light" role="button" href="https://github.com/igdmapps/igdm/releases/download/v2.8.1/IGdm-2.8.1-x86_64.AppImage"><i class="mdi mdi-linux"></i><span class="ml-2">Linux</span></a></div>
</div><a class="downloadCount mt-3 d-block" href="https://twitter.com/igdmApps/status/1137337076167401472" target="_blank">Over 5,000,000+ Downloads!</a>
</div>
</div>
<div class="container">
<section class="features mt-5">
<h1 class="text-center">Features</h1>
<div class="screenshots row mt-5 text-center"><a class="col-md-6 mb-4" href="img/startchat.gif" target="_blank">Search for users and start a conversation<img class="mt-3 img-fluid" src="img/startchat.gif"></a><a class="col-md-6 mb-4" href="img/unfollowers.gif" target="_blank">View a list of users not following you back<img class="mt-3 img-fluid" src="img/unfollowers.gif"></a><a class="col-md-6 mb-4" href="img/quotemessage.gif" target="_blank">Quote a chat message<img class="mt-3 img-fluid" src="img/quotemessage.gif"></a><a class="col-md-6" href="img/viewimage.gif" target="_blank">View chat images<img class="mt-3 img-fluid" src="img/viewimage.gif"></a></div>
<h2 class="text-center mb-5">Features</h2>
<div class="row mt-3 justify-content-center">
<div class="col-md-4">
<h5>Continue conversations</h5>
<p class="text-muted">You will be able to continue your conversations from where you left off on the mobile app.</p>
</div>
<div class="col-md-4">
<h5>2-Factor Authentication</h5>
<p class="text-muted">IGdm has login support for accounts with two-factor authentication enabled.</p>
</div>
</div>
<div class="row mt-3 justify-content-center">
<div class="col-md-4">
<h5>Disable Read Receipts</h5>
<p class="text-muted">IGdm provides a setting that allows you prevent users from receiving read receipts.</p>
</div>
<div class="col-md-4">
<h5>Unfollowers</h5>
<p class="text-muted">View the list of users that are not following you back.</p>
</div>
</div>
<div class="row mt-3 justify-content-center">
<div class="col-md-4">
<h5>Quote Messages</h5>
<p class="text-muted">IGdm provides a custom and convenient style of quoting chat messages within a conversation</p>
</div>
<div class="col-md-4">
<h5>Save Videos and Images</h5>
<p class="text-muted">You can save videos and images in the instagram posts that a shared with you in a chat.</p>
</div>
</div>
<div class="row mt-3 justify-content-center">
<div class="col-md-4">
<h5>Search for users</h5>
<p class="text-muted">You can search for any user and start a conversation with that user.</p>
</div>
</div>
<div class="screenshots row mt-5 text-center"><a class="col-md-4 mb-4" href="img/startchat.gif" target="_blank">Search for users and start a conversation<img class="mt-3 img-fluid" src="img/startchat.gif"></a><a class="col-md-4 mb-4" href="img/unfollowers.gif" target="_blank">View a list of users not following you back<img class="mt-3 img-fluid" src="img/unfollowers.gif"></a><a class="col-md-4 mb-4" href="img/quotemessage.gif" target="_blank">Quote a chat message<img class="mt-3 img-fluid" src="img/quotemessage.gif"></a><a class="col-md-4" href="img/viewimage.gif" target="_blank">View chat images<img class="mt-3 img-fluid" src="img/viewimage.gif"></a></div>
</section>
<section class="issues mt-5 text-center">
<h2>Want more features?</h2>
<h4><a class="btn btn-primary prominent2" href="https://pro.igdm.me" target="_blank">Try &nbsp;<b>IGdm Pro</b></a></h4>
</section>
<section class="issues mt-5 text-center">
<h2>Issues running IG:dm on your computer?</h2><span>Please see <a href="http://igdm.me/blog/igdm-on-windows-linux" target="_blank">common issues and fixes </a>for running IG:dm on your desktop.</span>
</section>
<section class="donations mt-5 text-center">
<h2>Donations</h2>IG:dm
is an open source project that can be used for free by anyone, donations
and incentives are wholeheartedly welcome.
<p><a class="btn btn-link btn-outline-light" role="button" href="http://paypal.me/SolomonOmojola" target="_blank">Donate via PayPal</a></p>You can also donate via BITCOIN to the following Bitcoin address.
<div class="donations"><code>3NM9EubVwdvNm9qiTgLC8DHsRtTHvoyaD6</code></div>
<section class="row mt-5 justify-content-center">
<div class="col-md-5">
<h4>Issues running IG:dm on your computer?</h4><span>Please see <a href="http://igdm.me/blog/igdm-on-windows-linux" target="_blank">common issues and fixes </a>for running IG:dm on your desktop.</span>
</div>
<div class="col-md-1"></div>
<div class="col-md-5">
<h4>Donations</h4>IG:dm
is an open source project that can be used for free by anyone, donations
and incentives are wholeheartedly welcome.<a class="btn btn-link btn-outline-light" role="button" href="http://paypal.me/SolomonOmojola" target="_blank">Donate via PayPal</a>
<p>You can also donate via BITCOIN to the following Bitcoin address.</p>
<div><code>3NM9EubVwdvNm9qiTgLC8DHsRtTHvoyaD6</code></div>
</div>
</section>
</div>
<footer class="pb-5 pt-5 mt-5">
Expand Down

0 comments on commit c614180

Please sign in to comment.