ch/Schafkopf-Server
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix table list layout

Browse Source
This commit is contained in:
Christoph Hagen 2021-12-25 16:54:10 +01:00
parent 9cc4cdb27c
commit f040ad5a0c
2 changed files with 10 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
Public/schafkopf.html
View File

@ -16,10 +16,6 @@
<button id="logout-button" class="standard-button" onclick="logoutUser()">Log out</button> <button id="logout-button" class="standard-button" onclick="logoutUser()">Log out</button>
</div> </div>
<div id="table-list-bar"> <div id="table-list-bar">
<input type="text" id="table-name-field" name="tablename" placeholder="Create new table..." required>
<input type="checkbox" id="table-public-checkbox" name="public-table" checked="checked">
<span id="table-public-label">Public</span>
<button id="create-table-button" class="standard-button" onclick="createTable()">Create table</button>
<button id="refresh-tables" class="standard-button" onclick="refreshTables()">Refresh list</button> <button id="refresh-tables" class="standard-button" onclick="refreshTables()">Refresh list</button>
</div> </div>
<div id="game-bar"> <div id="game-bar">
@ -31,6 +27,10 @@
<div id="main"> <div id="main">
<div id="main-spacer"></div> <div id="main-spacer"></div>
<div id="table-list"> <div id="table-list">
<input type="text" id="table-name-field" name="tablename" placeholder="Create new table..." required>
<input type="checkbox" id="table-public-checkbox" name="public-table" checked="checked">
<span id="table-public-label">Public</span>
<button id="create-table-button" class="standard-button" onclick="createTable()">Create table</button>
</div> </div>
<div id="table-players"> <div id="table-players">
<div id="table-player-card-top" class="table-card"></div> <div id="table-player-card-top" class="table-card"></div>

18
Public/style.css
View File

@ -139,12 +139,12 @@ body {
#table-list-bar { #table-list-bar {
position: absolute; position: absolute;
width: 460px; /* 540px */ width: 250px; /* 540px */
height: 40px; height: 40px;
top: 5px; top: 5px;
left: 10px; left: 10px;
display: grid; display: grid;
grid-template-columns: 200px 120px 120px; /* 200px 30px 50px 120px 120px */ grid-template-columns: 120px 120px; /* 200px 30px 50px 120px 120px */
column-gap: 10px; column-gap: 10px;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -154,7 +154,9 @@ body {
#table-name-field { #table-name-field {
width: 100%; width: 100%;
font-size: medium; font-size: medium;
grid-column: 1; grid-column: 2;
grid-row: 1 / span 2;
max-width: 200px;
} }
#table-public-checkbox { #table-public-checkbox {
@ -168,21 +170,13 @@ body {
grid-column: 3; grid-column: 3;
} }
#create-table-button {
width: 120px;
grid-column: 2; /* 4 in future */
padding: 0px;
height: 34px;
}
#refresh-tables { #refresh-tables {
width: 120px; width: 120px;
grid-column: 3; /* 5 in future */
padding: 0px; padding: 0px;
height: 34px; height: 34px;
grid-column: 1;
} }
#game-bar { #game-bar {
position: absolute; position: absolute;
width: 270px; width: 270px;