diff --git a/public/images/layout.png b/public/images/layout.png new file mode 100644 index 0000000..574e596 Binary files /dev/null and b/public/images/layout.png differ diff --git a/src/Component/App.scss b/src/Component/App.scss index 4805e44..7a2e613 100644 --- a/src/Component/App.scss +++ b/src/Component/App.scss @@ -6,4 +6,5 @@ html { font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; line-height: 1.5; font-size: 1.25rem; + overflow: hidden; } diff --git a/src/Component/Board/Board.scss b/src/Component/Board/Board.scss index 5cd54da..85f823f 100644 --- a/src/Component/Board/Board.scss +++ b/src/Component/Board/Board.scss @@ -4,6 +4,8 @@ div[data-is="main-board"] { display: flex; flex-direction: column; margin-bottom: 20px; + background-image: url('/images/layout.png'); + padding: 0 128px 128px 128px; section[data-is="line"] { flex: 1; @@ -12,17 +14,8 @@ div[data-is="main-board"] { div[data-is="tile"] { flex: 1; - border: 1px black dashed; min-height: 128px; min-width: 128px; - - &.goal { - background-color: teal; - } - - &.is-locked { - background-color: black; - } } } } diff --git a/src/Component/Game/Game.scss b/src/Component/Game/Game.scss index 613af1f..3d0b72d 100644 --- a/src/Component/Game/Game.scss +++ b/src/Component/Game/Game.scss @@ -3,10 +3,12 @@ div[data-is="game"] { display: flex; flex-direction: row; + transform: scale(.8); + margin-top: -2rem; section.game-section { flex: 1; - padding: 2rem; + padding: 0 2rem; &.right-panel { h1 { @@ -20,7 +22,7 @@ div[data-is="game"] { margin: 0; text-align: center; color: $color-white; - font-size: 4rem; + font-size: 3rem; font-weight: bold; text-shadow: 0px 3px 0px $color-soil-light; } @@ -52,6 +54,10 @@ div[data-is="game"] { &:active { box-shadow: inset 0px 3px $color-soil-light; } + + &::-moz-focus-inner { + border: 0; + } } } }