joshua/dash-docs
1
0
Fork 0
mirror of https://github.com/seigler/dash-docs synced 2025-07-27 01:36:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Adds button and click handler to display a specifi distro

Browse source
This commit is contained in:
Igor Kuzmenko 2017-07-18 00:20:51 +02:00
parent eca2d54ddb
commit d02f388309
4 changed files with 53 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

2
_includes/layout/base/wallets-list.html
View file

@ -8,7 +8,7 @@ http://opensource.org/licenses/MIT.
<div class="wallets" id="wallets" onclick="walletListener(event);" ontouchstart="walletListener(event);">
{% for wallet in site.wallets %}
<div>
<a>
<a href="/en/wallets/{{ wallet.id }}/#!platform={{ page.platform }}&os={{ page.os }}">
<img src="/img/wallet/{{ wallet.id }}.png" alt="{{ wallet.title }}" />
{{ wallet.titleshort }}
</a>

2
_layouts/wallet-container.html
View file

@ -22,7 +22,7 @@ layout: wallet-platform-container
<div class="wallet-platforms-menu">
{% for platform in page.platform %}
{% for os in platform.os %}
<button>
<button class="wallet-os-btn" id="{{ os.name }}-btn" onclick="walletDistributionListener('{{ os.name }}', '{{ platform.name }}');">
<img src="/img/os/{{ os.name }}.png"
alt="{% translate platform{{os.name}} choose-your-wallet %}"
title="{% translate platform{{os.name}} choose-your-wallet %}" />

18
_sass/_wallets.scss
View file

@ -281,6 +281,20 @@ $scores:
border-radius: 4px;
text-align: center;
&.active {
background-color: #2c6fad;
background-image: -o-linear-gradient(bottom, #255f96 14%, #2c6fad 70%);
background-image: -moz-linear-gradient(bottom, #255f96 14%, #2c6fad 70%);
background-image: -webkit-linear-gradient(bottom, #255f96 14%, #2c6fad 70%);
background-image: -ms-linear-gradient(bottom, #255f96 14%, #2c6fad 70%);
background-image: linear-gradient(bottom, #255f96 14%, #2c6fad 70%);
color: #fff;
&:hover {
background-image: none;
}
}
span {
vertical-align: text-top;
}
@ -295,6 +309,10 @@ $scores:
margin-bottom: 20px;
display: flex;
&.hidden {
display: none;
}
.wallet-os-screenshot {
img {
border: 1px solid $grey;

33
js/main.js
View file

@ -423,6 +423,39 @@ function walletScoreListener(e) {
onTouchClick(e, init);
}
function walletScoreListener(e) {
// Listen for events on wallet scores and display them on tap.
var init = function(e) {
var t = getEvent(e, 'target');
while (!t.parentNode.parentNode.parentNode.id) t = t.parentNode;
(t.className.indexOf('hover') === -1) ? addClass(t, 'hover'): removeClass(t, 'hover');
};
onTouchClick(e, init);
}
function walletDistributionListener(os, platform) {
window.location.hash = "!platform=" + platform + "&os=" + os;
var osContainers = document.querySelectorAll('.wallet-os-container');
var osButtons = document.querySelectorAll('.wallet-os-btn');
var selected = document.getElementById(os);
var button = document.getElementById(os + '-btn');
osContainers.forEach(function(el) { addClass(el, 'hidden'); });
osButtons.forEach(function(el) { removeClass(el, 'active'); });
removeClass(selected, 'hidden');
addClass(button, 'active');
}
(function() {
var hash = window.location.hash;
if (hash.indexOf('!') > -1 && hash.indexOf('platform') > -1 && hash.indexOf('os') > -1) {
var platform = hash.split('&')[0].split('=')[1];
var os = hash.split('&')[1].split('=')[1];
setTimeout(function() {
walletDistributionListener(os, platform);
}, 0);
}
})();
function walletShowPlatform(platform) {
// Show wallets for given platform in the menu.
var t = null,