mirrors/not-gwent-online
1
0
Fork 0
mirror of https://github.com/exane/not-gwent-online synced 2024-10-31 10:36:53 +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

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

@ -8,21 +8,28 @@ module.exports = {
data: function() { data: function() {
return { return {
cards: [], cards: [],
deck: [] deck: [],
leaders: [],
leader: null,
factionFilter: 'Northern Realm'
} }
}, },
ready: function() { ready: function() {
this.cards = $.map(cards, function(n) { this.cards = cards;
if(n.faction == 'Northern Realm' && n.type != 3) return n; },
});
$.map(deck, (n, i) => { methods: {
if(i == 'northern_realm') { changeDeck: function(deck) {
for(var m in n) { $('.all-cards').addClass('remove');
this.deck.push(this.cards[m]); 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-wrap">
<div class="all-cards"> <div class="all-cards">
<div class="clear-space"></div> <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="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="card-img card" v-style="background-image: 'url(http://80.240.132.120/gwent/assets/cards/' + card.img + '.png)'"></div>
<div class="shadow"></div> <div class="shadow"></div>
@ -15,11 +18,17 @@
<div class="clear-space"></div> <div class="clear-space"></div>
</div> </div>
<div class="shadow-all-cards"></div>
</div> </div>
<!--div class="line"></div-->
<style> <style>
.shadow-all-cards {
height: 60px;
float: left;
width: 100%;
}
.container-content { .container-content {
padding: 0; padding: 0;
} }
@ -28,4 +37,8 @@
float: left; float: left;
overflow: hidden; overflow: hidden;
} }
.remove {
opacity: 0;
}
</style> </style>

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

@ -18,7 +18,7 @@
right: 0; right: 0;
bottom: 0; bottom: 0;
background: rgba(14, 27, 43, .5); background: rgba(14, 27, 43, .5);
z-index: 10; z-index: 9999;
opacity: 0; opacity: 0;
visibility: hidden; 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: -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%); 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 ); 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 { .clear-space {