mobile responsive design and many design fixes

adapt CSS to be either responsive, or specific to mobiles
add mobile menu icon to show the hidden menu on touch
add optimized language bar menu for mobiles
remove 1200px width workaround for the wallet page, description now fit on 1
remove links on wallet icons for :hover compatibility with mobile devices
move right buttons into the page (fixes #67)
fix contributors plugin to produce W3C valid HTML
drop useless classes like .list
clean and organize CSS
add icon for ios touch devices (fixes #111)
This commit is contained in:
Saivann 2013-04-01 16:34:55 -04:00
parent 3e2463928c
commit 9d590e098b
15 changed files with 500 additions and 326 deletions

View file

@ -13,7 +13,7 @@ title: About - Bitcoin
<h2>Technical features</h2>
<p>These are the basic features of any Bitcoin-like network.</p>
<ul class="list">
<ul>
<li>Bitcoins can be transferred between arbitrary nodes on the network.</li>
<li>Transactions are irreversible.</li>
<li>Double spending is prevented by using a <a href="https://en.bitcoin.it/wiki/Block_chain">block chain</a>.</li>
@ -24,7 +24,7 @@ title: About - Bitcoin
<h2>Economic rules</h2>
<p>These rules are enforced collectively by the network. While they will not change for Bitcoin, other digital currencies using the same technology may change them to suit their needs.</p>
<ul class="list">
<ul>
<li>Hard limit of <a href="https://en.bitcoin.it/wiki/Controlled_Currency_Supply">about 21 million Bitcoins</a>.</li>
<li>Bitcoins are divisible to 8 decimal places yielding a total of approx. 21×10<sup>14</sup> currency units.</li>
<li>Transactions are cheap, and <a href="https://en.bitcoin.it/wiki/Transaction_fees">mostly free</a>.</li>
@ -32,7 +32,7 @@ title: About - Bitcoin
<h2>Statistics</h2>
<p>The network has been running for more than 45 months, yielding some impressive security features. There has been especially significant growth over the last year. As of February 2013, here are some statistics.</p>
<ul class="list">
<ul>
<li>Long block chain (more than 220,000 blocks).</li>
<li>A lot of processing power securing transactions - estimated at over 25 terahashes/s.</li>
<li>Over $1 million USD of daily trade volume distributed across 40,000 transactions.</li>

View file

@ -3,14 +3,12 @@ layout: base-en
id: choose-your-wallet
title: Choose your wallet - Bitcoin
---
<!--CSS to prevent bubbles to be partially hidden in low-res devices-->
<style>body{min-width:1200px;}</style>
<h1>Choose your wallet</h1>
<p>Your Bitcoin wallet is what allows you to transact with the world. It gives you ownership of Bitcoin <i>addresses</i> that you can use to receive coins from other users, and then lets you send those coins onwards. Just like email, you can receive Bitcoins when you are offline and all wallets are compatible with each other. Before you start with Bitcoin, <b>be sure to read <a href="/en/you-need-to-know">what you need to know</a></b> first.</p>
<h2>Get started fast and easy</h2>
<p>If you are new to Bitcoin, these wallets are a good place to begin.</p>
<ul class="list">
<ul>
<li><a href="/en/download"><b>Bitcoin-Qt</b></a> is an app you can download for Windows, Mac and Linux.</li>
<li><a href="https://play.google.com/store/apps/details?id=de.schildbach.wallet"><b>Bitcoin Wallet</b></a> for Android runs on your phone or tablet.</li>
</ul>
@ -23,7 +21,7 @@ title: Choose your wallet - Bitcoin
<div class="previewrow">
<h2><img src="/img/ico_software.svg" alt="Software wallets" />Software wallets</h2>
<p>Software wallets are installed on your computer. They give you complete control of your wallet. You are responsible for doing backups and protecting your money. Just like cash.</p>
<p>Software wallets are installed on your computer. They give you complete control of your wallet. You are responsible for doing backups and protecting your money.</p>
<div>
<div>
<h2>Bitcoin-Qt</h2>
@ -31,7 +29,7 @@ title: Choose your wallet - Bitcoin
<p>Bitcoin-Qt is the original Bitcoin client and it builds the backbone of the network. It offers the highest levels of security, privacy and stability. However it has fewer features and it takes a lot of space and memory.</p>
<p><a href="download">Download</a></p>
</div>
<a href="download"><img src="/img/clients/lo-bitcoin.png" alt="bitcoin-qt" />Bitcoin-Qt</a>
<a href="#" onclick="return false;"><img src="/img/clients/lo-bitcoin.png" alt="bitcoin-qt" />Bitcoin-Qt</a>
</div>
<div>
<div>
@ -40,7 +38,7 @@ title: Choose your wallet - Bitcoin
<p>Multibit is a lightweight client that focuses on being fast and easy to use. It synchronizes with the network and is ready to use in minutes. Multibit also supports many languages. It is a good choice for non-technical users.</p>
<p><a href="https://multibit.org/">Visit website</a></p>
</div>
<a href="https://multibit.org/"><img src="/img/clients/lo-multibit.png" alt="multibit" />Multibit</a>
<a href="#" onclick="return false;"><img src="/img/clients/lo-multibit.png" alt="multibit" />Multibit</a>
</div>
<div class="last">
<div>
@ -49,7 +47,7 @@ title: Choose your wallet - Bitcoin
<p>Armory is an advanced Bitcoin client that runs on top of Bitcoin-Qt. Expanding its features for Bitcoin power users. It offers many backup and encryption features, and it allows secure cold-storage on offline computers.</p>
<p><a href="http://bitcoinarmory.com/">Visit website</a></p>
</div>
<a href="http://bitcoinarmory.com/"><img src="/img/clients/lo-armory.png" alt="armory" />Armory</a>
<a href="#" onclick="return false;"><img src="/img/clients/lo-armory.png" alt="armory" />Armory</a>
</div>
<div>
<div>
@ -58,7 +56,7 @@ title: Choose your wallet - Bitcoin
<p>Electrum's focus is speed and simplicity, with low resource usage. It uses remote servers that handle the most complicated parts of the Bitcoin system, and it allows you to recover your wallet from a secret phrase.</p>
<p><a href="http://electrum.org/">Visit website</a></p>
</div>
<a href="http://electrum.org/"><img src="/img/clients/lo-electrum.png" alt="electrum" />Electrum</a>
<a href="#" onclick="return false;"><img src="/img/clients/lo-electrum.png" alt="electrum" />Electrum</a>
</div>
</div>
@ -72,7 +70,7 @@ title: Choose your wallet - Bitcoin
<p>Bitcoin Wallet is a lightweight mobile client for Android and BlackBerry OS. This client does not need to be associated with any online service to work. It is compatible with QR code scanning and NFC.</p>
<p><a href="https://play.google.com/store/apps/details?id=de.schildbach.wallet">Visit website</a></p>
</div>
<a href="https://play.google.com/store/apps/details?id=de.schildbach.wallet"><img src="/img/clients/lo-bitcoinwallet.png" alt="bitcoin wallet" />Bitcoin<br>Wallet</a>
<a href="#" onclick="return false;"><img src="/img/clients/lo-bitcoinwallet.png" alt="bitcoin wallet" />Bitcoin<br>Wallet</a>
</div>
<div data-id="blockchainmobile">
<div class="walletwarning">
@ -81,7 +79,7 @@ title: Choose your wallet - Bitcoin
<p>Web wallets host your bitcoins. That means it is possible for them to lose your bitcoins following any incident on their side. As of today, no web wallet service provide enough insurance to be used to store value like a bank.</p>
<p><a href="javascript:walletshow();">OK, I understand</a></p>
</div>
<a><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
<a href="#" onclick="return false;"><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
</div>
<div data-id="paytunia" class="last">
<div class="walletwarning">
@ -90,7 +88,7 @@ title: Choose your wallet - Bitcoin
<p>Web wallets host your bitcoins. That means it is possible for them to lose your bitcoins following any incident on their side. As of today, no web wallet service provide enough insurance to be used to store value like a bank.</p>
<p><a href="javascript:walletshow();">OK, I understand</a></p>
</div>
<a><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
<a href="#" onclick="return false;"><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
</div>
</div>
@ -104,7 +102,7 @@ title: Choose your wallet - Bitcoin
<p>Web wallets host your bitcoins. That means it is possible for them to lose your bitcoins following any incident on their side. As of today, no web wallet service provide enough insurance to be used to store value like a bank.</p>
<p><a href="javascript:walletshow();">OK, I understand</a></p>
</div>
<a><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
<a href="#" onclick="return false;"><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
</div>
<div data-id="bips">
<div class="walletwarning">
@ -113,7 +111,7 @@ title: Choose your wallet - Bitcoin
<p>Web wallets host your bitcoins. That means it is possible for them to lose your bitcoins following any incident on their side. As of today, no web wallet service provide enough insurance to be used to store value like a bank.</p>
<p><a href="javascript:walletshow();">OK, I understand</a></p>
</div>
<a><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
<a href="#" onclick="return false;"><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
</div>
<div data-id="coinbase" class="last">
<div class="walletwarning">
@ -122,7 +120,7 @@ title: Choose your wallet - Bitcoin
<p>Web wallets host your bitcoins. That means it is possible for them to lose your bitcoins following any incident on their side. As of today, no web wallet service provide enough insurance to be used to store value like a bank.</p>
<p><a href="javascript:walletshow();">OK, I understand</a></p>
</div>
<a><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
<a href="#" onclick="return false;"><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
</div>
<div data-id="instawallet">
<div class="walletwarning">
@ -131,7 +129,7 @@ title: Choose your wallet - Bitcoin
<p>Web wallets host your bitcoins. That means it is possible for them to lose your bitcoins following any incident on their side. As of today, no web wallet service provide enough insurance to be used to store value like a bank.</p>
<p><a href="javascript:walletshow();">OK, I understand</a></p>
</div>
<a><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
<a href="#" onclick="return false;"><img src="/img/clients/lo-hidden.png" alt="hidden" /></a>
</div>
</div>
</div>

View file

@ -7,14 +7,14 @@ title: Development - Bitcoin
<h2>Specification</h2>
<p>If you are interested in learning more about the technical details of Bitcoin it is recommended you start with these documents.</p>
<ul class="list">
<ul>
<li><a href="/bitcoin.pdf">Bitcoin: A Peer-to-Peer Electronic Cash System</a></li>
<li><a href="https://en.bitcoin.it/wiki/Protocol_rules">Protocol rules</a></li>
<li><a href="https://en.bitcoin.it/wiki/Category:Technical">Bitcoin Wiki</a></li>
</ul>
<h2>Developers</h2>
<ul class="list">
<ul>
<li>Satoshi Nakamoto</li>
<li>Gavin Andresen - <a href="mailto:gavinandresen@gmail.com">gavinandresen@gmail.com</a> (<a href="/gavinandresen.asc">PGP</a>)</li>
<li>Pieter Wuille - <a href="mailto:pieter.wuille@gmail.com">pieter.wuille@gmail.com</a> (<a href="/pieterwuille.asc">PGP</a>)</li>
@ -28,27 +28,12 @@ title: Development - Bitcoin
<p>Bitcoin development is open source and any developer can contribute to the project. Everything you need is in the <a href="https://github.com/bitcoin/bitcoin">Github repository</a>. Please make sure to read and follow the development process described in the README as well as to provide good quality code and respect all guidelines.</p>
<section id="contributors">
<h2>Contributors</h2>
<p>(Ordered by number of commits)</p>
<table class="contributors">
<tr>
{% for c in site.project.contributors %}
<td>
{% if c.gravatar_id %}
<img class="icon" height="16" width="16" src="https://secure.gravatar.com/avatar/{{c.gravatar_id}}?s=140&d=http%3A%2F%2Fbitcoin.org%2Fimg%2Fgravatar-140.png" />
{% else %}
<img class="icon" height="16" width="16" src="http://bitcoin.org/img/gravatar-140.png" />
{% endif %}
{% if c.login %}
<a href="http://github.com/{{c.login}}">
{{ c.name }} ({{ c.contributions }})
</a>
{% else %}
{{ c.name }} ({{ c.contributions }})
{% endif %}
</td>
{% cycle nil, nil, nil, nil, '</tr><tr>' %}
{% endfor %}
</tr>
</table>
<h2>Contributors</h2>
<p>(Ordered by number of commits)</p>
<div class="contributors">{% for c in site.project.contributors %}
<span>
{% if c.gravatar_id %}<img class="icon" height="16" width="16" src="https://secure.gravatar.com/avatar/{{c.gravatar_id}}?s=140&amp;d=http%3A%2F%2Fbitcoin.org%2Fimg%2Fgravatar-140.png" alt="icon" />{% else %}<img class="icon" height="16" width="16" src="http://bitcoin.org/img/gravatar-140.png" alt="icon" />{% endif %}
{% if c.login %}<a href="http://github.com/{{c.login}}">{{ c.name }} ({{ c.contributions }})</a>{% else %}{{ c.name }} ({{ c.contributions }}){% endif %}
</span>{% endfor %}
</div>
</section>

View file

@ -6,10 +6,10 @@ title: Bitcoin
<h1>An open source P2P digital currency</h1>
<p style="font-size:20px;">Bitcoin is a digital currency, a protocol, and a software that enables
<ul style="font-size:20px;">
<li style="padding:4px 0px;">Instant peer to peer transactions</li>
<li style="padding:4px 0px;">Worldwide payments</li>
<li style="padding:4px 0px;">Low or zero processing fees</li>
<li style="padding:4px 0px;">And much more!</li>
<li>Instant peer to peer transactions</li>
<li>Worldwide payments</li>
<li>Low or zero processing fees</li>
<li>And much more!</li>
</ul>
<p>Bitcoin uses peer to peer technology to operate with no central authority; managing transactions and issuing Bitcoins are carried out <b>collectively by the network</b>. Through many of its unique properties, Bitcoin allows exciting uses that could not be covered by any previous payment systems.</p>
<p>The software is a community-driven <a href="http://www.fsf.org/about/what-is-free-software">free open source</a> project, released under the <a href="http://creativecommons.org/licenses/MIT/">MIT license</a>.</p>