update ui

This commit is contained in:
marsteralex 2022-09-13 15:36:27 +02:00
parent 68bdadde37
commit 5bfb624907

View File

@ -34,6 +34,13 @@
h1 {
font-family: Verdana, Geneva, Tahoma, sans-serif;
text-align: center;
display: flex;
flex-direction: row;
}
.new-game-button {
font-size: 14px;
margin: 0;
}
form {
@ -52,8 +59,8 @@
}
.card {
width: 230px;
height: 208px;
width: 300px;
height: 259px;
border: 5px solid lightgrey;
margin: 5px;
align-items: flex-end;
@ -63,7 +70,7 @@
display: flex;
justify-content: center;
/*background-size: contain;*/
background-size: 220px;
background-size: 292px;
background-repeat: no-repeat;
transition: height 1s, background-image 1s, border 0.4s 0.6s;
background-position-y: calc(50% - 18px);
@ -77,7 +84,7 @@
}
.answer-page .card {
height: 353px;
height: 453px;
/*padding-top: 310px;*/
/*background-size: cover;*/
overflow: hidden;
@ -144,6 +151,7 @@
.card .name {
border-radius: 0 0 5px 5px;
width: 300px;
}
#submit {
@ -165,7 +173,7 @@
padding: 8px 20px;
background-color: lightpink;
border: none;
position: absolute;
/* position: absolute; */
top: 5px;
left: 20px;
border-radius: 3px;
@ -201,6 +209,16 @@
h1 {
margin-right: 240px;
}
.answer-page .card {
height: 353px;
}
.card {
width: 230px;
height: 208px;
background-size: 220px;
}
}
@media screen and (orientation: portrait) and (max-width: 1100px) {
@ -268,7 +286,14 @@
</noscript>
<!-- End Google Tag Manager (noscript) -->
<h1><span id="guess-type"></span>: <span id="round-number"></span></h1>
<h1>
<form method="get" class="new-game-button" action="index.html">
<input type="submit" id="newGame" value="New Game" />
</form>
<div style="flex-grow: 1">
<span id="guess-type"></span>: <span id="round-number"></span>
</div>
</h1>
<div class="play-page">
<div
@ -512,11 +537,9 @@
</form>
</div>
<div style="position: absolute; top: 0; left: 0; right: 0; color: grey">
<form method="get" action="index.html">
<input type="submit" id="newGame" value="New Game" />
</form>
</div>
<div
style="position: absolute; top: 0; left: 0; right: 0; color: grey"
></div>
<div style="margin: -40px 0 0; height: 60px">
<a href="https://paypal.me/idamayer">Donate, buy us a boba 🧋</a>
</div>