Impaczus/2048
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

move button styles to mixin

Browse Source
This commit is contained in:
Gabriele Cirulli
2014-03-11 15:18:20 +01:00
parent d2315af2ec
commit 92fda72cf5
2 changed files with 23 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
style/main.css
+10 -16
View File
@@ -131,6 +131,16 @@ hr {
100% { 100% {
opacity: 1; } } opacity: 1; } }
.game-container .game-message a {
display: inline-block;
background: #8f7a66;
border-radius: 3px;
padding: 0 20px;
text-decoration: none;
color: #f9f6f2;
height: 40px;
line-height: 42px; }
.game-container { .game-container {
margin-top: 40px; margin-top: 40px;
position: relative; position: relative;
@@ -170,14 +180,6 @@ hr {
display: block; display: block;
margin-top: 59px; } margin-top: 59px; }
.game-container .game-message a { .game-container .game-message a {
display: inline-block;
background: #8f7a66;
border-radius: 3px;
padding: 0 20px;
text-decoration: none;
color: #f9f6f2;
height: 40px;
line-height: 42px;
margin-left: 9px; } margin-left: 9px; }
.game-container .game-message.game-won { .game-container .game-message.game-won {
background: rgba(237, 194, 46, 0.5); background: rgba(237, 194, 46, 0.5);
@@ -502,14 +504,6 @@ hr {
display: block; display: block;
margin-top: 59px; } margin-top: 59px; }
.game-container .game-message a { .game-container .game-message a {
display: inline-block;
background: #8f7a66;
border-radius: 3px;
padding: 0 20px;
text-decoration: none;
color: #f9f6f2;
height: 40px;
line-height: 42px;
margin-left: 9px; } margin-left: 9px; }
.game-container .game-message.game-won { .game-container .game-message.game-won {
background: rgba(237, 194, 46, 0.5); background: rgba(237, 194, 46, 0.5);
style/main.scss
+13 -8
View File
@@ -141,6 +141,18 @@ hr {
} }
} }
// Styles for buttons
@mixin button {
display: inline-block;
background: darken($game-container-background, 20%);
border-radius: 3px;
padding: 0 20px;
text-decoration: none;
color: $bright-text-color;
height: 40px;
line-height: 42px;
}
// Game field mixin used to render CSS at different width // Game field mixin used to render CSS at different width
@mixin game-field { @mixin game-field {
.game-container { .game-container {
@@ -190,14 +202,7 @@ hr {
} }
a { a {
display: inline-block; @include button;
background: darken($game-container-background, 20%);
border-radius: 3px;
padding: 0 20px;
text-decoration: none;
color: $bright-text-color;
height: 40px;
line-height: 42px;
margin-left: 9px; margin-left: 9px;
// margin-top: 59px; // margin-top: 59px;
} }