Fix style

This commit is contained in:
Anton Vakhrushev 2018-06-17 11:54:31 +03:00
parent 2abb969639
commit a0f52cba6e

View File

@ -81,6 +81,7 @@ export default {
<style lang="scss"> <style lang="scss">
$button-radius: 0.5em; $button-radius: 0.5em;
$font-size: 20px;
.app { .app {
display: block; display: block;
@ -89,7 +90,6 @@ $button-radius: 0.5em;
text-align: center; text-align: center;
padding: 2em; padding: 2em;
border: 1px solid #ccc; border: 1px solid #ccc;
font-size: 24px;
@media (max-width: 749px) { @media (max-width: 749px) {
padding: 2em 0; padding: 2em 0;
width: auto; width: auto;
@ -97,27 +97,36 @@ $button-radius: 0.5em;
} }
.score { .score {
font-size: 300%; font-size: 400%;
margin-bottom: 0.8em; margin-bottom: 0.8em;
display: inline-block; display: inline-block;
} }
.buttons {
display: flex;
justify-content: center;
}
%button { %button {
display: inline-block; display: inline-block;
color: #fff; color: #fff;
background-color: #2e4380; background-color: #405480;
padding: 0.6em 1.2em; padding: 0.6em;
border: none; border: none;
font-size: $font-size;
} }
.restart-button { .restart-button {
@extend %button; @extend %button;
padding: 0.6em 1.4em;
border-radius: $button-radius; border-radius: $button-radius;
} }
.pass-button { .pass-button {
@extend %button; @extend %button;
min-width: 8em; flex-grow: 0;
min-width: 7em;
margin: 0.2em;
} }
.pass-button.__left { .pass-button.__left {