hasufell/ghcup-hs
1
1
Fork 0
Code Issues Pull Requests Releases Wiki Activity

make donate button primary call-to-action, move it above-the-fold for

Browse Source 
better visibility, move need-help section near footer
This commit is contained in:
Arjun Kathuria 2021-10-12 15:35:42 +05:30 committed by Julian Ospald
parent 569b46f0c4
commit 2cb40af62f
Signed by: hasufell
GPG Key ID: 3786C5262ECB4A3F
2 changed files with 37 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
docs/css/extra.css
View File

@ -68,19 +68,6 @@ div.gh-badge img {
height: 25px; height: 25px;
} }
a.donate-badge img {
margin-top: 10px;
margin-bottom: 0;
padding: 0;
height: 35px;
}
@media only screen and (min-width: 1000px) {
a.donate-badge img {
margin-top: 0;
}
}
/* Definition List styles */ /* Definition List styles */
dd { dd {
@ -273,6 +260,30 @@ footer > hr {
} }
} }
.index-cta-donate .donate-button a {
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
}
.index-cta-donate .donate-button {
margin: 10px auto;
position: relative;
display: block;
background: none;
padding: none;
border: none;
background: url("https://opencollective.com/webpack/donate/button@2x.png?color=blue");
width: 35%;
min-width: 240px;
max-width: 280px;
height: 50px;
background-size: contain;
background-repeat: no-repeat;
}
.ghcup-os-container { .ghcup-os-container {
width: 100%; width: 100%;
margin: 10px 0; margin: 10px 0;

23
docs/index.md
View File

@ -54,20 +54,23 @@ hide:
<a href="https://gitlab.haskell.org/haskell/ghcup-hs/-/blob/master/scripts/bootstrap/bootstrap-haskell.ps1" target="_blank">What does this do?</a> <b>&nbsp;&middot;&nbsp;</b> <a href="https://www.haskell.org/ghcup/install/#manual-install">I don't like curl | sh</a> <div class="show-all-platforms"><b>&nbsp;&middot;&nbsp;</b> <a class="show-all-platforms-button" href="#">Show all platforms</a></div></p> <a href="https://gitlab.haskell.org/haskell/ghcup-hs/-/blob/master/scripts/bootstrap/bootstrap-haskell.ps1" target="_blank">What does this do?</a> <b>&nbsp;&middot;&nbsp;</b> <a href="https://www.haskell.org/ghcup/install/#manual-install">I don't like curl | sh</a> <div class="show-all-platforms"><b>&nbsp;&middot;&nbsp;</b> <a class="show-all-platforms-button" href="#">Show all platforms</a></div></p>
</div> </div>
</div> </div>
</section> </section>
<p id="help"> <section class="index-cta-donate">
Need help? Ask on <a href="https://kiwiirc.com/nextclient/irc.libera.chat/?nick=Guest%7C?#haskell,#haskell-ghcup"><img src="irc.svg" alt="" />IRC</a>, <a href="https://discord.gg/pKYf3zDQU7"><img src="Discord-Logo-Black.svg" alt="" />Discord</a>, <a href="https://app.element.io/#/room/#haskell-tooling:matrix.org"><img src="Matrix_logo.svg" alt=""/></a> or <a href="https://gitlab.haskell.org/haskell/ghcup-hs/issues">report a bug <img src="Octicons-bug.svg" alt="" /></a> <button class="donate-button">
<div id="collective" href="https://opencollective.com/ghcup#category-CONTRIBUTE" target="_blank"> <a href="https://opencollective.com/ghcup#category-CONTRIBUTE" class="donate-badge" />
<a href="https://opencollective.com/ghcup#category-CONTRIBUTE" class="donate-badge"> </button>
<img src="https://opencollective.com/webpack/donate/button@2x.png?color=blue" alt="Donate"> </section>
</a>
</div>
</p>
---- ----
![GHCup](./ghcup.gif){: .center style="width:700px"} ![GHCup](./ghcup.gif){: .center style="width:700px"}
<p id="help">
Need help? Ask on
<a href="https://kiwiirc.com/nextclient/irc.libera.chat/?nick=Guest%7C?#haskell,#haskell-ghcup">
<img src="irc.svg" alt="" />IRC</a>,
<a href="https://discord.gg/pKYf3zDQU7"><img src="Discord-Logo-Black.svg" alt="" />Discord</a>, <a href="https://app.element.io/#/room/#haskell-tooling:matrix.org"><img src="Matrix_logo.svg" alt=""/></a> or <a href="https://gitlab.haskell.org/haskell/ghcup-hs/issues">report a bug <img src="Octicons-bug.svg" alt="" /></a>
</p>
<script type="text/javascript" src="javascripts/ghcup.js"></script>