mirror of
https://github.com/XRPLF/xrpl-dev-portal.git
synced 2025-11-20 11:45:50 +00:00
Properly remove carbon calculator
This commit is contained in:
mDuo13
File diff suppressed because one or more lines are too long
@@ -1,237 +0,0 @@
|
||||
let calculator_data = {
|
||||
'btc': {
|
||||
'kWh': 951.58,
|
||||
'tons': 0.000000466,
|
||||
'gas': 75.7
|
||||
},
|
||||
'eth': {
|
||||
'kWh': 42.86334969,
|
||||
'tons': 0.0000000273454,
|
||||
'gas': 2.38677
|
||||
},
|
||||
'pap': {
|
||||
'kWh': 0.044,
|
||||
'tons': 0.0000000000232,
|
||||
'gas': 0.0035
|
||||
},
|
||||
'xrp': {
|
||||
'kWh': 0.0079,
|
||||
'tons': 0.0000000000045,
|
||||
'gas': 0.00063
|
||||
},
|
||||
'vsa': {
|
||||
'kWh': 0.0008,
|
||||
'tons': 0.00000000000046,
|
||||
'gas': 0.00006
|
||||
},
|
||||
'mst': {
|
||||
'kWh': 0.0006,
|
||||
'tons': 0.00000000000051,
|
||||
'gas': 0.00005
|
||||
},
|
||||
}
|
||||
|
||||
function commarize() {
|
||||
// Alter numbers larger than 1k
|
||||
if (this >= 1e6) {
|
||||
var units = ["Thousand", "Million", "Billion", "Trillion"];
|
||||
|
||||
// Divide to get SI Unit engineering style numbers (1e3,1e6,1e9, etc)
|
||||
let unit = Math.floor(((this).toFixed(0).length - 1) / 3) * 3
|
||||
// Calculate the remainder
|
||||
var num = (this / ('1e'+unit)).toFixed(2)
|
||||
var unitname = units[Math.floor(unit / 3) - 1]
|
||||
|
||||
// output number remainder + unitname
|
||||
return num + ' ' + unitname
|
||||
}
|
||||
|
||||
// return formatted original number
|
||||
return this.toLocaleString()
|
||||
}
|
||||
|
||||
// Add method to prototype. this allows you to use this function on numbers and strings directly
|
||||
Number.prototype.commarize = commarize
|
||||
String.prototype.commarize = commarize
|
||||
|
||||
let slider = document.getElementById( 'myRange' ),
|
||||
txns = document.querySelectorAll( '.slider-amt' ),
|
||||
dataTypes = document.querySelectorAll( '.d-output' ),
|
||||
dataTxns = document.querySelectorAll( '.dash' ),
|
||||
dataViz = document.querySelectorAll( '.viz-output' );
|
||||
|
||||
// Update the current slider value (each time you drag the slider handle)
|
||||
function doCalculations(val){
|
||||
|
||||
// This loops through all the dataTypes returning the calculations for the selected one
|
||||
[].slice.call(dataTypes).forEach( function( dataType ){
|
||||
|
||||
// if 'active', do calculations
|
||||
if (dataType.classList.contains('active')){
|
||||
|
||||
// looping through the calculator data
|
||||
let data_type = dataType.getAttribute( 'data-type' ),
|
||||
data_comp = dataType.getAttribute( 'data-comp' ),
|
||||
total = val * 1000000 * calculator_data[ data_type ][ data_comp ],
|
||||
num = document.getElementById( data_comp + '-' + data_type ),
|
||||
|
||||
// kWhcomp = the number of kWh Portugal used in 2019
|
||||
kWhComp = ( total / 50340000000 ).toFixed( 2 );
|
||||
|
||||
if (data_comp === 'tons') {
|
||||
total = total * 1000000;
|
||||
}
|
||||
|
||||
num.innerHTML = total.commarize();
|
||||
num.style.transition = "all .2s ease-in-out";
|
||||
|
||||
// This is for the kWh comparison, it animates the transition/selection
|
||||
if (data_comp === 'kWh' && kWhComp > .02){
|
||||
if ( kWhComp > 1.1 ) { kWhComp = 1.03 };
|
||||
let dot = document.getElementById(data_comp + '-' + data_type + '-dot');
|
||||
dot.style.transition = "all .2s ease-in-out";
|
||||
dot.style.transform = "scale(" + kWhComp * 100 + ")";
|
||||
dot.style.webkitTransform = "scale(" + kWhComp * 100 + ")";
|
||||
dot.style.msTransform = "scale(" + kWhComp * 100 + ")";
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// This function is for the slider to highlight the selected number
|
||||
function highlightNum(val){
|
||||
[].slice.call(dataTxns).forEach(function(dataTxn){
|
||||
dataTxn.classList.remove('active');
|
||||
if (dataTxn.dataset.num === val){
|
||||
dataTxn.classList.add('active')
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Run animations if crypto is selected
|
||||
function cryptoSelected(){
|
||||
gasCryptoAnimation();
|
||||
co2CryptoAnimation();
|
||||
}
|
||||
// Run animations if cash is selected
|
||||
function cashSelected(){
|
||||
gasCashAnimation();
|
||||
co2CashAnimation();
|
||||
}
|
||||
// Run animations if credit is selected
|
||||
function creditSelected(){
|
||||
gasCreditAnimation();
|
||||
co2CreditAnimation();
|
||||
}
|
||||
|
||||
// This is function to select the data type
|
||||
function changeDataType( type ){
|
||||
|
||||
[].slice.call(dataTypes).forEach( function(dataType){
|
||||
if (dataType.classList.contains(type)){
|
||||
let dType = type.substring(2);
|
||||
dataType.classList.add('active');
|
||||
document.getElementById('gasAnimation').innerHTML = '';
|
||||
document.getElementById('co2Animation').innerHTML = '';
|
||||
|
||||
if (dType === 'cash'){
|
||||
cashSelected();
|
||||
} else if (dType === 'credit'){
|
||||
creditSelected()
|
||||
} else {
|
||||
cryptoSelected();
|
||||
}
|
||||
} else {
|
||||
dataType.classList.remove('active');
|
||||
}
|
||||
});
|
||||
|
||||
// based on toggle, then to calculations + slider value
|
||||
doCalculations(slider.value);
|
||||
|
||||
}
|
||||
|
||||
$('.tab-link').on('click', function(e){
|
||||
e.preventDefault();
|
||||
$('#data-selector li').removeClass('active');
|
||||
$(this).parent('li').addClass('active');
|
||||
|
||||
// Pass the type to the Change Data function
|
||||
let type = $(this).data("currencytype");
|
||||
changeDataType(type);
|
||||
ga( 'send', 'event', 'Carbon Calculator', 'Toggle Data Type', type );
|
||||
})
|
||||
|
||||
// This is main section that will run the functions once the page is ready
|
||||
$(document).ready(function(){
|
||||
// gets the slider value
|
||||
[].slice.call(txns).forEach(function(txn){
|
||||
txn.innerHTML = slider.value;
|
||||
})
|
||||
|
||||
// On the slider change, run the Calculator functions
|
||||
slider.oninput = function() {
|
||||
var val = this.value;
|
||||
[].slice.call(txns).forEach(function(txn){
|
||||
txn.innerHTML = val;
|
||||
});
|
||||
highlightNum(val);
|
||||
doCalculations(val);
|
||||
ga( 'send', 'event', 'Carbon Calculator', 'Slider Data Amount', val );
|
||||
}
|
||||
|
||||
// On page load, run default functions
|
||||
doCalculations(slider.value);
|
||||
cryptoSelected();
|
||||
|
||||
// For mobile, show or hide the button
|
||||
$(window).on('load resize scroll', function() {
|
||||
if ($(window).width() < 993) {
|
||||
let distance = $('#calculator-outputs').offset().top,
|
||||
$window = $(window).scrollTop(),
|
||||
data_toggle = $('#calculator-mobile-toggle'),
|
||||
inputs = $('#calculator-inputs'),
|
||||
inputs_offset = $('#calculator-inputs-offset');
|
||||
|
||||
if (distance < $window){
|
||||
data_toggle.addClass('show').removeClass('hide');
|
||||
} else {
|
||||
inputs.removeClass('sticky');
|
||||
data_toggle.addClass('hide').removeClass('show');
|
||||
inputs_offset.removeClass('offset' );
|
||||
$('#data-toggle').text('Change Inputs');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// This is the mobile button
|
||||
$('#calculator-mobile-toggle').on( 'click', function(e){
|
||||
e.preventDefault();
|
||||
|
||||
let inputs = $('#calculator-inputs'),
|
||||
inputs_offset = $('#calculator-inputs-offset');
|
||||
|
||||
$('#calculator-inputs' ).toggleClass('show');
|
||||
|
||||
if (inputs.hasClass('sticky')) {
|
||||
inputs.removeClass('sticky');
|
||||
inputs_offset.removeClass('offset');
|
||||
$(this).text('Change Inputs');
|
||||
ga( 'send', 'event', 'Carbon Calculator', 'Mobile Toggle', 'Change Inputs' );
|
||||
} else {
|
||||
inputs.addClass('sticky show');
|
||||
inputs_offset.addClass('offset');
|
||||
$(this).text('Hide Inputs');
|
||||
ga( 'send', 'event', 'Carbon Calculator', 'Mobile Toggle', 'Hide Inputs' );
|
||||
}
|
||||
});
|
||||
|
||||
$(document).on('click', 'a[href^="#calculator"]', function(event) {
|
||||
event.preventDefault();
|
||||
|
||||
$('html, body').animate({
|
||||
scrollTop: $($.attr(this, 'href')).offset().top - 80
|
||||
}, 800);
|
||||
});
|
||||
|
||||
});
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
@@ -27,7 +27,7 @@ name: よくある質問
|
||||
|
||||
#### どのようにして持続可能なブロックチェーンを実現するのでしょうか？
|
||||
|
||||
ビットコインのエネルギー消費量は、2021年現在アルゼンチンのエネルギー総消費量に相当します。また、ビットコインの採掘者が使用する電力の多くは環境を汚染するリソースから供給されていることが広く報告されています。XRPLは、プルーフ・オブ・ワークのようにエネルギーを浪費しない[コンセンサス・メカニズム](intro-to-consensus.html)を通じてトランザクションを承認し、カーボン・オフセットを活用して、[真にカーボンニュートラルな最初のブロックチェーンのひとつ](https://ripple.com/ripple-press/ripple-leads-sustainability-agenda-to-achieve-carbon-neutrality-by-2030)となっています。[グリーン・カレンシー・カルキュレーター](carbon-calculator.html)を利用して、現金、クレジットカード、その他の人気のある暗号通貨と比較したXRPのエネルギー消費量を調べてみてください。
|
||||
ビットコインのエネルギー消費量は、2021年現在アルゼンチンのエネルギー総消費量に相当します。また、ビットコインの採掘者が使用する電力の多くは環境を汚染するリソースから供給されていることが広く報告されています。XRPLは、プルーフ・オブ・ワークのようにエネルギーを浪費しない[コンセンサス・メカニズム](intro-to-consensus.html)を通じてトランザクションを承認し、カーボン・オフセットを活用して、[真にカーボンニュートラルな最初のブロックチェーンのひとつ](https://ripple.com/ripple-press/ripple-leads-sustainability-agenda-to-achieve-carbon-neutrality-by-2030)となっています。
|
||||
|
||||
|
||||
#### XRPLではXRP以外の通貨も取引できますか？
|
||||
|
||||
@@ -27,7 +27,7 @@ Proof of Work (PoW) was the first mechanism to solve the double spend problem wi
|
||||
|
||||
#### How can a blockchain be sustainable?
|
||||
|
||||
It’s been widely reported that Bitcoin’s 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](intro-to-consensus.html)” mechanism - which does not waste energy like proof of work does - and leverages carbon offsets to be [one of the first truly carbon neutral blockchains](https://ripple.com/ripple-press/ripple-leads-sustainability-agenda-to-achieve-carbon-neutrality-by-2030/). Explore the energy consumption of XRP compared to cash, credit cards and other popular cryptocurrencies with the [Green Currency Calculator](carbon-calculator.html).
|
||||
It’s been widely reported that Bitcoin’s 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](intro-to-consensus.html)” mechanism - which does not waste energy like proof of work does - and leverages carbon offsets to be [one of the first truly carbon neutral blockchains](https://ripple.com/ripple-press/ripple-leads-sustainability-agenda-to-achieve-carbon-neutrality-by-2030/).
|
||||
|
||||
#### Can currencies other than XRP be traded through XRPL?
|
||||
|
||||
|
||||
@@ -345,29 +345,15 @@ pages:
|
||||
targets:
|
||||
- ja
|
||||
|
||||
# - name: Carbon Calculator
|
||||
# html: carbon-calculator.html
|
||||
# parent: xrp-ledger-overview.html
|
||||
# template: page-calculator.html.jinja
|
||||
# top_nav_grouping: Sustainability
|
||||
# sidebar: disabled
|
||||
# blurb: Whether it's cash, credit, or crypto, every transaction you make consumes energy. Use the XRPL cryptocurrency carbon calculator to compare.
|
||||
# fb_card: currency-calculator-card-fb.png
|
||||
# twitter_card: currency-calculator-card-tw.png
|
||||
# targets:
|
||||
# - en
|
||||
|
||||
# - name: 二酸化炭素電卓
|
||||
# html: carbon-calculator.html
|
||||
# parent: xrp-ledger-overview.html
|
||||
# template: page-calculator.html.jinja
|
||||
# top_nav_grouping: Sustainability
|
||||
# sidebar: disabled
|
||||
# blurb: 現金、クレジットカード、暗号資産でもエネルギー消費する。インタラクティブツールで消費量を比較しましょう。
|
||||
# fb_card: currency-calculator-card-fb.png
|
||||
# twitter_card: currency-calculator-card-tw.png
|
||||
# targets:
|
||||
# - ja
|
||||
# Redirect old Carbon Calculator page to Impact
|
||||
- name: Carbon Calculator
|
||||
html: carbon-calculator.html
|
||||
template: pagetype-redirect.html.jinja
|
||||
redirect_url: impact.html
|
||||
targets:
|
||||
- en
|
||||
- ja
|
||||
|
||||
- name: XRPL Foundation
|
||||
html: https://foundation.xrpl.org/
|
||||
|
||||
@@ -182,7 +182,4 @@ p {
|
||||
// font-family: 'Work Sans', 'Noto Sans JP', sans-serif;
|
||||
// }
|
||||
|
||||
&.page-calculator #data-selector li a {
|
||||
padding: 0.5rem 1.1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -428,18 +428,6 @@
|
||||
right: -4px;
|
||||
}
|
||||
|
||||
// Calculator
|
||||
#calculator-purple {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
#calculator-green {
|
||||
position: absolute;
|
||||
top: 160px;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
// Foundation Page
|
||||
#foundation-magenta {
|
||||
position: absolute;
|
||||
@@ -1325,276 +1313,6 @@
|
||||
}
|
||||
|
||||
|
||||
.page-calculator {
|
||||
|
||||
.calculator-section-description {
|
||||
max-width: 458px;
|
||||
}
|
||||
/* CALCULATOR STYLING */
|
||||
.calc-inputs {
|
||||
margin-right: 1px;
|
||||
}
|
||||
#data-selector li a {
|
||||
background: #22252B;
|
||||
padding: 0.5rem 1.3rem;
|
||||
color: $white;
|
||||
white-space: nowrap;
|
||||
font-weight: normal;
|
||||
}
|
||||
#data-selector li:nth-child(2) {
|
||||
margin-left: -7px;
|
||||
margin-right: -7px;
|
||||
}
|
||||
#data-selector li.active a {
|
||||
background: $primary;
|
||||
color: $black;
|
||||
}
|
||||
.tab-content div {
|
||||
display: none;
|
||||
}
|
||||
.d-output {
|
||||
display: none;
|
||||
margin: 0 12px;
|
||||
max-width: 188px;
|
||||
width: 33%;
|
||||
@include media-breakpoint-down(md) {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
.d-output.active {
|
||||
display: block;
|
||||
animation-fill-mode: forwards;
|
||||
animation: fadeIn 1s ease-in-out;
|
||||
@include media-breakpoint-down(md) {
|
||||
display: inline-block;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
@include media-breakpoint-down(xs) {
|
||||
display: block
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-down(xs) {
|
||||
.d-output {
|
||||
display: none;
|
||||
width: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
.viz-wrapper {
|
||||
margin-right: 1rem;
|
||||
min-width: 184px;
|
||||
}
|
||||
.num-wrapper {
|
||||
h5 {
|
||||
font-size: 1.3rem;
|
||||
word-break: break-word;
|
||||
}
|
||||
}
|
||||
.d-output[data-comp="kWh"].active {
|
||||
display: inline-flex;
|
||||
}
|
||||
#data-selector li:nth-child(2) {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
border-top: 1px solid $black;
|
||||
border-bottom: 1px solid $black;
|
||||
}
|
||||
}
|
||||
@include media-breakpoint-down(md) {
|
||||
#calculator-inputs-offset.offset {
|
||||
height: 404px;
|
||||
width: 100%;
|
||||
}
|
||||
#calculator-inputs-offset {
|
||||
height: 0;
|
||||
width: 100%;
|
||||
}
|
||||
.d-output {
|
||||
margin: 2rem 0;
|
||||
}
|
||||
#calculator-mobile-toggle.show {
|
||||
position: fixed;
|
||||
top: 84px;
|
||||
right: 15px;
|
||||
z-index: 9999999;
|
||||
background: $black;
|
||||
}
|
||||
#calculator-mobile-toggle.hide {
|
||||
display: none;
|
||||
}
|
||||
#calculator-inputs.sticky {
|
||||
position: fixed;
|
||||
top: 84px;
|
||||
width: calc(100% - 30px);
|
||||
left: 15px;
|
||||
right: 15px;
|
||||
background: $black;
|
||||
display: none;
|
||||
}
|
||||
#calculator-inputs.sticky.show .calc-inputs-wrapper {
|
||||
display: block;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
#calculator-inputs.sticky.show {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
@include media-breakpoint-down(sm) {
|
||||
#calculator-inputs-offset.offset {
|
||||
height: 486px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@include media-breakpoint-up(xl){
|
||||
#data-selector li:first-child a {
|
||||
border-top-left-radius: 8px;
|
||||
border-bottom-left-radius: 8px;
|
||||
}
|
||||
#data-selector li:last-child a {
|
||||
border-top-right-radius: 8px;
|
||||
border-bottom-right-radius: 8px;
|
||||
}
|
||||
}
|
||||
@include media-breakpoint-down(lg) {
|
||||
#data-selector li:nth-child(2) {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
.viz-wrapper {
|
||||
position: relative;
|
||||
height: 204px;
|
||||
width: 184px;
|
||||
overflow: hidden;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.viz-wrapper img {
|
||||
margin-left: -1px;
|
||||
margin-right: -1px;
|
||||
}
|
||||
@keyframes fadeIn {
|
||||
0% { opacity: 0 }
|
||||
100% { opacity: 1 }
|
||||
}
|
||||
.dot {
|
||||
height: 2px;
|
||||
width: 2px;
|
||||
border-radius: 50%;
|
||||
background-color: red;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
top: 98px;
|
||||
left: 68px;
|
||||
transform-origin: center center;
|
||||
}
|
||||
#kWh-btc-dot {
|
||||
background-color: #FF671A;
|
||||
}
|
||||
#kWh-eth-dot {
|
||||
background-color: #4F5664;
|
||||
}
|
||||
#kWh-xrp-dot {
|
||||
background-color: $primary;
|
||||
}
|
||||
#kWh-pap-dot {
|
||||
}
|
||||
|
||||
.dash {
|
||||
&.active {
|
||||
font-weight: bold;
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
.dash:before {
|
||||
// content: url(../img/icons/dash-line.png);
|
||||
content: '|';
|
||||
font-size: 7px;
|
||||
font-weight: bold;
|
||||
color: $gray-500;
|
||||
position: absolute;
|
||||
top: -10px;
|
||||
margin-left: 13px;
|
||||
}
|
||||
|
||||
|
||||
input[type=range] {
|
||||
-webkit-appearance: none; /* Hides the slider so that custom slider can be made */
|
||||
width: 100%; /* Specific width is required for Firefox. */
|
||||
background: transparent; /* Otherwise white in Chrome */
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
input[type=range]::-webkit-slider-thumb {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
input[type=range]:focus {
|
||||
outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
|
||||
}
|
||||
|
||||
input[type=range]::-ms-track {
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
|
||||
/* Hides the slider so custom styles can be added */
|
||||
background: transparent;
|
||||
border-color: transparent;
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
.slider::-webkit-slider-thumb {
|
||||
-webkit-appearance: none; /* Override default look */
|
||||
appearance: none;
|
||||
box-sizing: content-box;
|
||||
border-radius: 50px;
|
||||
-webkit-border-radius: 50px;
|
||||
-moz-border-radius: 50px;
|
||||
width: 1px; /* Set a specific slider handle width */
|
||||
height: 1px; /* Slider handle height */
|
||||
background: $primary;
|
||||
padding: 0.125rem;
|
||||
border: 8px solid $black;
|
||||
box-shadow: 0 0 0 2px $primary;
|
||||
cursor: pointer; /* Cursor on hover */
|
||||
}
|
||||
|
||||
.slider::-moz-range-thumb {
|
||||
-webkit-appearance: none; /* Override default look */
|
||||
appearance: none;
|
||||
box-sizing: content-box;
|
||||
border-radius: 50px;
|
||||
-webkit-border-radius: 50px;
|
||||
-moz-border-radius: 50px;
|
||||
width: 1px; /* Set a specific slider handle width */
|
||||
height: 1px; /* Slider handle height */
|
||||
background: $primary;
|
||||
padding: 0.125rem;
|
||||
border: 8px solid $black;
|
||||
box-shadow: 0 0 0 2px $primary;
|
||||
cursor: pointer; /* Cursor on hover */
|
||||
}
|
||||
input[type="range"] {
|
||||
background: $primary;
|
||||
height: 3px;
|
||||
}
|
||||
|
||||
/** FF*/
|
||||
input[type="range"]::-moz-range-progress {
|
||||
background-color: $primary;
|
||||
}
|
||||
input[type="range"]::-moz-range-track {
|
||||
background-color: $gray-500;
|
||||
}
|
||||
/* IE*/
|
||||
input[type="range"]::-ms-fill-lower {
|
||||
background-color: $primary;
|
||||
}
|
||||
input[type="range"]::-ms-fill-upper {
|
||||
background-color: $gray-500;
|
||||
}
|
||||
}
|
||||
|
||||
.page-dev-tools {
|
||||
@each $tool,
|
||||
$card-graphic
|
||||
|
||||
@@ -69,51 +69,3 @@ td:nth-child(1) {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#calculator-table {
|
||||
width: 100%;
|
||||
thead {
|
||||
// border-bottom: 3px solid;
|
||||
// border-image-slice: 1;
|
||||
// border-width: 5px;
|
||||
// border-image-source: linear-gradient(90deg, #B480FF -0.32%, #5F00E6 32.7%, #1AA4FF 61.53%, #19FF83 100.32%);
|
||||
// -webkit-border-image: -webkit-gradient(90deg, #B480FF -0.32%, #5F00E6 32.7%, #1AA4FF 61.53%, #19FF83 100.32%);
|
||||
|
||||
// &::after{
|
||||
// content: url(../../img/graphics/table-border.svg);
|
||||
// }
|
||||
}
|
||||
td {
|
||||
padding: 1.5rem 0;
|
||||
@include media-breakpoint-down(sm) {
|
||||
font-size: $base-size;
|
||||
}
|
||||
}
|
||||
tbody td {
|
||||
padding: 2rem 0;
|
||||
}
|
||||
thead tr,
|
||||
tbody tr {
|
||||
border-bottom: 1px solid $gray-600;
|
||||
}
|
||||
.ratio {
|
||||
font-size: 1rem;
|
||||
display: block;
|
||||
margin-top: -8px;
|
||||
color: $gray-500;
|
||||
}
|
||||
@include media-breakpoint-down(md) {
|
||||
table {
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
table .fs-5-5 {
|
||||
font-size: 1rem !important;
|
||||
}
|
||||
table .fs-6 {
|
||||
font-size: 1.125rem;
|
||||
}
|
||||
table td:first-child {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -108,6 +108,3 @@ html.light {
|
||||
}
|
||||
}
|
||||
|
||||
.page-calculator #calculator-mobile-toggle.show {
|
||||
top: ($banner-top-offset + 4px)
|
||||
}
|
||||
|
||||
@@ -659,30 +659,6 @@ pre code {
|
||||
background-color: $light-bg;
|
||||
}
|
||||
|
||||
// Carbon calculator
|
||||
.page-calculator {
|
||||
#co2Animation,
|
||||
#gasAnimation {
|
||||
//filter: invert(100%) hue-rotate(200deg) brightness(1.8);
|
||||
// Leave these dark for now
|
||||
background: $body-bg;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
#calculator-mobile-toggle.show {
|
||||
background-color: $blue-purple-500;
|
||||
color: $white;
|
||||
}
|
||||
#calculator-inputs.sticky {
|
||||
background-color: $light-bg;
|
||||
}
|
||||
|
||||
#data-selector li:not(.active) a {
|
||||
background-color: $light-form-bg;
|
||||
color: $light-fg;
|
||||
}
|
||||
}
|
||||
|
||||
// Use Cases & Featured Projects page
|
||||
.page-uses {
|
||||
|
||||
|
||||
@@ -1,415 +0,0 @@
|
||||
{% extends "base.html.jinja" %}
|
||||
{% block head %}
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
<meta http-equiv="refresh" content="0;url=https://xrpl.org/impact.html"> </meta>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block bodyclasses %}no-sidebar page-calculator{% endblock %}
|
||||
{% block mainclasses %}landing{% endblock %}
|
||||
|
||||
{% block breadcrumbs %}{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="position-relative">
|
||||
<img src="./img/backgrounds/calculator-purple.svg" class="landing-bg" id="calculator-purple">
|
||||
</div>
|
||||
|
||||
<section class="py-26 text-center">
|
||||
<div class="col-lg-5 mx-auto text-center">
|
||||
<div class="d-flex flex-column-reverse">
|
||||
<h1 class="mb-10">{% trans %}Green Currency Interactive Tool{% endtrans %}</h1>
|
||||
<h6 class="eyebrow mb-3">{% trans %}How Green Is Your Currency?{% endtrans %}</h6>
|
||||
</div>
|
||||
<a class="btn btn-primary" href="#carbon-calculator-section">Explore</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="position-relative d-none-sm">
|
||||
<img src="./img/backgrounds/calculator-green.svg" id="calculator-green">
|
||||
</div>
|
||||
|
||||
<section class="container-new py-26">
|
||||
<div class="col-lg-6 offset-lg-3 p-10-until-sm pt-0">
|
||||
<h2 class="h4 h2-sm mb-8">{% trans %}Energy Consumption for Cash, Credit Cards and Crypto{% endtrans %}</h2>
|
||||
<h5 class="longform mb-10">{% trans %}Moving money carries cost—and not just the fee on your transaction or the value of your payment.{% endtrans %}</h5>
|
||||
<p class="mb-6">{% trans %}Whether it’s in cash, on a credit card or with crypto, every transaction you make consumes energy, and therefore, emits pollutants into the environment.{% endtrans %}</p>
|
||||
<p class="mb-6">{% trans %}The impact of this is startling when you look at the total transactions across an entire year—for any one form of currency.{% endtrans %}</p>
|
||||
<p class="mb-0">{% trans %}Find out more about the environmental cost of some of the world’s most popular and innovative currencies, and start making more educated choices about how you transact.{% endtrans %}</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="container-new py-26">
|
||||
<div class="col-md-6 offset-md-3 p-6-sm p-10-until-sm br-8 cta-card">
|
||||
<img src="./img/backgrounds/cta-calculator-green.svg" class="cta cta-bottom-right">
|
||||
<div class="z-index-1 position-relative">
|
||||
<h2 class="h4 mb-10-until-sm mb-8-sm">{% trans %}How Does XRP Compare to Other Currencies?{% endtrans %}</h2>
|
||||
<a class="btn btn-primary btn-arrow" href="{{currentpage.prefix}}assets/pdf/xrpl-sustainability-methodology-2020.pdf">Methodology</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<div class="container py-26" id="carbon-calculator-section">
|
||||
<section class="row">
|
||||
<a href="#" class="btn btn-outline-primary d-lg-none" id="calculator-mobile-toggle">{% trans %}Change Inputs{% endtrans %}</a>
|
||||
<div id="calculator-inputs-offset"></div>
|
||||
<div class="col-lg-4" >
|
||||
<div class="rounded sticky-top floating-nav mb-3 mb-lg-0" id="calculator-inputs">
|
||||
<div class="border-green p-3 br-8 calc-inputs">
|
||||
<h4 class="h5">{% trans %}Comparing<br class="until-sm"/> Transaction Data{% endtrans %}</h4>
|
||||
<ul class="p-0 mt-10 ls-none d-sm-flex d-lg-block d-xl-flex flex-wrap justify-content-center justify-xl-content-around" id="data-selector">
|
||||
<li class="d-block d-xl-inline-flex text-center active"><a class="tab-link d-block d-xl-flex fs-base va-middle" href="#" data-currencytype="d-crypto">{% trans %}Crypto{% endtrans %}</a></li>
|
||||
<li class="d-block d-xl-inline-flex text-center"><a class="tab-link d-block d-xl-flex fs-base va-middle" href="#" data-currencytype="d-credit">{% trans %}Credit Cards{% endtrans %}</a></li>
|
||||
<li class="d-block d-xl-inline-flex text-center"><a class="tab-link d-block d-xl-flex fs-base va-middle" href="#" data-currencytype="d-cash">{% trans %}Cash{% endtrans %}</a></li>
|
||||
</ul>
|
||||
<p class="grey-500 mb-0 mt-4 text-smaller">Number of Transactions:</p>
|
||||
<div class="slidecontainer mb-10">
|
||||
<input type="range" min="20" max="100" value="60" class="slider w-100" id="myRange" step="20">
|
||||
<ul class="d-flex p-0 ls-none justify-content-between position-relative mr-neg-8 ml-neg-8 mt-1" style="z-index: -1;">
|
||||
{% set numbers = [
|
||||
{ "num": "20" },
|
||||
{ "num": "40" },
|
||||
{ "num": "60" },
|
||||
{ "num": "80" },
|
||||
{ "num": "100" },
|
||||
] %}
|
||||
{% for number in numbers %}
|
||||
<li class="dash text-center text-smaller grey-500" data-num="{{number.num}}">{{number.num}}M</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="d-flex mb-3 ml-3">
|
||||
<a href="https://twitter.com/intent/tweet?url=https://xrpl.org/carbon-calculator.html&text=XRPL Carbon Calculator" target="_blank" class="mr-3"><img src="./img/logos/twitter-link.svg" alt="{% trans %}Twitter share{% endtrans %}" class="mw-100"></a>
|
||||
<a href="https://www.linkedin.com/sharing/share-offsite/?url=https://xrpl.org/carbon-calculator.html" target="_blank" class="mr-3"><img src="./img/logos/linkedin.svg" alt="{% trans %}LinkedIn share{% endtrans %}" class="mw-100"></a>
|
||||
<a href="https://www.facebook.com/sharer/sharer.php?u=https://xrpl.org/carbon-calculator.html" target="_blank" class="mr-3"><img src="./img/logos/facebook.svg" alt="{% trans %}Facebook share{% endtrans %}" class="mw-100">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<a href="./assets/pdf/xrpl-sustainability-methodology-2020.pdf" target="_blank" class="arrow-link bold mt-4 d-block">{% trans %}Learn more about the methodology{% endtrans %}</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-7 offset-lg-1 scroll-container h-100 mt-20-sm" id="calculator-outputs">
|
||||
<section class="min-vh100 bb-gray mb-40 section1 clearfix">
|
||||
<h4 class="h5">{% trans %}Energy Consumption of Portugal{% endtrans %}</h4>
|
||||
|
||||
<p class="grey-400 text-small my-4">{% trans %}Comparing <span class="slider-amt"></span> Million Transactions in 2019{% endtrans %}</p>
|
||||
|
||||
<p class="calculator-section-description">{% trans %}The country of Portugal consumes 46.94 billion Kilowatt hours (kWh) of energy annually. Explore how much energy today’s various currencies consume in relation to Portugal.{% endtrans %}</p>
|
||||
|
||||
<div class="d-viz d-viz-1 mt-10">
|
||||
<ul class="d-sm-flex p-0">
|
||||
<li class="d-output d-crypto active" data-comp="kWh" data-type="btc">
|
||||
<div class="viz-wrapper">
|
||||
<img src="./img/green/Portugal.png" alt="{% trans %}Portugal{% endtrans %}" class="mw-100">
|
||||
<div class="dot" id="kWh-btc-dot"></div>
|
||||
</div>
|
||||
<div class="num-wrapper">
|
||||
<img src="{{currentpage.prefix}}assets/img/icons/bw-bitcoin.png" alt="BTC" class="mw-100 mt-3 invertible-img">
|
||||
<p class="h6 mt-2 mb-1">{% trans %}Bitcoin{% endtrans %}</p>
|
||||
<h5 class="normal mb-0" id="kWh-btc"></h5>
|
||||
<p class="text-small black-90">{% trans %}kWh{% endtrans %}</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="d-output d-crypto active" data-comp="kWh" data-type="eth">
|
||||
<div class="viz-wrapper">
|
||||
<img src="./img/green/Portugal.png" class="mw-100">
|
||||
<div class="dot" id="kWh-eth-dot"></div>
|
||||
</div>
|
||||
<div class="num-wrapper">
|
||||
<img src="{{currentpage.prefix}}assets/img/icons/bw-ethereum.png" alt="ETH" class="mw-100 mt-3 invertible-img">
|
||||
<p class="h6 mt-2 mb-1">{% trans %}Ethereum{% endtrans %}</p>
|
||||
<h5 class="normal mb-0" id="kWh-eth"></h5>
|
||||
<p class="text-small black-90">{% trans %}kWh{% endtrans %}</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="d-output d-cash" data-comp="kWh" data-type="pap">
|
||||
<div class="viz-wrapper">
|
||||
<img src="./img/green/Portugal.png" class="mw-100">
|
||||
<div class="dot" id="kWh-pap-dot"></div>
|
||||
</div>
|
||||
<div class="num-wrapper">
|
||||
<img src="{{currentpage.prefix}}assets/img/icons/bw-cash.png" class="mw-100 mt-3 mb-2 invertible-img">
|
||||
<p class="h6 mt-2 mb-1">{% trans %}Cash{% endtrans %}</p>
|
||||
<h5 class="normal mb-0" id="kWh-pap"></h5>
|
||||
<p class="text-small black-90">{% trans %}kWh{% endtrans %}</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="d-output d-crypto d-credit d-cash active" data-comp="kWh" data-type="xrp">
|
||||
<div class="viz-wrapper">
|
||||
<img src="./img/green/Portugal.png" class="mw-100">
|
||||
<div class="dot" id="kWh-xrp-dot"></div>
|
||||
</div>
|
||||
<div class="num-wrapper">
|
||||
<img src="{{currentpage.prefix}}assets/img/icons/xrp.png" alt="XRP" class="mw-100 mt-3 invertible-img">
|
||||
<p class="h6 mt-2 mb-1">XRP</p>
|
||||
<h5 class="normal mb-0" id="kWh-xrp"></h5>
|
||||
<p class="text-small black-90">{% trans %}kWh{% endtrans %}</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="d-output d-credit" data-comp="kWh" data-type="vsa">
|
||||
<div class="viz-wrapper">
|
||||
<img src="./img/green/Portugal.png" alt="{% trans %}Portugal{% endtrans %}" class="mw-100">
|
||||
<div class="dot" id="kWh-vsa-dot"></div>
|
||||
</div>
|
||||
<div class="num-wrapper">
|
||||
<img src="{{currentpage.prefix}}assets/img/icons/bw-visa.png" alt="{% trans %}Visa{% endtrans %}" class="mw-100 mb-2 invertible-img" style="margin-top: 1.85rem;">
|
||||
<p class="h6 mt-2 mb-1">Visa</p>
|
||||
<h5 class="normal mb-0" id="kWh-vsa"></h5>
|
||||
<p class="text-small black-90">{% trans %}kWh{% endtrans %}</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="d-output d-credit" data-comp="kWh" data-type="mst">
|
||||
<div class="viz-wrapper">
|
||||
<img src="./img/green/Portugal.png" alt="{% trans %}Portugal{% endtrans %}" class="mw-100">
|
||||
<div class="dot" id="kWh-mst-dot"></div>
|
||||
</div>
|
||||
<div class="num-wrapper">
|
||||
<img src="{{currentpage.prefix}}assets/img/icons/bw-mastercard.png" alt="{% trans %}Mastercard{% endtrans %}" class="mw-100 mb-1 invertible-img" style="margin-top: 1.65rem;">
|
||||
<p class="h6 mt-2 mb-1">{% trans %}Mastercard{% endtrans %}</p>
|
||||
<h5 class="normal mb-0" id="kWh-mst"></h5>
|
||||
<p class="text-small black-90">{% trans %}kWh{% endtrans %}</p>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<section class="min-vh100 bb-gray mb-40 section2 clearfix">
|
||||
<h4 class="h5">{% trans %}CO<sub>2</sub> Emissions from Airline Flights{% endtrans %}</h4>
|
||||
|
||||
<p class="grey-400 text-small my-4">{% trans %}Comparing <span class="slider-amt"></span> Million Transactions in 2019{% endtrans %}</p>
|
||||
|
||||
<p class="calculator-section-description">{% trans %}A 12-hour flight from London to Hong Kong releases 3 tons of carbon dioxide (CO<sub>2</sub>). Discover how much CO<sub>2</sub> different forms of currency release in comparison to emissions from airline flights.{% endtrans %}</p>
|
||||
|
||||
<div class="mt-10" id="co2Animation"></div>
|
||||
|
||||
<ul class="d-sm-flex p-0">
|
||||
<li class="d-output d-crypto active" data-comp="tons" data-type="btc">
|
||||
<p class="h6 mt-3 mb-1">Bitcoin</p>
|
||||
<h5 class="normal mb-0" id="tons-btc"></h5>
|
||||
<p class="text-small black-90">{% trans %}metric tons of CO<sub>2</sub>{% endtrans %}</p>
|
||||
</li>
|
||||
<li class="d-output d-crypto active" data-comp="tons" data-type="eth">
|
||||
<p class="h6 mt-3 mb-1">Ethereum</p>
|
||||
<h5 class="normal mb-0" id="tons-eth"></h5>
|
||||
<p class="text-small black-90">{% trans %}metric tons of CO<sub>2</sub>{% endtrans %}</p>
|
||||
</li>
|
||||
<li class="d-output d-cash" data-comp="tons" data-type="pap">
|
||||
<p class="h6 mt-3 mb-1">Cash</p>
|
||||
<h5 class="normal mb-0" id="tons-pap"></h5>
|
||||
<p class="text-small black-90">{% trans %}metric tons of CO<sub>2</sub>{% endtrans %}</p>
|
||||
</li>
|
||||
<li class="d-output d-crypto d-credit d-cash active" data-comp="tons" data-type="xrp">
|
||||
<p class="h6 mt-3 mb-1">XRP</p>
|
||||
<h5 class="normal mb-0" id="tons-xrp"></h5>
|
||||
<p class="text-small black-90">{% trans %}metric tons of CO<sub>2</sub>{% endtrans %}</p>
|
||||
</li>
|
||||
<li class="d-output d-credit" data-comp="tons" data-type="vsa">
|
||||
<p class="h6 mt-3 mb-1">Visa</p>
|
||||
<h5 class="normal mb-0" id="tons-vsa"></h5>
|
||||
<p class="text-small black-90">{% trans %}metric tons of CO<sub>2</sub>{% endtrans %}</p>
|
||||
</li>
|
||||
<li class="d-output d-credit" data-comp="tons" data-type="mst">
|
||||
<p class="h6 mt-3 mb-1">Mastercard</p>
|
||||
<h5 class="normal mb-0" id="tons-mst"></h5>
|
||||
<p class="text-small black-90">{% trans %}metric tons of CO<sub>2</sub>{% endtrans %}</p>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</section>
|
||||
<section class="min-vh100 bb-gray section3 clearfix">
|
||||
<h4 class="h5">{% trans %}Gas Consumption by the Gallon{% endtrans %}</h4>
|
||||
|
||||
<p class="grey-400 text-small my-4">{% trans %}Comparing <span class="slider-amt"></span> Million Transactions in 2019{% endtrans %}</p>
|
||||
|
||||
<p class="calculator-section-description">{% trans %}An Ultra Large Crude Carrier (ULCC) carries approximately 120 million gallons of gas. Measure the environmental impact between currencies in relation to the amount of gas they would consume in the real-world.{% endtrans %}</p>
|
||||
|
||||
<div class="mt-10" id="gasAnimation"></div>
|
||||
|
||||
<ul class="d-sm-flex p-0">
|
||||
<li class="d-output d-crypto active" data-comp="gas" data-type="btc">
|
||||
<p class="h6 mt-3 mb-1">Bitcoin</p>
|
||||
<h5 class="normal mb-0" id="gas-btc"></h5>
|
||||
<p class="text-small black-90">{% trans %}Gallons of Gas{% endtrans %}</p>
|
||||
</li>
|
||||
<li class="d-output d-crypto active" data-comp="gas" data-type="eth">
|
||||
<p class="h6 mt-3 mb-1">Ethereum</p>
|
||||
<h5 class="normal mb-0" id="gas-eth"></h5>
|
||||
<p class="text-small black-90">{% trans %}Gallons of Gas{% endtrans %}</p>
|
||||
</li>
|
||||
<li class="d-output d-cash" data-comp="gas" data-type="pap">
|
||||
<p class="h6 mt-3 mb-1">Cash</p>
|
||||
<h5 class="normal mb-0" id="gas-pap"></h5>
|
||||
<p class="text-small black-90">{% trans %}Gallons of Gas{% endtrans %}</p>
|
||||
</li>
|
||||
<li class="d-output d-crypto d-credit d-cash active" data-comp="gas" data-type="xrp">
|
||||
<p class="h6 mt-3 mb-1">XRP</p>
|
||||
<h5 class="normal mb-0" id="gas-xrp"></h5>
|
||||
<p class="text-small black-90">{% trans %}Gallons of Gas{% endtrans %}</p>
|
||||
</li>
|
||||
<li class="d-output d-credit" data-comp="gas" data-type="vsa">
|
||||
<p class="h6 mt-3 mb-1">Visa</p>
|
||||
<h5 class="normal mb-0" id="gas-vsa"></h5>
|
||||
<p class="text-small black-90">{% trans %}Gallons of Gas{% endtrans %}</p>
|
||||
</li>
|
||||
<li class="d-output d-credit" data-comp="gas" data-type="mst">
|
||||
<p class="h6 mt-3 mb-1">Mastercard</p>
|
||||
<h5 class="normal mb-0" id="gas-mst"></h5>
|
||||
<p class="text-small black-90">{% trans %}Gallons of Gas{% endtrans %}</p>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div class="container-new py-26">
|
||||
<section class="row last-section">
|
||||
<div class="col-sm-8 col-sm-offset-4">
|
||||
<h3 class="h2-sm">{% trans %}Breaking Down Individual Transactions{% endtrans %}</h3>
|
||||
<p>{% trans %}Looking at individual transactions below, compare how a single transaction across each form of currency equates to kWh, CO<sub>2</sub> emissions, and gallons of gas.{% endtrans %}</p>
|
||||
</div>
|
||||
<div class="col-sm-12 mt-14 overflow-x-xs">
|
||||
<table id="calculator-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th class="text-right h6 mb-10">{% trans %}Kilowatt Hour{% endtrans %}</th>
|
||||
<th class="text-right h6 mb-10">{% trans %}CO<sub>2</sub> Emissions{% endtrans %}</th>
|
||||
<th class="text-right h6 mb-10">{% trans %}Gallons of Gas{% endtrans %}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class=""><div class="w48 mr-3 text-center d-md-inline-block"><img class="h36 invertible-img" src="./img/logos/bitcoin.svg"></div>Bitcoin</td>
|
||||
<td class="fs-6 text-right">951.58<span class="ratio"> kWh/tx</span></td>
|
||||
<td class="fs-6 text-right">4.66<sup>-7</sup><span class="ratio"> Mt/tx</span></td>
|
||||
<td class="fs-6 text-right">75.7<span class="ratio"> gal/tx</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class=""><div class="w48 mr-3 text-center d-md-inline-block"><img class="h36 invertible-img" src="./img/logos/ethereum.svg"></div>Ethereum</td>
|
||||
<td class="fs-6 text-right">42.8633<span class="ratio"> kWh/tx</span></td>
|
||||
<td class="fs-6 text-right">2.73<sup>-8</sup><span class="ratio"> Mt/tx</span></td>
|
||||
<td class="fs-6 text-right">2.3867<span class="ratio"> gal/tx</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class=""><div class="w48 mr-3 text-center d-md-inline-block"><img class="h36 invertible-img" src="./img/logos/xrp.svg"></div>XRP</td>
|
||||
<td class="fs-6 text-right">0.0079<span class="ratio"> kWh/tx</span></td>
|
||||
<td class="fs-6 text-right">4.5<sup>-12</sup><span class="ratio"> Mt/tx</span></td>
|
||||
<td class="fs-6 text-right">0.00063<span class="ratio"> gal/tx</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class=""><div class="w48 mr-3 text-center d-md-inline-block"><img class="w40 invertible-img" src="./img/logos/visa.svg"></div>Visa</td>
|
||||
<td class="fs-6 text-right">0.0008<span class="ratio"> kWh/tx</span></td>
|
||||
<td class="fs-6 text-right">4.6<sup>-13</sup><span class="ratio"> Mt/tx</span></td>
|
||||
<td class="fs-6 text-right">0.00006<span class="ratio"> gal/tx</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class=""><div class="w48 mr-3 text-center d-md-inline-block"><img class="w40 invertible-img" src="./img/logos/mastercard.svg"></div>Mastercard</td>
|
||||
<td class="fs-6 text-right">0.0006<span class="ratio"> kWh/tx</span></td>
|
||||
<td class="fs-6 text-right">5.1<sup>-13</sup><span class="ratio"> Mt/tx</span></td>
|
||||
<td class="fs-6 text-right">0.00005<span class="ratio"> gal/tx</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class=""><div class="w48 mr-3 text-center d-md-inline-block"><img class="w40 invertible-img" src="./img/logos/paper-currency.svg"></div>{% trans %}Paper Currency{% endtrans %}</td>
|
||||
<td class="fs-6 text-right">0.044<span class="dblue">0</span><span class="ratio"> kWh/tx</span></td>
|
||||
<td class="fs-6 text-right">2.32<sup>-11</sup><span class="ratio"> Mt/tx</span></td>
|
||||
<td class="fs-6 text-right">0.0035<span class="dblue">0</span><span class="ratio"> gal/tx</span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
|
||||
{% block endbody %}
|
||||
<script type="text/javascript" src="{{currentpage.prefix}}assets/js/bodymovin.min.js"></script>
|
||||
<script type="text/javascript" src="{{currentpage.prefix}}assets/js/calculator/co2-crypto.json"></script>
|
||||
<script type="text/javascript" src="{{currentpage.prefix}}assets/js/calculator/co2-cash.json"></script>
|
||||
<script type="text/javascript" src="{{currentpage.prefix}}assets/js/calculator/co2-credit.json"></script>
|
||||
<script type="text/javascript" src="{{currentpage.prefix}}assets/js/calculator/gas-crypto.json"></script>
|
||||
<script type="text/javascript" src="{{currentpage.prefix}}assets/js/calculator/gas-cash.json"></script>
|
||||
<script type="text/javascript" src="{{currentpage.prefix}}assets/js/calculator/gas-credit.json"></script>
|
||||
<script type="text/javascript" src="{{currentpage.prefix}}assets/js/calculator/carbon-calculator.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
function co2CashAnimation(){
|
||||
bodymovin.loadAnimation({
|
||||
container: document.getElementById('co2Animation'),
|
||||
renderer: 'svg',
|
||||
loop: false,
|
||||
autoplay: true,
|
||||
animationData: coCash
|
||||
});
|
||||
};
|
||||
function co2CreditAnimation() {
|
||||
bodymovin.loadAnimation({
|
||||
container: document.getElementById('co2Animation'),
|
||||
renderer: 'svg',
|
||||
loop: false,
|
||||
autoplay: true,
|
||||
animationData: coCredit
|
||||
});
|
||||
};
|
||||
function co2CryptoAnimation() {
|
||||
bodymovin.loadAnimation({
|
||||
container: document.getElementById('co2Animation'),
|
||||
renderer: 'svg',
|
||||
loop: false,
|
||||
autoplay: true,
|
||||
animationData: coCrypto
|
||||
});
|
||||
};
|
||||
function gasCryptoAnimation() {
|
||||
bodymovin.loadAnimation({
|
||||
container: document.getElementById('gasAnimation'),
|
||||
renderer: 'svg',
|
||||
loop: false,
|
||||
autoplay: true,
|
||||
animationData: gasCrypto
|
||||
});
|
||||
};
|
||||
function gasCashAnimation() {
|
||||
bodymovin.loadAnimation({
|
||||
container: document.getElementById('gasAnimation'),
|
||||
renderer: 'svg',
|
||||
loop: false,
|
||||
autoplay: true,
|
||||
animationData: gasCash
|
||||
});
|
||||
};
|
||||
function gasCreditAnimation() {
|
||||
bodymovin.loadAnimation({
|
||||
container: document.getElementById('gasAnimation'),
|
||||
renderer: 'svg',
|
||||
loop: false,
|
||||
autoplay: true,
|
||||
animationData: gasCredit
|
||||
});
|
||||
};
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
||||
|
||||
{% block analytics %}
|
||||
<script type="application/javascript">
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
window.dataLayer.push({
|
||||
"event": "page_info",
|
||||
"page_type": "Splash Page",
|
||||
"page_group": "About"
|
||||
})
|
||||
</script>
|
||||
{% endblock analytics %}
|
||||
@@ -57,7 +57,7 @@
|
||||
<p>{% trans %}In early 2011, three developers—David Schwartz, Jed McCaleb, and Arthur Britto—were fascinated with Bitcoin but observed the waste inherent in mining. They sought to create a more sustainable system for sending value (an idea outlined in a <a href="https://bitcointalk.org/index.php?topic=10193.0" target="_blank">May 2011 forum post: “Bitcoin without mining”</a>).{% endtrans %}</p>
|
||||
<a class="btn btn-primary read-more mt-10" href="#" data-target="section-1">Read More</a>
|
||||
<div class="hidden-section" id="section-1">
|
||||
<p>{% trans %}Their initial observations about the high energy consumption and scalability issues that would plague Bitcoin proved prescient. In 2019, estimates suggest Bitcoin mining used <a href="carbon-calculator.html">more energy than the entire country of Portugal</a>. Moreover, their initial read indicated that significant problems could arise if any miner obtained (or miners colluded to obtain) greater than 50% of the mining power. That risk persists with Bitcoin (and Ethereum) today as mining power has consolidated in China.{% endtrans %}</p>
|
||||
<p>{% trans %}Their initial observations about the high energy consumption and scalability issues that would plague Bitcoin proved prescient. In 2019, estimates suggest Bitcoin mining used more energy than the entire country of Portugal. Moreover, their initial read indicated that significant problems could arise if any miner obtained (or miners colluded to obtain) greater than 50% of the mining power. That risk persists with Bitcoin (and Ethereum) today as mining power has consolidated in China.{% endtrans %}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -106,9 +106,9 @@
|
||||
<div class="mt-10 p-10 br-8 cta-card position-relative">
|
||||
<img src="./img/backgrounds/cta-xrp-overview-magenta.svg" class="cta cta-bottom-right">
|
||||
<div class="z-index-1 position-relative">
|
||||
<h2 class="h4 mb-10-until-sm mb-8-sm">{% trans %}XRP was designed with sustainability 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" href="carbon-calculator.html">{% trans %}Green Currency Calculator{% endtrans %}</a>
|
||||
<h2 class="h4 mb-10-until-sm mb-8-sm">{% trans %}The XRP Ledger was designed with sustainability in mind.{% endtrans %}</h2>
|
||||
<p class="mb-10">{% trans %}Explore the impact of the world's first major, global, public carbon-neutral blockchain.{% endtrans %}</p>
|
||||
<a class="btn btn-primary btn-arrow" href="impact.html">{% trans %}Impact{% endtrans %}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -95,7 +95,7 @@
|
||||
<img src="./img/backgrounds/cta-xrpl-overview-green.svg" class="cta cta-bottom-right">
|
||||
<div class="z-index-1 position-relative">
|
||||
<h2 class="h4 mb-10-until-sm mb-8-sm">{% trans %}A Greener Blockchain{% endtrans %}</h2>
|
||||
<p class="mb-10">{% trans %}Unlike most other blockchains, the XRP Ledger does not need mining, so <a href="impact.html">no energy is wasted</a> in the transaction process. Learn how this compares to other platforms with our <a href="carbon-calculator.html">Green Currency Calculator</a>.{% endtrans %}</p>
|
||||
<p class="mb-10">{% trans %}Unlike most other blockchains, the XRP Ledger does not need mining, so <a href="impact.html">no energy is wasted</a> in the transaction process.{% endtrans %}</p>
|
||||
<a class="btn btn-primary btn-arrow" href="impact.html">Learn More</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -179,7 +179,7 @@
|
||||
{ "question": _("Isn’t 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 Ledger’s consensus mechanism solves the same problem in a far faster, cheaper and more energy efficient way.") },
|
||||
{ "question": _("How can a blockchain be sustainable?"),
|
||||
"answer": _("It’s been widely reported that Bitcoin’s 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>.") },
|
||||
"answer": _("It’s been widely reported that Bitcoin’s 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>.") },
|
||||
] %}
|
||||
{% for faq in faqs %}
|
||||
<div class="q-wrapper">
|
||||
|
||||
Reference in New Issue
Block a user