Fix up some style/html inconsistencies

- Use new FAQ formatting (light-mode compatible) on XRPL Overview
  mini-faq
- Unify chip styles
- Fix homepage "In Development" chips getting cut off
- Update style dependencies (node-sass 6.0.1, Bootstrap 4.6.0, etc.)
This commit is contained in:
mDuo13
2021-08-04 17:30:13 -07:00
parent 969d6a9894
commit 20fd184429
10 changed files with 383 additions and 307 deletions

View File

@@ -169,17 +169,20 @@
{% set features = [
{ "chip": _("In Development"),
"title": _("Smart Contracts"),
"description": _("Hooks are small, efficient WebAssembly modules designed specifically for the XRPL. Check out the <a href='https://hooks-testnet.xrpl-labs.com/' target='_blank'>hooks amendment and public testnet</a> that enable smart contract functionality.") },
"description": _("Hooks are small, efficient WebAssembly modules designed specifically for the XRPL. Check out the <a href='https://hooks-testnet.xrpl-labs.com/' target='_blank'>hooks amendment and public testnet</a> that enable smart contract functionality."),
"href": "https://hooks-testnet.xrpl-labs.com/" },
{ "chip": _("In Development"),
"title": _("Non-Fungible Tokens"),
"description": _("Lower fees, faster transactions, and custom token functionality make the XRPL ideally suited for building an ecosystem for NFTs. Explore <a href='docs.html'>proposed standards</a> for issuing NFTs.")},
"description": _("Lower fees, faster transactions, and custom token functionality make the XRPL ideally suited for building an ecosystem for NFTs. Explore <a href='docs.html#docs-hot-topic'>proposed standards</a> for issuing NFTs."),
"href": "docs.html#docs-hot-topic"},
{ "chip": _("In Development"),
"title": _("Sidechains"),
"description": _("Extend, experiment, and specialize a custom sidechain based on the XRPL's proven blockchain technology. Learn more about <a href='https://dev.to/ripplexdev/a-vision-for-federated-sidechains-on-the-xrp-ledger-2o7o' target='_blank'>the vision of sidechains</a>.")},
"description": _("Extend, experiment, and specialize a custom sidechain based on the XRPL's proven blockchain technology. Learn more about <a href='https://dev.to/ripplexdev/a-vision-for-federated-sidechains-on-the-xrp-ledger-2o7o' target='_blank'>the vision of sidechains</a>."),
"href": "https://dev.to/ripplexdev/a-vision-for-federated-sidechains-on-the-xrp-ledger-2o7o"},
] %}
{% for feat in features %}
<li class="col-new ls-none pt-3-sm">
<h5 class="chip chip-green">{{feat.chip}}</h5>
<li class="col-new ls-none pt-2">
<a class="label chip-green" href="{{feat.href}}">{{feat.chip}}</a>
<h4 class="mt-3 mb-0 h5">{{feat.title}}</h4>
<p class="mt-6-until-sm mt-3 mb-0">{{feat.description}}</p>
</li>

View File

@@ -109,27 +109,26 @@
</section>
<section class="container-new py-26">
<div class="col-md-6 offset-md-3 w-100 pl-0 pr-0" id="accordion">
<div class="col-md-6 offset-md-3 w-100 pl-0 pr-0 mini-faq" id="minifaq-accordion">
{% set faqs = [
{ "number": "1",
"question": _("Is XRPL a private blockchain, owned by Ripple?"),
{ "question": _("Is XRPL a private blockchain, owned by Ripple?"),
"answer": _("No, the XRP Ledger is a decentralized, public blockchain. Any changes that would impact transaction processing or consensus need to be approved by at least 80%% of the network. Ripple is a contributor to the network, but its rights are the same as those of other contributors. In terms of validation, there are 150+ validators on the network with 35+ on the Unique Node List (see “What are Unique Node Lists (UNLs)?” in the Full FAQ) — Ripple runs 6 of these nodes.") },
{ "number": "2",
"question": _("Isnt Proof of Work the best validation mechanism?"),
{ "question": _("Isnt Proof of Work the best validation mechanism?"),
"answer": _("Proof of Work (PoW) was the first mechanism to solve the double spend problem without requiring a trusted 3rd party. However the XRP Ledgers consensus mechanism solves the same problem in a far faster, cheaper and more energy efficient way.") },
{ "number": "3",
"question": _("How can a blockchain be sustainable?"),
{ "question": _("How can a blockchain be sustainable?"),
"answer": _("Its been widely reported that Bitcoins energy consumption, as of 2021, is equivalent to that used by Argentina, with much of the electricity Bitcoin miners use coming from polluting sources. The XRP Ledger confirms transactions through a “consensus” mechanism - which does not waste energy like proof of work does - and leverages carbon offsets to be <a href='https://ripple.com/ripple-press/ripple-leads-sustainability-agenda-to-achieve-carbon-neutrality-by-2030/' target='_blank'>one of the first truly carbon neutral blockchains</a>. Explore the energy consumption of XRP compared to cash, credit cards and other popular cryptocurrencies with the <a href='carbon-calculator.html'>Green Currency Calculator</a>.") },
] %}
{% for faq in faqs %}
<div class="w-100 accordian-row mb-6">
<h3 class="mb-0 h6" id="heading{{faq.number}}">
<a href="#" class="white collapsed w-100 d-block expander" data-toggle="collapse" data-target="#collapse{{faq.number}}" aria-expanded="false" aria-controls="collapse{{faq.number}}">
<div class="q-wrapper">
<a href="#heading{{loop.index}}" class="expander collapsed" data-toggle="collapse" data-target="#answer{{loop.index}}" aria-expanded="false" aria-controls="answer{{loop.index}}">
<h4 id="heading{{loop.index}}">
{{faq.question}}
<span class="chevron"><span></span><span></span></span>
</a>
</h3>
<p id="collapse{{faq.number}}" class="collapse mt-3 mb-0" aria-labelledby="heading{{faq.number}}" data-parent="#accordion">{{faq.answer}}</p>
</h4>
<div id="answer{{loop.index}}" class="answer-wrapper collapse" aria-labelledby="heading{{loop.index}}">
<p>{{faq.answer}}</p>
</div><!--/.answer-wrapper {{loop.index}} -->
</div>
{% endfor %}
<center>