mirrors/not-gwent-online
1
0
Fork 0
mirror of https://github.com/exane/not-gwent-online synced 2024-11-23 19:36:53 +00:00
Code Releases Activity

styling searchMatch

Browse Source
This commit is contained in:
devfake 2015-06-22 11:10:43 +02:00
parent 9b4dbe39e2
commit 5972c72b67
3 changed files with 33 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
site/client/app/components/modals/searchMatch.js
View File

@ -2,6 +2,13 @@ module.exports = {
template: require('../../views/modals/searchMatch.html'), template: require('../../views/modals/searchMatch.html'),
inherit: true inherit: true,
methods: {
cancelMatch: function() {
this.modal = false;
// trigger match functions
}
}
}; };

2
site/client/app/views/modals/searchMatch.html
View File

@ -5,6 +5,8 @@
<i class="icon-content-load"></i> <i class="icon-content-load"></i>
<p class="modal-para">Search for Player</p> <p class="modal-para">Search for Player</p>
<span class="btn-cancel" v-on="click: cancelMatch">Cancel</span>
</div> </div>
</div> </div>
</div> </div>

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

@ -16,7 +16,7 @@
top: 0; top: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
background: rgba(14,27,43,.8); background: rgba(14,27,43,.5);
z-index: 10; z-index: 10;
opacity: 0; opacity: 0;
visibility: hidden; visibility: hidden;
@ -34,16 +34,18 @@
width: 100%; width: 100%;
color: #fff; color: #fff;
padding: 50px 0; padding: 50px 0;
margin: 15% 0 0 0; margin: 25vh 0 0 0;
float: left; float: left;
} }
.icon-content-load { .icon-content-load {
background: url(../img/content-load.gif) no-repeat; background: url(../img/content-load.gif) no-repeat;
float: left; //float: left;
width: 32px; width: 32px;
height: 32px; height: 32px;
opacity: .9; opacity: .9;
display: block;
margin: 0 auto;
} }
.modal-para { .modal-para {
@ -53,5 +55,22 @@
text-shadow: 0 0 10px rgba(255, 255, 255, 0.6); text-shadow: 0 0 10px rgba(255, 255, 255, 0.6);
color: #8798ac; color: #8798ac;
float: left; float: left;
margin: 3px 0 0 20px; clear: both;
width: 100%;
text-align: center;
//margin: 3px 0 0 20px;
}
.btn-cancel {
float: left;
clear: both;
margin: 50px 0 0 0;
width: 100%;
text-align: center;
color: darken(#8798ac, 10%);
cursor: pointer;
&:hover {
color: #8798ac;
}
} }