-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Improve game organization and management (#34)
* Game settings input suggestions with datalists * Toggle game table view in admin dashboard * Display landing page cards grouped by month/year * Fix admin card view sizing bug * Add padding to admin header * Group upcoming games by month/year as well * Landing page hover info on game cards * Basic search by term on landing page * Go to game lobby from admin table * Use open/close registration terminology for card hover * Remove displayed metadata next to game title * Enhance game info tile format * Timezone for game info panel * Tooltips imported and added to dashboard icons * Max width for info panel when unauth'd * Placeholder text for admin game search * Shorten save delay in admin settings & add spinner to dashboard
- Loading branch information
1 parent
25ccafd
commit f60d708
Showing
25 changed files
with
646 additions
and
171 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
4 changes: 4 additions & 0 deletions
4
projects/gameboard-ui/src/app/admin/admin-page/admin-page.component.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,7 @@ | ||
a { | ||
font-size: 1.3rem; | ||
} | ||
.admin-header { | ||
padding-top: 1rem; | ||
padding-left: 2rem; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
92 changes: 88 additions & 4 deletions
92
projects/gameboard-ui/src/app/admin/dashboard/dashboard.component.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,13 +1,97 @@ | ||
@import '../../../scss/variables'; | ||
|
||
.wrapper { | ||
// position: relative; | ||
} | ||
.overlay { | ||
position: absolute; | ||
top: 1rem; | ||
bottom: 1rem; | ||
left: 1rem; | ||
right: 1rem; | ||
top: 0rem; | ||
bottom: 0rem; | ||
left: 0rem; | ||
right: 0rem; | ||
border-radius: .25rem; | ||
background-color: rgba(black, .8); | ||
z-index: 10; | ||
} | ||
.dropzone { | ||
border-radius: 0; | ||
border: 0; | ||
} | ||
|
||
.table-wrapper { | ||
overflow-x: auto; | ||
overflow-y: none; | ||
background-color: $body-bg; | ||
} | ||
table { | ||
border-collapse: separate; | ||
border-spacing: 0; | ||
} | ||
|
||
td { | ||
vertical-align: middle; | ||
} | ||
td:not(.thin-col) { | ||
min-width: 80px; | ||
max-width: 300px; | ||
padding: 0.5rem; | ||
word-wrap: break-word; | ||
} | ||
td.thin-col { | ||
padding-left: 5px; | ||
padding-right: 5px; | ||
text-align: center; | ||
} | ||
td.name-col { | ||
min-width: 250px; | ||
max-width: 350px; | ||
} | ||
|
||
td.date-col { | ||
min-width: 120px; | ||
} | ||
|
||
// 3 'sticky' columns to never scroll out of view | ||
.sticky-card { | ||
position: sticky; | ||
left: 0; | ||
} | ||
.sticky-options { | ||
position: sticky; | ||
left: 45px; | ||
z-index: 30; | ||
} | ||
.sticky-name { | ||
position: sticky; | ||
left: 112px; | ||
div { | ||
border-right: #444 solid 1px; | ||
} | ||
} | ||
.sticky-cell { | ||
background-color: $body-bg; | ||
} | ||
.sticky-header { | ||
background-color: $dark; | ||
} | ||
|
||
.table-card { | ||
height: 50px; | ||
padding: 0; | ||
margin: 0; | ||
} | ||
|
||
.dropdown-item { | ||
cursor: pointer; | ||
} | ||
|
||
// for table scroll bar to match theme | ||
.table-wrapper::-webkit-scrollbar { | ||
background: $black; | ||
} | ||
.table-wrapper::-webkit-scrollbar-thumb { | ||
background: $dark; | ||
} | ||
.table-wrapper::-webkit-scrollbar-thumb:hover { | ||
background: darken($dark, 5%); | ||
} |
Oops, something went wrong.