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

bit styling

This commit is contained in:
devfake 2015-06-21 20:29:07 +02:00
parent 3a31f3031a
commit 22e65ccb96
6 changed files with 19 additions and 10 deletions

View File

@ -1,6 +1,6 @@
<section class="container-inner"> <section class="container-inner">
<a href="./lobby"><img src="assets/img/logo-medium.png" width="148" height="46" alt="Gwent" class="logo-medium"></a> <a href="./lobby"><img src="assets/img/logo-medium.png" width="160" height="50" alt="Gwent" class="logo-medium"></a>
<navigation></navigation> <navigation></navigation>

View File

@ -18,12 +18,9 @@ main {
padding: 20px; padding: 20px;
height: calc(100vh - 300px); height: calc(100vh - 300px);
min-height: 400px; min-height: 400px;
clear: both;
background: -moz-linear-gradient(top, rgba(8,13,20,1) 17%, rgba(8,13,20,0.65) 46%, rgba(239,239,239,0) 100%); color: #fff;
background: -webkit-gradient(linear, left top, left bottom, color-stop(17%,rgba(8,13,20,1)), color-stop(46%,rgba(8,13,20,0.65)), color-stop(100%,rgba(239,239,239,0)));
background: -webkit-linear-gradient(top, rgba(8,13,20,1) 17%,rgba(8,13,20,0.65) 46%,rgba(239,239,239,0) 100%); @include contentGradient();
background: -o-linear-gradient(top, rgba(8,13,20,1) 17%,rgba(8,13,20,0.65) 46%,rgba(239,239,239,0) 100%);
background: -ms-linear-gradient(top, rgba(8,13,20,1) 17%,rgba(8,13,20,0.65) 46%,rgba(239,239,239,0) 100%);
background: linear-gradient(to bottom, rgba(8,13,20,1) 17%,rgba(8,13,20,0.65) 46%,rgba(239,239,239,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#080d14', endColorstr='#00efefef',GradientType=0 );
} }

View File

@ -22,6 +22,17 @@ $main: #d96f1f;
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#243141', endColorstr='#334152',GradientType=1 ); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#243141', endColorstr='#334152',GradientType=1 );
} }
@mixin contentGradient() {
background: #080d14;
background: -moz-linear-gradient(top, rgba(8,13,20,1) 4%, rgba(8,13,20,0.56) 46%, rgba(239,239,239,0) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(4%,rgba(8,13,20,1)), color-stop(46%,rgba(8,13,20,0.56)), color-stop(100%,rgba(239,239,239,0)));
background: -webkit-linear-gradient(top, rgba(8,13,20,1) 4%,rgba(8,13,20,0.56) 46%,rgba(239,239,239,0) 100%);
background: -o-linear-gradient(top, rgba(8,13,20,1) 4%,rgba(8,13,20,0.56) 46%,rgba(239,239,239,0) 100%);
background: -ms-linear-gradient(top, rgba(8,13,20,1) 4%,rgba(8,13,20,0.56) 46%,rgba(239,239,239,0) 100%);
background: linear-gradient(to bottom, rgba(8,13,20,1) 4%,rgba(8,13,20,0.56) 46%,rgba(239,239,239,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#080d14', endColorstr='#00efefef',GradientType=0 );
}
@mixin transition($type: all) { @mixin transition($type: all) {
transition: $type .3s ease-in-out 0s; transition: $type .3s ease-in-out 0s;
} }

View File

@ -20,6 +20,7 @@ nav {
font-weight: 300; font-weight: 300;
padding: 12px 25px; padding: 12px 25px;
float: left; float: left;
cursor: pointer;
@include transition(color); @include transition(color);
@ -30,7 +31,7 @@ nav {
&.active { &.active {
color: $main; color: $main;
text-shadow: none; text-shadow: none;
background: rgba(#080d14, .9); background: #080d14;
} }
} }
} }

View File

@ -23,7 +23,7 @@
// todo: extract to vue // todo: extract to vue
setTimeout(function() { setTimeout(function() {
$('.container-form-landing').addClass('active') $('.container-form-landing').addClass('active')
}, 400); }, 300);
// todo: extract to vue // todo: extract to vue
$('.btn-guest').on('click', function() { $('.btn-guest').on('click', function() {

Binary file not shown.

Before

Width:  |  Height:  |  Size: 55 KiB

After

Width:  |  Height:  |  Size: 3.3 KiB