new design for choose your wallet page

Makefile

@@ -296,7 +296,7 @@ check-for-consistent-bitcoin-core-titles:
 	$S grep -r -L '^title:.*Bitcoin Core' en/bitcoin-core/ | eval $(ERROR_ON_OUTPUT)
 
 check-for-too-many-wallets-on-one-platform:
-	$S for platform in desktop windows mac linux mobile android ios blackberry windowsphone web hardware \
+	$S for platform in desktop windows mac linux mobile android ios windowsphone web hardware \
 	   ; do count=$$( grep -c "compat:.*$$platform" _templates/choose-your-wallet.html ) \
 	   ; if [ $$count -gt 14 ] \
 	   ; then echo "ERROR: too many wallets in $$platform platform.  Remove one or change layout" \

_includes/layout/base/pagetop-donation.html

@@ -22,10 +22,7 @@ http://opensource.org/licenses/MIT.
   </button>
 </div>
 
-<div
-  id="donation-modal"
-  style="display: none"
-  class="donation-modal hidden">
+<div id="donation-modal" style="display: none" class="donation-modal hidden">
   <div class="modal-dialog">
     <div class="modal-header">
       <div class="modal-close-btn" onclick="closeDonationModal()">×</div>

_includes/layout/base/wallets-list.html

@@ -20,18 +20,39 @@ http://opensource.org/licenses/MIT.
   </div>
   <div class="accordion-content accordion-content-wallets">
     <div class="wallet-list" id="wallets">
-      {% for wallet in site.wallets %} {% assign platform = page.platform['name'] %} {% assign os = page.os['name'] %} {% if wallet.compat
-      contains platform and wallet.compat contains os %}
-      <div class="wallet-list-item" data-walletlevel="{{ wallet.level }}">
-        {% if platform == os %}
-        <a class="wallet-list-item-link" href="/{{ page.lang}}/wallets/{{ platform }}/{{ wallet.id }}/">
-          {% else %}
-          <a class="wallet-list-item-link" href="/{{ page.lang}}/wallets/{{ platform }}/{{ os }}/{{ wallet.id }}/">
-            {% endif %}
-            <img src="/img/wallet/{{ wallet.id }}.png" alt="{{ wallet.title }}" /> {{ wallet.titleshort }}
-          </a>
-      </div>
-      {% endif %} {% endfor %}
+      {% if page.id == "choose-your-wallet" %} 
+        {% for wallet in site.wallets %}
+          <div class="wallet-list-item" data-walletlevel="{{ wallet.level }}">
+            <div class="wallet-list-item-link">
+              <img src="/img/wallet/{{ wallet.id }}.png" alt="{{ wallet.title }}" /> {{ wallet.titleshort }}
+            </div>
+            <div class="wallet-list-os">
+              {% for platform in wallet.platform%}
+                {% for os in platform.os%}
+                  <a class="wallet-list-os-link" href="/{{ page.lang}}/wallets/{{platform.name}}/{{os.name}}/{{ wallet.id }}/"><img src="/img/os/wallet_menu_{{os.name}}.svg" alt="{{os.name}}"></a>
+                {% endfor %}
+              {% endfor %}
+            </div>
+          </div>
+        {% endfor %}
+      {% else %}
+        {% for wallet in site.wallets %} 
+        {% assign platform = page.platform['name'] %} 
+        {% assign os = page.os['name'] %} 
+        {% if wallet.compat contains platform and wallet.compat contains os %}
+        <div class="wallet-list-item" data-walletlevel="{{ wallet.level }}">
+          {% if platform == os %}
+          <a class="wallet-list-item-link" href="/{{ page.lang}}/wallets/{{ platform }}/{{ wallet.id }}/">
+            {% else %}
+            <a class="wallet-list-item-link" href="/{{ page.lang}}/wallets/{{ platform }}/{{ os }}/{{ wallet.id }}/">
+              {% endif %}
+              <img src="/img/wallet/{{ wallet.id }}.png" alt="{{ wallet.title }}" /> {{ wallet.titleshort }}
+            </a>
+        </div>
+        {% endif %} 
+        {% endfor %}  
+      {% endif %}
+      
     </div>
   </div>
 </div>

_includes/layout/base/wallets-menu.html

@@ -13,6 +13,10 @@ http://opensource.org/licenses/MIT.
 <div class="walletmenu" id="walletmenu" style="margin-bottom: {{walletMargin}}">
 {% assign platformsByPlatform = site.platforms | group_by: "platform" %}
   <ul>
+     {% if page.id == "choose-your-wallet" %}
+       {% assign statusClass = "active" %}
+     {% endif %}
+    <li class="wallet-all {{statusClass}}"><a href="/{{ page.lang }}/{% translate choose-your-wallet url %}">All wallets</a></li>
   {% for platform in platformsByPlatform %}
 
     {% comment %}

_platforms/mobile/blackberry.html

@@ -1,10 +0,0 @@
----
-# This file is licensed under the MIT License (MIT) available on
-# http://opensource.org/licenses/MIT.
-
-id: wallets-mobile-blackberry
-platform:
-  name: mobile
-os:
-  name: blackberry
----

_sass/_donation-banner.scss

@@ -99,8 +99,12 @@ $dark-green: #318f20;
     }
 
     &.open {
+        height: 755px;
+        max-height: 100%;
         transform: translate(-50%, -50%) scale(1);
         opacity: 1;
+        -ms-overflow-style: none;
+        overflow: -moz-scrollbars-none; 
     }
 
     .modal-close-btn {

_sass/_wallets-menu.scss

@@ -18,6 +18,7 @@ $oses:
     text-align: center;
     position: relative;
     z-index: 90;
+    border-bottom: 1px solid #dfdfdf;
 
     > ul {
         display: inline-block;
@@ -93,10 +94,11 @@ $oses:
                 color: #383838;
             }
             a {
-                white-space: nowrap;
-                cursor: pointer;
                 display: block;
                 padding: 18px 10px 21px 42px;
+                text-transform: uppercase;
+                white-space: nowrap;
+                cursor: pointer;
 
             }
             
@@ -147,6 +149,12 @@ $oses:
                 color: #ff7e00;
             }
         }
+        .wallet-all a {
+            padding: 18px 10px 21px;
+        }
+        .wallet-all a:hover {
+            padding: 18px 10px 18px;
+        }
     }
 
     // Generating icon classes for platforms
@@ -412,6 +420,11 @@ $oses:
         background-size: 22px;
     }
 }
+@media handheld, only screen and ( max-width: 60em ), only screen and ( max-device-width: 60em ) {
+    .walletmenu>ul li {
+        margin: 0 25px;
+    }
+}
 @media handheld, only screen and ( max-width: 48em ), only screen and ( max-device-width: 48em ) {
     .walletmenu,
     .filter {

_sass/_wallets.scss

@@ -28,13 +28,13 @@ $black: #13161F;
     max-width: 1230px;
     width: 100%;
     margin: 0 auto;
-    padding: 20px 30px 40px;
+    padding: 40px 30px 40px;
     text-align: left;
 
     .wallet-list-item {
         display: inline-block;
         width: 14.2%;
-        height: 165px;
+        height: auto;
         padding: 20px 0;
         margin-bottom: 30px;
         margin-right: 2.5%;
@@ -311,6 +311,13 @@ $scores:
     }
 }
 
+
+.wallet-list-os {
+    margin-top: 15px;
+}
+.wallet-list-os-link {
+    margin: 0 5px
+}
 .walletsswitch {
     display: none;
 }

_templates/choose-your-wallet.html

@@ -8,8 +8,4 @@
 layout: wallet-platform
 id: choose-your-wallet
 
-platform:
-  name: desktop
-os:
-  name: windows
 ---

_wallets/bitcoincore.md

@@ -4,7 +4,7 @@
 
 id: bitcoincore
 title: "Bitcoin Core"
-titleshort: "Bitcoin<br>Core"
+titleshort: "Bitcoin Core"
 compat: "desktop windows mac linux"
 level: 1
 platform:

_wallets/bitcoinknots.md

@@ -4,7 +4,7 @@
 
 id: bitcoinknots
 title: "Bitcoin Knots"
-titleshort: "Bitcoin<br>Knots"
+titleshort: "Bitcoin Knots"
 compat: "desktop windows mac linux"
 level: 1
 platform:

_wallets/bitcoinwallet.md

@@ -4,8 +4,8 @@
 
 id: bitcoinwallet
 title: "Bitcoin Wallet"
-titleshort: "Bitcoin<br>Wallet"
-compat: "mobile android blackberry"
+titleshort: "Bitcoin Wallet"
+compat: "mobile android"
 level: 2
 platform:
   - mobile:
@@ -27,20 +27,4 @@ platform:
           privacyaddressreuse: "checkpassprivacyaddressrotation"
           privacydisclosure: "checkfailprivacydisclosurespv"
           privacynetwork: "checkfailprivacynetworknosupporttor"
-      - name: blackberry
-        text: "walletbitcoinwallet"
-        link: "https://appworld.blackberry.com/webstore/content/23952882/"
-        source: "https://github.com/bitcoin-wallet/bitcoin-wallet"
-        screenshot: "bitcoinwalletandroid.png"
-        check:
-          control: "checkgoodcontrolfull"
-          validation: "checkpassvalidationspvp2p"
-          transparency: "checkpasstransparencyopensource"
-          environment: "checkpassenvironmentmobile"
-          privacy: "checkpassprivacybasic"
-          fees: "checkgoodfeecontrolfull"
-        privacycheck:
-          privacyaddressreuse: "checkpassprivacyaddressrotation"
-          privacydisclosure: "checkfailprivacydisclosurespv"
-          privacynetwork: "checkfailprivacynetworknosupporttor"
 ---

_wallets/digitalbitbox.md

@@ -4,7 +4,7 @@
 
 id: digitalbitbox
 title: "DigitalBitbox"
-titleshort: "Digital<br />Bitbox"
+titleshort: "Digital Bitbox"
 compat: "hardware"
 level: 2
 platform:

_wallets/greenaddress.md

@@ -4,7 +4,7 @@
 
 id: greenaddress
 title: "GreenAddress"
-titleshort: "Green<br>Address"
+titleshort: "Green Address"
 compat: "mobile desktop web android ios windows mac linux"
 level: 3
 platform:

_wallets/ledgernanos.md

@@ -4,7 +4,7 @@
 
 id: ledgernanos
 title: "Ledger Nano S"
-titleshort: "Ledger<br>Nano S"
+titleshort: "Ledger Nano S"
 compat: "hardware"
 level: 2
 platform:

_wallets/simplebitcoinwallet.md

@@ -4,7 +4,7 @@
 
 id: simplebitcoinwallet
 title: "Simple Bitcoin Wallet"
-titleshort: "Simple<br>Bitcoin"
+titleshort: "Simple Bitcoin"
 compat: "mobile android"
 level: 2
 platform: