diff --git a/_data/get-dash.yml b/_data/get-dash.yml new file mode 100644 index 0000000..da7606d --- /dev/null +++ b/_data/get-dash.yml @@ -0,0 +1,237 @@ +- currencies: + usd: + - Wire Transfer + - SWIFT + - PerfectMoney + - OkPay + - SWIFT + - Capitalist + - Money Polo + - EPAY + - Payeer + - AdvCash + - NixMoney + - MoneyPolo + eur: + - Wire Transfer + - SEPA + - Bancontact + - Giropay + - iDEAL + - Mybank + - Sofort + - TrustPay + btc: + - Cryptocurrency + rur: + - QIWI + - AdvCash + - Payeer + - Capitalist + - Sberbank + - Tinkoff + - VTB24 + cny: + - ChinaUnionPay + cad: + - Flexepin + +- name: Kraken + using: traditional + methods: + - Wire Transfer + - SEPA + - SEPA + - SWIFT + - Wire Transfer + - Cryptocurrency + type: exchange + currency: + - USD + - EUR + - BTC + image: kraken_logo-small.png + url: http://kraken.com/ + +- name: Bitfinex + using: traditional + methods: + - USD + - Cryptocurrency + type: exchange + currency: + - USD + - EUR + - BTC + image: bitfinex_logo-small.png + url: https://www.bitfinex.com/ + +- name: Poloniex + using: traditional + methods: + - Cryptocurrency + type: exchange + currency: + - BTC + image: poloniex_logo-small.png + url: https://poloniex.com/ + +- name: Bithumb + using: traditional + methods: + - Cryptocurrency + type: exchange + currency: + - BTC + image: bithumb_logo-small.png + url: https://www.bithumb.com/ + +- name: Livecoin + using: traditional + methods: + - Payeer + - PerfectMoney + - OkPay + - SWIFT + - Capitalist + - Cryptocurrency + type: exchange + currency: + - BTC + - USD + image: livecoin_logo-small.png + url: https://www.livecoin.net/ + +- name: Bittrex + using: traditional + methods: + - Cryptocurrency + type: exchange + currency: + - BTC + image: bittrex_logo-small.png + url: https://bittrex.com/ + +- name: Exmo + using: traditional + methods: + - Money Polo + - Capitalist + - Perfect Money + - EPAY + - OKPAY + type: exchange + currency: + - BTC + - USD + image: exmo_logo-small.png + url: https://exmo.com/ + +- name: Hitbtc + using: traditional + methods: + - Cryptocurrency + type: exchange + currency: + - BTC + image: hitbtc_logo-small.png + url: https://hitbtc.com/ + +- name: Yobit + using: traditional + methods: + - OKPay + - Payeer + - AdvCash + - PerfectMoney + - Capitalist + type: exchange + currency: + - USD + - RUR + - BTC + image: yobit_logo-small.png + url: https://yobit.net/ + +- name: C-cex + using: traditional + methods: + - Payeer + - Perfect Money + - OKPAY + - NixMoney + - Sberbank + - Wire Transfer + - MoneyPolo + - Cryptocurrency + type: exchange + currency: + - USD + - BTC + image: ccx_logo-small.png + url: https://c-cex.com/ + +- name: ANYCOIN DIRECT + using: traditional + methods: + - Bancontact + - Giropay + - iDEAL + - Mybank + - SEPA + - Sofort + - TrustPay + type: exchange + currency: + - EUR + image: anycoin_logo-small.png + url: https://anycoindirect.eu/ + +- name: ALFACASHIER + using: traditional + methods: + - Cryptocurrency + - Perfect Money + - OkPay + - MoneyPolo + - SWIFT + - SEPA + - Online Bank Transfer + - ChinaUnionPay + - Flexepin + - Tinkoff + - VTB24 + type: exchange + currency: + - USD + - EUR + - BTC + - CNY + - CAD + - RUR + image: alpha_logo-small.png + url: https://www.alfacashier.com/ + +- name: BITPANDA + using: traditional + methods: + - Cryptocurrency + type: exchange + currency: + - BTC + image: bitpanda_logo-small.png + url: https://www.bitpanda.com/ + +- name: LITEBIT.EU + using: traditional + methods: + - iDeal + - SEPA + - Sofort + - GiroPay + - Bancontact + type: exchange + currency: + - EUR + image: litebit-eu_logo-small.jpg + url: https://www.litebit.eu/ diff --git a/_i18n/en.yml b/_i18n/en.yml index 8488d41..6cc18b2 100644 --- a/_i18n/en.yml +++ b/_i18n/en.yml @@ -761,20 +761,37 @@ pages: title: Get Dash description: Download the wallet and get Dash at an exchange. hero-image: get-dash-n.jpg - hero-heading: Download Dash Wallet - hero-text: Download the latest Dash client to get started + hero-heading: Get Dash + hero-heading-text: | + Buy and Sell Dash every time, when you want. + Dash can be acquired, held and exchanged in many ways + hero-text: | + First time here? Read Dash guide for new users hero-wallet-version: Dash Wallet (Fullclient v12.0.56) for OSX hero-wallet-version-select: Choose Another hero-platform-not-detected: "We're sorry, but your platform could not be automatically detected. Please select \"All Wallets\" to find a compatible version." hero-download-btn: Download hero-all-wallets-btn: All Wallets + download-title: Download wallet + download-text: Your wallet is the software you use to send, receive and store Dash. It’s simple to use and you can choose to send payments anonymously from your wallet using PrivateSend + all-wallets-btn: All wallets + buy-dash-title: Buy Dash + buy-dash-info-text: Select your preferences and we will offer you the best way to buy Dash + dash-select-label: I want to buy with + show-more-btn: Show More + service-type: Service Type + exchange-rate: Exchange Rate + payments-method: Payments Method + tooltip: Tooltip + buy-dash-table: Buy Dash + guide-btn: Setup Guide buy-btn: Buy Dash spend-btn: Spend Dash trade-btn: Trade Dash - - otc-heading: Over the Counter (OTC) + security-btn: Security + otc-heading: Over
the Counter (OTC) otc-text: | Buying or selling large amounts of Dash on exchanges can cause price slippage, resulting in the buyer or seller receiving less value than intended. Large buy orders push the price higher, resulting in overpayment. Sizeable sell orders do the opposite, resulting in less value received for the Dash you sell. Fortunately there are “over the counter” or OTC solutions, where a vendor pairs buyers and sellers, allowing them to conduct large transactions off the exchanges and free from slippage.t things like a new website, pr budget, etc. The benefit to you is, you can get many more coins at the current price, than what are available on any exchange. So you can get into a Dash position much easier/cheaper than would otherwise be possible. otc-btn: Full List diff --git a/_includes/get-dash.html b/_includes/get-dash.html new file mode 100644 index 0000000..0a515d8 --- /dev/null +++ b/_includes/get-dash.html @@ -0,0 +1,46 @@ + 6 %} + style="display:none;" + {% endif %} +> + +
+ +
+
+
{{ exchange.name }}
+ More Information +
+ + + + Click to get price + + + {% for method in exchange.methods %} +
{{ method }}
+ {% endfor %} + + + + Buy + Dash + + + \ No newline at end of file diff --git a/_includes/hero/get-dash.html b/_includes/hero/get-dash.html index e8244ad..493da35 100644 --- a/_includes/hero/get-dash.html +++ b/_includes/hero/get-dash.html @@ -1,7 +1,7 @@
{% capture heroimage %}hero/{% t pages.get-dash.hero-image %}{% endcapture %} - {% srcset hero/get-dash-n.jpg ppi:1,2 class="hero__background-image" %} + {% srcset hero/get-dash.jpg ppi:1,2 class="hero__background-image" %} {% srcset_source width:1920 %} {% srcset_source width:960 %} {% endsrcset %} @@ -17,15 +17,15 @@

{% t pages.get-dash.hero-text %}

-

{% t pages.get-dash.hero-platform-not-detected %}

-
- - {% t pages.get-dash.hero-all-wallets-btn %} + {% t pages.get-dash.hero-download-btn %} + {% t pages.get-dash.buy-btn %} + {% t pages.get-dash.security-btn %}
+

{% t pages.get-dash.hero-text %}

-
+
diff --git a/_includes/nav-desktop.html b/_includes/nav-desktop.html index 7930fd3..75d1431 100644 --- a/_includes/nav-desktop.html +++ b/_includes/nav-desktop.html @@ -17,12 +17,12 @@ diff --git a/assets/img/exchanges/hitbtc_logo.png b/assets/img/exchanges/hitbtc_logo.png new file mode 100644 index 0000000..3d4831c Binary files /dev/null and b/assets/img/exchanges/hitbtc_logo.png differ diff --git a/assets/img/get-dash/alfacashier_logo.png b/assets/img/get-dash/alfacashier_logo.png new file mode 100644 index 0000000..8035ee4 Binary files /dev/null and b/assets/img/get-dash/alfacashier_logo.png differ diff --git a/assets/img/get-dash/alpha_logo-small.png b/assets/img/get-dash/alpha_logo-small.png new file mode 100644 index 0000000..c42c3f6 Binary files /dev/null and b/assets/img/get-dash/alpha_logo-small.png differ diff --git a/assets/img/get-dash/anycoin_logo-small.png b/assets/img/get-dash/anycoin_logo-small.png new file mode 100644 index 0000000..9fd7ee4 Binary files /dev/null and b/assets/img/get-dash/anycoin_logo-small.png differ diff --git a/assets/img/get-dash/anycoin_logo.png b/assets/img/get-dash/anycoin_logo.png new file mode 100644 index 0000000..83c1bd2 Binary files /dev/null and b/assets/img/get-dash/anycoin_logo.png differ diff --git a/assets/img/get-dash/bitfinex_logo-small.png b/assets/img/get-dash/bitfinex_logo-small.png new file mode 100644 index 0000000..bdd0934 Binary files /dev/null and b/assets/img/get-dash/bitfinex_logo-small.png differ diff --git a/assets/img/get-dash/bithumb_logo-small.png b/assets/img/get-dash/bithumb_logo-small.png new file mode 100644 index 0000000..eb15dff Binary files /dev/null and b/assets/img/get-dash/bithumb_logo-small.png differ diff --git a/assets/img/get-dash/bitpanda_logo-small.png b/assets/img/get-dash/bitpanda_logo-small.png new file mode 100644 index 0000000..71a3501 Binary files /dev/null and b/assets/img/get-dash/bitpanda_logo-small.png differ diff --git a/assets/img/get-dash/bittrex_logo-small.png b/assets/img/get-dash/bittrex_logo-small.png new file mode 100644 index 0000000..83abbbd Binary files /dev/null and b/assets/img/get-dash/bittrex_logo-small.png differ diff --git a/assets/img/get-dash/c-cex_logo.png b/assets/img/get-dash/c-cex_logo.png new file mode 100644 index 0000000..8434ebb Binary files /dev/null and b/assets/img/get-dash/c-cex_logo.png differ diff --git a/assets/img/get-dash/ccx_logo-small.png b/assets/img/get-dash/ccx_logo-small.png new file mode 100644 index 0000000..64313f1 Binary files /dev/null and b/assets/img/get-dash/ccx_logo-small.png differ diff --git a/assets/img/get-dash/exmo_logo-small.png b/assets/img/get-dash/exmo_logo-small.png new file mode 100644 index 0000000..44ca631 Binary files /dev/null and b/assets/img/get-dash/exmo_logo-small.png differ diff --git a/assets/img/get-dash/exmo_logo.png b/assets/img/get-dash/exmo_logo.png new file mode 100644 index 0000000..0518cb4 Binary files /dev/null and b/assets/img/get-dash/exmo_logo.png differ diff --git a/assets/img/get-dash/hitbtc_logo-small.png b/assets/img/get-dash/hitbtc_logo-small.png new file mode 100644 index 0000000..e981a53 Binary files /dev/null and b/assets/img/get-dash/hitbtc_logo-small.png differ diff --git a/assets/img/get-dash/hitbtc_logo.png b/assets/img/get-dash/hitbtc_logo.png new file mode 100644 index 0000000..3d4831c Binary files /dev/null and b/assets/img/get-dash/hitbtc_logo.png differ diff --git a/assets/img/get-dash/kraken_logo-small.png b/assets/img/get-dash/kraken_logo-small.png new file mode 100644 index 0000000..46d602d Binary files /dev/null and b/assets/img/get-dash/kraken_logo-small.png differ diff --git a/assets/img/get-dash/litebit-eu_logo-small.jpg b/assets/img/get-dash/litebit-eu_logo-small.jpg new file mode 100644 index 0000000..2321aa2 Binary files /dev/null and b/assets/img/get-dash/litebit-eu_logo-small.jpg differ diff --git a/assets/img/get-dash/litebit-eu_logo.png b/assets/img/get-dash/litebit-eu_logo.png new file mode 100644 index 0000000..6f2820e Binary files /dev/null and b/assets/img/get-dash/litebit-eu_logo.png differ diff --git a/assets/img/get-dash/livecoin_logo-small.png b/assets/img/get-dash/livecoin_logo-small.png new file mode 100644 index 0000000..1a4e405 Binary files /dev/null and b/assets/img/get-dash/livecoin_logo-small.png differ diff --git a/assets/img/get-dash/livecoin_logo.png b/assets/img/get-dash/livecoin_logo.png new file mode 100644 index 0000000..76dd524 Binary files /dev/null and b/assets/img/get-dash/livecoin_logo.png differ diff --git a/assets/img/get-dash/poloniex_logo-small.png b/assets/img/get-dash/poloniex_logo-small.png new file mode 100644 index 0000000..14f1bd4 Binary files /dev/null and b/assets/img/get-dash/poloniex_logo-small.png differ diff --git a/assets/img/get-dash/yobit_logo-small.png b/assets/img/get-dash/yobit_logo-small.png new file mode 100644 index 0000000..91aeb28 Binary files /dev/null and b/assets/img/get-dash/yobit_logo-small.png differ diff --git a/assets/img/get-dash/yobit_logo.png b/assets/img/get-dash/yobit_logo.png new file mode 100644 index 0000000..054cd5e Binary files /dev/null and b/assets/img/get-dash/yobit_logo.png differ diff --git a/assets/img/hero/get-dash.jpg b/assets/img/hero/get-dash.jpg new file mode 100644 index 0000000..b26a9cb Binary files /dev/null and b/assets/img/hero/get-dash.jpg differ diff --git a/evolution/index.html b/evolution/index.html index 9e5728a..26ff5d9 100644 --- a/evolution/index.html +++ b/evolution/index.html @@ -18,7 +18,6 @@ description: pages.evolution.description

{% t pages.evolution.video-heading %}

{% tmd pages.evolution.video-text %}
-
{% t pages.evolution.video-btn %} diff --git a/get-dash/index.html b/get-dash/index.html index 7a84579..2277a8e 100644 --- a/get-dash/index.html +++ b/get-dash/index.html @@ -7,25 +7,171 @@ description: pages.get-dash.description {% include hero/get-dash.html %} {% include wallets_js_data.html %} -
+{% assign currencies = site.data.get-dash | map: "currency" | join: ',' | split: ',' | uniq %} +{% assign currencies_total = site.data.get-dash | where_exp: "item", "item.name == nil" %} +{% assign exchanges = site.data.get-dash | where_exp: "item", "item.name != nil" %} -
+{% assign methods = methods | join: ',' | split: ',' %} +{% for cur in currencies_total %} + {% for i in cur['currencies'] %} + {% for x in i[1] %} + {% assign methods = methods | push: x %} + {% endfor %} + {% endfor %} +{% endfor %} +{% assign methods = methods | uniq %} + +
+
-
- Dash-Pile - - -
-

{% t pages.get-dash.claim-heading %}

-

{% t pages.get-dash.claim-subline %}

-
- {% t pages.get-dash.buy-btn %} - {% t pages.get-dash.spend-btn %} - {% t pages.get-dash.trade-btn %} +
1
+

{% t pages.get-dash.download-title %}

+
{% t pages.get-dash.download-text %}
+
+
+
+
+
+ +
+
+

Dash Core Win/64 Installer

+
Desktop Wallet
+
+ Official Dash Core fully featured Wallet and P2P Client, including InstantSend, PrivateSend, Governance and Masternode management features +
+
+
+
+ Download +
+
+
+
+
+ +
+
+
+
+ +
+
+

Dash Wallet
by Hash Engineering

+
Android wallet
+
+ Official Dash Core fully featured Wallet and P2P Client, including InstantSend, PrivateSend, Governance and Masternode management features +
+
+
+ +
+ Download +
+ +
+
+
+
+ +
+
+
+
+ +
+
+

Jaxx

+
Desktop Wallet
+
+ All keys are created on your local device and never sent to any servers. This means you have full control of your wallet and Jaxx neither holds nor has access to your funds. + +
+
+
+ +
+ Downloads +
+ +
+
+
+
+ {% t pages.get-dash.all-wallets-btn %}
- +
+
+
2
+

{% t pages.get-dash.buy-dash-table %}

+
{% t pages.get-dash.dash-select-label%}
+
+
+ + +
+
+ + +
+
+ + + + + + + + + + + {% for exchange in exchanges %} + {% include get-dash.html %} + {% endfor %} + + + + +
+ + + + {% t pages.get-dash.exchange-rate %} + + ? + {% t pages.get-dash.tooltip %} + + {% t pages.get-dash.payments-method %}{% t pages.get-dash.buy-dash-table %}
+
{% t pages.get-dash.show-more-btn %}
+
+
+ +
@@ -128,10 +274,16 @@ description: pages.get-dash.description
-
-

{% t pages.get-dash.otc-heading %}

+
-
+
+

{% t pages.get-dash.otc-heading %}

+ {% tmd pages.get-dash.otc-text %} +
+ {% t pages.get-dash.otc-btn %} +
+
+
@@ -142,14 +294,6 @@ description: pages.get-dash.description
-
-
- {% tmd pages.get-dash.otc-text %} -
- {% t pages.get-dash.otc-btn %} -
-
-
@@ -165,8 +309,9 @@ description: pages.get-dash.description
-
+
+

Use Dash everywhere

diff --git a/src/js/get-dash.js b/src/js/get-dash.js index d26b171..0b495f6 100644 --- a/src/js/get-dash.js +++ b/src/js/get-dash.js @@ -19,6 +19,9 @@ if (typeof(walletsCollectionByOs) !== 'undefined' && walletsCollectionByOs) { initDownloadButton(); } + if ($('[data-wallet]').length) { + initTileWallet(); + } }); function getBestWalletMatch() { @@ -72,7 +75,6 @@ detectedWallet = _.find(_walletsCollection,{ os: _walletOs, vendor_id: _vendor, type: _type}); } - console.info('detectedWallet: ' , detectedWallet, { os: _walletOs, vendor_id: _vendor, type: _type}); return detectedWallet; } @@ -90,7 +92,7 @@ _notDetectedMessage = $('#platform-not-detected'), _platform = platform ; - + console.log(_detectedWallet); if (_downloadButton && _downloadButton.length > 0) { if (_detectedWallet && _platform) { _downloadButton.html(_detectedWallet.name) @@ -110,4 +112,15 @@ return _downloadButton; } + function initTileWallet() { + var _tile = $('[data-wallet="auto-detect"]'), + _wallet = getBestWalletMatch(); + + _tile.find('[data-wallet="os"]').html(_wallet.name); + _tile.find('[data-wallet="img"]').attr('src', _wallet.logo_url); + _tile.find('[data-wallet="version"]').html(_wallet.type + ' Wallet'); + _tile.find('[data-wallet="text"]').html(_wallet.description); + _tile.find('[data-wallet="link"]').attr('href', _wallet.links[0].url); + } + }(jQuery)); diff --git a/src/js/tables.js b/src/js/tables.js index 512de06..2ebb656 100644 --- a/src/js/tables.js +++ b/src/js/tables.js @@ -3,7 +3,93 @@ $(document).ready(function () { var siteApi = window.globals.siteApi || '/api/v1', - marketCapApi = 'https://www.coincap.io/front/'; + marketCapApi = 'https://www.coincap.io/front/', + resultExchanges, + exchangesApi = siteApi + '/exchange'; + + if ($('#getDashTable').length) { + $.ajax({ + url: exchangesApi, + error: function(jqXHR, textStatus, errorThrown) { + console.log(jqXHR); + console.log(textStatus); + console.log('errorThrown:', errorThrown); + } + }).done(function(json) { + resultExchanges = json; + $('[data-name]').each(function() { + var that = $(this), + exchangeName = that.data('name'), + resultName = resultExchanges.filter(function(el) { + return el.exchange === exchangeName; + }), + $result = that.find('[data-price="result"]'); + + if (resultName[0] && resultName[0].price !== 'undefined') { + that.find('[data-price="click"]').addClass('hidden'); + $result.removeClass('hidden').find('[data-rate="rate"]').text(formatCurrency(resultName[0].price)); + if (resultName[0].volume) { + $result.find('[data-rate="volume"]').text(formatCurrency(resultName[0].volume)); + } else { + $result.find('.js-dash-table-volume').addClass('hidden'); + } + } + }); + }); + + var getRows = function() { + var $typeClass = $('#type').val() === 'all' ? '' : '.js-type-' + $('#type').val(), + $methodClass = $('#method').val() === 'all' ? '' : '.js-' + $('#method').val(), + $currencyClass = $('#currency').val() === 'all' ? '' : '.js-' + $('#currency').val(), + $resultClass = $typeClass + $methodClass + $currencyClass; + + return $resultClass; + }, + showMethod = function(selectedMethod) { + $('#method option').hide(); + $('#method').find('option').filter(function() { + if ($(this).data('method') !== 'undefined') { + var method = $(this).data('method'); + + return selectedMethod.indexOf(method) !== -1; + } + }).show(); + }; + + $('select').on('change', function() { + var $resultRow = getRows(); + + $('.js-exchange-row').hide(); + if (!$resultRow) { + $('.js-exchange-row:hidden').slice(0, 6).show(); + $('[data-btn="show-more"]').removeClass('hidden'); + } else { + $($resultRow).slice(0, 6).show(); + } + }); + $('select#currency').on('change', function() { + if ($(this).val() === 'all') { + $('#method option').show(); + } else { + var methods = $(this).find(':selected').data('method') + 'all'.split(' ').filter(String); + + showMethod(methods); + } + }); + + $('[data-btn="show-more"]').on('click', function() { + var $resultRow = getRows(); + + if (!$resultRow) { + $('.js-exchange-row:hidden').slice(0, 6).show(); + } else { + $($resultRow + ':hidden').slice(0, 6).show(); + } + if (!$('.js-exchange-row:hidden').length || !$($resultRow + ':hidden').length) { + $(this).addClass('hidden'); + } + }); + } if ($('#marketcap_count').length) { @@ -46,7 +132,7 @@ // Get the exchange data $.ajax({ - url: siteApi + '/exchange/', + url: exchangesApi, error: function(jqXHR, textStatus, errorThrown) { console.log(jqXHR); console.log(textStatus); @@ -57,7 +143,7 @@ var exchanges = response; exchanges.map(function(exchange) { - if (exchange) { + if (exchange && exchange.volume && exchange.price && exchange.percent_change) { console.log('exchange',exchange); var name = exchange.exchange, url = exchange.url, diff --git a/src/scss/_buttons.scss b/src/scss/_buttons.scss index faad0d9..4d2b8eb 100644 --- a/src/scss/_buttons.scss +++ b/src/scss/_buttons.scss @@ -86,5 +86,6 @@ box-shadow: none; background-color: transparent; color: $color-black !important; - border: 1px solid #b5b5b5 + border: 1px solid #b5b5b5; + font-size: 18px; } diff --git a/src/scss/_get-dash.scss b/src/scss/_get-dash.scss new file mode 100644 index 0000000..0957985 --- /dev/null +++ b/src/scss/_get-dash.scss @@ -0,0 +1,326 @@ +$get-wallet-tile-min-height: 20em; +$get-wallet-tile-max-width: 21em; +$get-wallet-tile-logo-container-height: 5.5em; +$get-wallet-tile-logo-container-width: 5.5em; +$get-wallet-tile-spacing: .7em; +$get-wallet-tile-caption-fine-print-font-size: 0.7em; +$get-wallet-tile-caption-fine-print-height: $get-wallet-tile-caption-fine-print-font-size*20.9; +$get-wallet-tile-hover-background-base-color: lighten($color-blue-light, 9); +.get-wallet-tile { + background: #fff; + animation: fadein 0.4s; + cursor: pointer; + text-align: center; + margin: $get-wallet-tile-spacing*2 auto 50px; + border: 1px solid $color-gray; + border-radius: 4px; + min-height: $get-wallet-tile-min-height; + .version-text { + text-transform: uppercase; + font-size: 0.75em; + color: #5e5e5e; + margin-bottom: 40px; + } + .payments & { + min-height: 12em; + } + max-width: $get-wallet-tile-max-width; + overflow: hidden; + transition: .25s; + &:hover, + &:focus { + border-color: $color-blue; + a { + color: darken($color-blue, 15); + } + & .thumbnail .caption .fine-print { + color: darken($color-gray-dark, 15); + } + & .thumbnail .wallet-links-container .link { + border-top: solid 1px darken($color-gray, 15); + } + } + & .thumbnail { + & .logo-container { + margin: $get-wallet-tile-spacing*3 auto; + padding: 0; + display: block; + max-width: $get-wallet-tile-logo-container-width; + max-height: $get-wallet-tile-logo-container-height; + overflow: hidden; + img { + max-height: 55px; + } + } + & .caption { + line-height: 1 !important; + margin: $get-wallet-tile-spacing; + h4 { + font-size: $font-size-medium; + padding: 0 0 $get-wallet-tile-spacing 0; + } + & .fine-print { + overflow-y: auto; + min-height: $get-wallet-tile-caption-fine-print-height; + max-height: $get-wallet-tile-caption-fine-print-height*2; + margin: 0 0 $get-wallet-tile-spacing 0; + font-size: $get-wallet-tile-caption-fine-print-font-size; + line-height: 1.5 !important; + color: $color-gray-dark; + } + } + & .wallet-links-container { + width: 100%; + & .link { + border-top: solid 1px $color-gray; + margin: 0 auto; + width: 90%; + display: block; + transition: 1.25s; + & a { + display: inline-block; + margin-top: 1.4em; + margin-bottom: 1.9em; + padding: $get-wallet-tile-spacing*.63 $get-wallet-tile-spacing*1.9; + height: 100%; + transition: .5s; + border: 1px solid $color-blue; + border-radius: 4px; + color: $color-blue; + &:hover, + &:focus { + background-color: $color-blue; + border-color: $color-blue; + color: $color-white; + } + } + } + } + } +} + +select.get-dash-select { + text-transform: uppercase; + border-radius: 4px; + outline: none; + padding: 5px 55px 5px 20px; + font-size: 16px; + border: 1px solid $color-gray; + height: 43px; + color: $color-black; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: transparent; + background-image: url("data:image/svg+xml;utf8,"); + background-repeat: no-repeat; + background-position-x: 96%; + background-position-y: 9px; +} + +select.get-dash-select::-ms-expand { + display: none; +} + +.get-dash-select-label{ + margin-right: 10px; + color: #858585; + font-weight: $font-weight-light; +} + +.get-dash-info-text{ + color: #5e5e5e; + font-size: 1.2em; + max-width: 768px; + text-align: center; + margin: 0 auto 50px; + font-weight: $font-weight-light; +} +.get-dash{ + &__select-section{ + display: inline-block; + margin-right: 23px; + } + +} + +.get-dash-table { + text-align: left; + border-collapse: inherit; + border-collapse: collapse; + border-radius: 4px; + overflow: hidden; + border-style: hidden; /* hide standard table (collapsed) border */ + box-shadow: 0 0 0 1px $color-gray; /* this draws the table border */ + margin-top: 50px; + td { + border: 1px solid $color-gray; + padding-left: 20px; + vertical-align: top; + } + th { + padding-left: 20px; + font-weight: normal; + color: #858585; + font-size: 16px; + border: 1px solid $color-gray; + font-weight: $font-weight-light; + } + &__price-cell{ + @at-root { + td#{&} { + vertical-align: text-top; + } + } + } + &__popup { + display: inline-block; + border-radius: 50%; + background: #d1d1d1; + color: $color-white; + width: 19px; + height: 19px; + line-height: 19px; + text-align: center; + cursor: pointer; + margin-left: 5px; + } + &__exchange { + margin-left: 0.7em; + float: left; + } + &__exchange-name { + font-size: 2em; + } + &__exchange-link{ + cursor: pointer; + text-decoration: underline; + margin-top: 2px; + } + &__rates { + text-align: left; + font-size: 2em; + font-weight: $font-weight-light; + } + &__volume { + text-align: left; + font-size: 0.75em; + color: $color-black; + } + &__volume-summ{ + color: #666666; + } + &__volume-time{ + color: #9f9f9f; + } + &__show { + display: block; + width: 100%; + text-align: center; + padding-top: 10px; + padding-bottom: 10px; + font-size: 1.2em; + color: $color-black; + cursor: pointer; + &:visited, &:hover{ + color: $color-black; + } + } + &__currency{ + font-size: 0.5em; + vertical-align: super; + } + &__method{ + color: $color-black; + font-weight: $font-weight-light; + } + &__img-container { + float: left; + width: 85px; + margin-left: 31px; + img { + max-width: 55px; + } + } +} +.buy-dash-btn { + display: inline-block; + border-radius: 4px; + border: 1px solid #b6b6b6; + color: #131415; + transition: all .3s; + padding-left: 20px; + padding-right: 33px; + line-height: 1; + padding-top: 11px; + font-size: 13px; + padding-bottom: 11px; + cursor: pointer; + font-weight: 700; + &:visited { + color: $color-black; + } + &__dash { + font-size: 2em; + line-height: 1; + text-transform: uppercase; + color: $color-blue; + font-family: $font-family-brand; + font-weight: $font-weight-bold; + transition: all .3s; + margin-left: 10px; + } + &:hover{ + background: $color-blue; + color: $color-white; + border: 1px solid transparent; + .buy-dash-btn__dash { + color: $color-white; + } + } +} +span.tooltips { + position: relative; +} +span.tooltips span { + position: absolute; + width:140px; + color: #FFFFFF; + background: #000000; + height: 30px; + line-height: 30px; + text-align: center; + visibility: hidden; + border-radius: 6px; +} +span.tooltips span:after { + content: ''; + position: absolute; + bottom: 100%; + left: 50%; + margin-left: -4px; + width: 0; height: 0; + border-bottom: 8px solid #000000; + border-right: 8px solid transparent; + border-left: 8px solid transparent; +} +span:hover.tooltips span { + visibility: visible; + opacity: 0.8; + top: 30px; + left: 50%; + margin-left: -76px; + z-index: 999; +} + +.page--get-dash { + .section__title { + font-weight: 400; + } +} +.get-dash-price-req { + color: #1076bc; + font-size: 19.5px; + font-weight: 400; + line-height: 1.2; +} diff --git a/src/scss/_hero.scss b/src/scss/_hero.scss index fe02daa..9bbcdaf 100644 --- a/src/scss/_hero.scss +++ b/src/scss/_hero.scss @@ -61,7 +61,7 @@ &__buttons { margin-bottom: 20px; /*optical*/ &--get-dash { - margin-bottom: 0; + margin-top: 34px; } } diff --git a/src/scss/_junk-drawer.scss b/src/scss/_junk-drawer.scss index 4bc2f08..7e0b0c6 100644 --- a/src/scss/_junk-drawer.scss +++ b/src/scss/_junk-drawer.scss @@ -30,7 +30,9 @@ you're in a hurry or lost or you just need to Make It Work© text-align: left; } - +.no-padding{ + padding: 0; +} $wallet-tile-min-height: 20em; $wallet-tile-max-width: 25em; @@ -547,4 +549,17 @@ a.blog_link { vertical-align: super; font-size: smaller; } -} \ No newline at end of file +} +.page.page--get-dash section{ + text-align: center; + &:nth-child(2n+1) { + background-color: $color-gray-light; + } + &:nth-child(2n) { + background-color: $color-white; + } + .info-grid { + text-align: left; + } +} + diff --git a/src/scss/_section.scss b/src/scss/_section.scss index 22d940f..14d98e4 100644 --- a/src/scss/_section.scss +++ b/src/scss/_section.scss @@ -10,6 +10,18 @@ $m: 'section'; padding: 0 20px; margin: 0 auto; } + &__number{ + display: inline-block; + border: 1px solid #1c75bc; + border-radius: 50%; + color: #1c75bc; + line-height: 56px; + font-weight: 500; + width: 56px; + height: 56px; + margin-bottom: 3%; + margin-top: 73px; + } &__title{ @include font-title-xlarge(); margin-bottom: 10px; diff --git a/src/scss/main.scss b/src/scss/main.scss index 84a02d2..98e769e 100644 --- a/src/scss/main.scss +++ b/src/scss/main.scss @@ -52,3 +52,4 @@ @import "pages/currency"; @import "social_icons"; @import "school"; +@import "get-dash";