Center game and black background
This commit is contained in:
parent
5526696c96
commit
30164c64df
@ -4,11 +4,16 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
font-family: VT323, 'Common Pixel', sans-serif;
|
font-family : VT323, 'Common Pixel', sans-serif;
|
||||||
|
background-color: black;
|
||||||
|
margin : auto;
|
||||||
|
width : 50%;
|
||||||
|
padding : 10px;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#canvas {
|
#canvas {
|
||||||
border: 1px solid #f8aa28;
|
border : 1px solid #f8aa28;
|
||||||
border-radius: 1%;
|
border-radius: 1%;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -16,7 +21,7 @@ body {
|
|||||||
width : 416px;
|
width : 416px;
|
||||||
height: 416px;
|
height: 416px;
|
||||||
|
|
||||||
border: 1px solid #f8aa28;
|
border : 1px solid #f8aa28;
|
||||||
border-radius: 1%;
|
border-radius: 1%;
|
||||||
|
|
||||||
position: relative;
|
position: relative;
|
||||||
@ -29,15 +34,15 @@ body {
|
|||||||
top : 0px;
|
top : 0px;
|
||||||
left : 0px;
|
left : 0px;
|
||||||
background-color: black;
|
background-color: black;
|
||||||
border: 1px solid #f8aa28;
|
border : 1px solid #f8aa28;
|
||||||
border-radius: 1%;
|
border-radius : 1%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.center {
|
.center {
|
||||||
display: flex;
|
display : flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items : center;
|
||||||
justify-items: center;
|
justify-items : center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.center:first-child {
|
.center:first-child {
|
||||||
@ -64,19 +69,19 @@ div.start-level-button {
|
|||||||
stroke-dasharray : 650;
|
stroke-dasharray : 650;
|
||||||
stroke-dashoffset : 650;
|
stroke-dashoffset : 650;
|
||||||
-webkit-transition: all 0.5s ease-in-out;
|
-webkit-transition: all 0.5s ease-in-out;
|
||||||
transition: all 0.5s ease-in-out;
|
transition : all 0.5s ease-in-out;
|
||||||
opacity : 0.3;
|
opacity : 0.3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.playBut {
|
.playBut {
|
||||||
display : inline-block;
|
display : inline-block;
|
||||||
transition: all 0.5s ease;
|
transition : all 0.5s ease;
|
||||||
-webkit-transition: all 0.5s ease;
|
-webkit-transition: all 0.5s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.playBut .triangle {
|
.playBut .triangle {
|
||||||
-webkit-transition: all 0.7s ease-in-out;
|
-webkit-transition: all 0.7s ease-in-out;
|
||||||
transition: all 0.7s ease-in-out;
|
transition : all 0.7s ease-in-out;
|
||||||
stroke-dasharray : 240;
|
stroke-dasharray : 240;
|
||||||
stroke-dashoffset : 480;
|
stroke-dashoffset : 480;
|
||||||
stroke : #FFF;
|
stroke : #FFF;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user