ARCHIVE/xrpl-dev-portal
1
0
Fork 0
mirror of https://github.com/XRPLF/xrpl-dev-portal.git synced 2025-11-19 19:25:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Replace tabs; use built-in scrollspy

Browse Source
This commit is contained in:
mDuo13
2021-06-29 19:29:51 -07:00
parent 177b361d37
commit fcf9c68e06
8 changed files with 197 additions and 208 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
assets/css/devportal2020.css
View File

File diff suppressed because one or more lines are too long

10
styles/_side-nav.scss
View File

@@ -186,4 +186,14 @@ aside .active-parent > a {
}
}
&.no-sideline {
border-left: 0;
a:hover, a.active {
border-left: 0;
margin-left: 0;
}
}
}

107
template/page-xrp-overview.html.jinja
View File

@@ -32,12 +32,12 @@
<section class="container-new my-20">
<div class="card-grid card-grid-1x2">
<div class="col-new">
<ul class="p-0 sticky-top top-24">
<li class="ls-none"><a class="sidelinks" href="#about-xrp">About XRP</a></li>
<li class="ls-none"><a class="sidelinks" href="#xrp-trading">XRP in Trading</a></li>
<li class="ls-none"><a class="sidelinks" href="#ripple">Ripple vs. XRP</a></li>
<li class="ls-none"><a class="sidelinks" href="#wallets">XRP Wallets</a></li>
<li class="ls-none"><a class="sidelinks" href="#exchanges">XRP Exchanges</a></li>
<ul class="page-toc no-sideline p-0 sticky-top top-24">
<li class="nav-item"><a class="sidelinks nav-link" href="#about-xrp">About XRP</a></li>
<li class="nav-item"><a class="sidelinks nav-link" href="#xrp-trading">XRP in Trading</a></li>
<li class="nav-item"><a class="sidelinks nav-link" href="#ripple">Ripple vs. XRP</a></li>
<li class="nav-item"><a class="sidelinks nav-link" href="#wallets">XRP Wallets</a></li>
<li class="nav-item"><a class="sidelinks nav-link" href="#exchanges">XRP Exchanges</a></li>
</ul>
</div>
@@ -98,7 +98,7 @@
<div class="z-index-1 position-relative">
<h2 class="h4 mb-10">{% trans %}XRP was designed with sustinability in mind.{% endtrans %}</h2>
<p class="mb-10">{% trans %}Explore how the energy consumption of XRP compares to other currencies.{% endtrans %}</p>
<a class="btn btn-primary btn-arrow">Green Currency Calculator</a>
<a class="btn btn-primary btn-arrow" href="carbon-calculator.html">Green Currency Calculator</a>
</div>
</div>
</div>
@@ -133,30 +133,30 @@
<div class="mr-5-until-md">
<h6 class="fs-4-5">{% trans %}Custodial Wallets{% endtrans %}</h6>
<p class="">{% trans %}Custodial wallets manage a user's private key, which allows the wallet to withdraw crypto currency on a user's behalf.{% endtrans %}</p>
<ul class="ls-none p-0">
<li class="li-links">
<a class="align-items-center d-flex" href=""><img class="mw-100" src="./img/wallets/ledger.svg"></a>
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link external-link" href="https://www.ledger.com/" target="_blank"><img class="mw-100" src="./img/wallets/ledger.svg" alt="Ledger"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><img class="mw-100" src="./img/wallets/secalot.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://www.secalot.com/" target="_blank"><img class="mw-100" src="./img/wallets/secalot.svg" alt="Secalot"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><img class="mw-100" src="./img/wallets/trezor.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://trezor.io/" target="_blank"><img class="mw-100" src="./img/wallets/trezor.svg" alt="Trezor"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><img class="mw-100" src="./img/wallets/gatehub.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://gatehub.net/" target="_blank"><img class="mw-100" src="./img/wallets/gatehub.svg" alt="Gatehub"></a>
</li>
</ul>
</div>
<div class="ml-5-until-md mt-10-sm">
<h6 class="fs-4-5">{% trans %}Non-Custodial Wallets{% endtrans %}</h6>
<p>{% trans %}Non-custodial wallets do not manage a user's private key, which is up to the user to manage, and therefore cannot send crypto currency on the user's behalf.{% endtrans %}</p>
<ul class="ls-none p-0">
<li class="li-links">
<a class="align-items-center d-flex" href=""><img class="mw-100" src="./img/wallets/xumm.svg"></a>
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link external-link" href="https://xumm.app/" target="_blank"><img class="mw-100" src="./img/wallets/xumm.svg" alt="Xumm"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><img class="mw-100" src="./img/wallets/trust.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://trustwallet.com/" target="_blank"><img class="mw-100" src="./img/wallets/trust.svg" alt="Trust Wallet"></a>
</li>
</ul>
</div>
@@ -191,40 +191,40 @@
<h6>{% trans %}Top Exchanges, according to CryptoCompare{% endtrans %}</h6>
<div class="card-grid card-grid-2xN mb-10">
<div class="mr-5-until-md">
<ul class="ls-none p-0 mb-0">
<li class="li-links">
<a class="align-items-center d-flex" href=""><span class="longform mr-3">1</span><img class="mw-100" src="./img/exchanges/bitstamp.svg"></a>
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link external-link" href="https://www.bitstamp.com/" target="_blank"><span class="longform mr-3">1</span><img class="mw-100" src="./img/exchanges/bitstamp.svg" alt="Bitstamp"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><span class="longform mr-3">2</span><img class="mw-100" src="./img/exchanges/kraken.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://www.kraken.com/" target="_blank"><span class="longform mr-3">2</span><img class="mw-100" src="./img/exchanges/kraken.svg" alt="Kraken"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><span class="longform mr-3">3</span><img class="mw-100" src="./img/exchanges/cex-io.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://cex.io/" target="_blank"><span class="longform mr-3">3</span><img class="mw-100" src="./img/exchanges/cex-io.svg" alt="Cex.io"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><span class="longform mr-3">4</span><img class="mw-100" src="./img/exchanges/liquid.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://www.liquid.com/" target="_blank"><span class="longform mr-3">4</span><img class="mw-100" src="./img/exchanges/liquid.svg" alt="Liquid"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><span class="longform mr-3">5</span><img class="mw-100" src="./img/exchanges/lmax.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://www.lmax.com/" target="_blank"><span class="longform mr-3">5</span><img class="mw-100" src="./img/exchanges/lmax.svg" alt="LMAX"></a>
</li>
</ul>
</div>
<div class="ml-5-until-md">
<ul class="ls-none p-0">
<li class="li-links">
<a class="align-items-center d-flex" href=""><span class="longform mr-3">6</span><img class="mw-100" src="./img/exchanges/bitfinex.svg"></a>
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link external-link" href="https://www.bitfinex.com/" target="_blank"><span class="longform mr-3">6</span><img class="mw-100" src="./img/exchanges/bitfinex.svg" alt="Bitfinex"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><span class="longform mr-3">7</span><img class="mw-100" src="./img/exchanges/etoro.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://www.etoro.com/crypto/exchange/" target="_blank"><span class="longform mr-3">7</span><img class="mw-100" src="./img/exchanges/etoro.svg" alt="eToro"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><span class="longform mr-3">8</span><img class="mw-100" src="./img/exchanges/currency.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://currency.com" target="_blank"><span class="longform mr-3">8</span><img class="mw-100" src="./img/exchanges/currency.svg" alt="Currency.com"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><span class="longform mr-3">9</span><img class="mw-100" src="./img/exchanges/bittrex.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://bittrex.com/" target="_blank"><span class="longform mr-3">9</span><img class="mw-100" src="./img/exchanges/bittrex.svg" alt="Bittrex"></a>
</li>
<li class="li-links">
<a class="align-items-center d-flex" href=""><span class="longform mr-3">10</span><img class="mw-100" src="./img/exchanges/ftx.svg"></a>
<li class="nav-item">
<a class="nav-link external-link" href="https://ftx.com/" target="_blank"><span class="longform mr-3">10</span><img class="mw-100" src="./img/exchanges/ftx.svg" alt="FTX"></a>
</li>
</ul>
</div>
@@ -242,27 +242,6 @@
{% block endbody %}
<script type="text/javascript">
$(window).scroll(function() {
var position = $(this).scrollTop();
$('.link-section').each(function() {
var target = $(this).offset().top;
var id = $(this).attr('id');
if (position >= target) {
$('.sidelinks').removeClass('active');
$('a[href="#' + id + '"]').addClass('active');
}
});
});
$('.sidelinks').on('click', function() {
$('html, body').animate({scrollTop: $(this.hash).offset().top + 5}, 1000);
return false;
});
</script>
<script type="application/javascript">
gtag('config', 'UA-157720658-3', {'content_group1': 'Hub Pages'});