mirrors/not-gwent-online
1
0
Fork 0
mirror of https://github.com/exane/not-gwent-online synced 2024-12-23 21:03:14 +00:00
Code Releases Activity

test styling

Browse Source
This commit is contained in:
devfake 2015-06-24 12:44:10 +02:00
parent 3a40824fcc
commit 2b5f67b5e9
4 changed files with 49 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
site/client/app/modules/deck-builder/components/deck-builder.js
View File

@ -8,21 +8,28 @@ module.exports = {
data: function() {
return {
cards: [],
deck: []
deck: [],
leaders: [],
leader: null,
factionFilter: 'Northern Realm'
}
},
ready: function() {
this.cards = $.map(cards, function(n) {
if(n.faction == 'Northern Realm' && n.type != 3) return n;
});
this.cards = cards;
},
$.map(deck, (n, i) => {
if(i == 'northern_realm') {
for(var m in n) {
this.deck.push(this.cards[m]);
}
}
});
methods: {
changeDeck: function(deck) {
$('.all-cards').addClass('remove');
this.factionFilter = deck;
$('.all-cards').scrollTop(0);
setTimeout(function() {
$('.all-cards').removeClass('remove');
}, 600);
}
}
};

23
site/client/app/modules/deck-builder/views/deck-builder.html
View File

@ -1,11 +1,14 @@
<div class="heading">Nord Deck</div>
<div class="heading">
<a v-class="active: factionFilter == 'Northern Realm'" v-on="click: changeDeck('Northern Realm')">Northern Realm</a>
<a v-class="active: factionFilter == 'scoiatael'" v-on="click: changeDeck('sco bla')">Scoia'tael</a>
<a v-class="active: factionFilter == 'monster'" v-on="click: changeDeck('monster')">Monster</a>
</div>
<div class="all-cards-wrap">
<div class="all-cards">
<div class="clear-space"></div>
<div class="card-wrap" v-repeat="card: cards">
<div class="card-wrap" v-repeat="card: cards | filterBy factionFilter in faction">
<div class="bla ani"></div>
<div class="card-img card" v-style="background-image: 'url(http://80.240.132.120/gwent/assets/cards/' + card.img + '.png)'"></div>
<div class="shadow"></div>
@ -15,11 +18,17 @@
<div class="clear-space"></div>
</div>
<div class="shadow-all-cards"></div>
</div>
<!--div class="line"></div-->
<style>
.shadow-all-cards {
height: 60px;
float: left;
width: 100%;
}
.container-content {
padding: 0;
}
@ -28,4 +37,8 @@
float: left;
overflow: hidden;
}
.remove {
opacity: 0;
}
</style>

2
site/client/assets/sass/_modal.scss
View File

@ -18,7 +18,7 @@
right: 0;
bottom: 0;
background: rgba(14, 27, 43, .5);
z-index: 10;
z-index: 9999;
opacity: 0;
visibility: hidden;

12
site/client/assets/sass/_shame_cards.scss
View File

@ -218,6 +218,18 @@
background: -ms-linear-gradient(top, rgba(8,13,20,1) 0%,rgba(8,13,20,1) 36%,rgba(8,13,20,0.85) 100%);
background: linear-gradient(to bottom, rgba(8,13,20,1) 0%,rgba(8,13,20,1) 36%,rgba(8,13,20,0.85) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#080d14', endColorstr='#d9080d14',GradientType=0 );
a {
font-size: 17px;
color: #435365;
margin: 0 0 0 30px;
font-weight: 600;
cursor: pointer;
&.active {
color: #c3cdd8;
}
}
}
.clear-space {