Start
This commit is contained in:
@@ -0,0 +1,91 @@
|
||||
header {
|
||||
background-color: #f1f1f1;
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
|
||||
.wrapper {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-template-rows: 1fr;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
.button {
|
||||
border: none;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
margin: 10px auto;
|
||||
cursor: pointer;
|
||||
width: 90%;
|
||||
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.buttonY{
|
||||
background-color: orange;
|
||||
grid-row: 1;
|
||||
}
|
||||
.buttonX{
|
||||
background-color: blue;
|
||||
grid-row: 2;
|
||||
}
|
||||
.buttonA{
|
||||
background-color: green;
|
||||
grid-row: 3;
|
||||
}
|
||||
|
||||
.buttonStart{
|
||||
background-color: red;
|
||||
grid-row: 4;
|
||||
width: 50%;
|
||||
font-size: 12px;
|
||||
|
||||
}
|
||||
|
||||
.button_container {
|
||||
position: absolute;
|
||||
display: grid;
|
||||
left: 25%;
|
||||
top: 25%;
|
||||
height: 50%;
|
||||
width: 50%;
|
||||
}
|
||||
.image_container {
|
||||
position: absolute;
|
||||
top: 20%;
|
||||
height: 80%;
|
||||
width: 80%;
|
||||
}
|
||||
.joy_container {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.left {
|
||||
position: relative;
|
||||
background: rgba(63, 58, 55, 0.1);
|
||||
grid-column: 1;
|
||||
height: 100%;
|
||||
}
|
||||
.middle {
|
||||
position: relative;
|
||||
background: rgba(45, 48, 45, 0.1);
|
||||
grid-column: 2;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.right {
|
||||
position: relative;
|
||||
background: rgba(63, 58, 55, 0.1);
|
||||
grid-column: 3;
|
||||
}
|
||||
Reference in New Issue
Block a user