diff options
| author | Tor Andersson <tor@ccxvii.net> | 2023-03-05 17:56:13 +0100 |
|---|---|---|
| committer | Tor Andersson <tor@ccxvii.net> | 2023-03-05 17:56:13 +0100 |
| commit | 33c9e87286ccaf9dbf5bc89ed55381c7b03630b4 (patch) | |
| tree | dbad6e09af22272cab1057a58530046c66fb608c | |
| parent | 2a29b33b595f34e463b46388018e456500519404 (diff) | |
| download | server-33c9e87286ccaf9dbf5bc89ed55381c7b03630b4.tar.gz | |
Tweak front page to reduce layout shifts as cover images load.
| -rw-r--r-- | views/index.pug | 25 |
1 files changed, 13 insertions, 12 deletions
diff --git a/views/index.pug b/views/index.pug index 7fe95e0..dffbe46 100644 --- a/views/index.pug +++ b/views/index.pug @@ -10,22 +10,23 @@ html div.list { display: flex; flex-wrap: wrap; - gap: 8px 0; + gap: 12px; } - div.item { - display: flex; - flex-direction: column; - justify-content: space-between; - align-items: center; + div.i { + width: 170px; + height: 200px; + text-align: center; + margin-bottom: 6px; + } + div.t { + text-align: center; } - div.item a:not(:hover) { + div.t a:not(:hover) { color: black; text-decoration: none; } - div.item img { - display: block; + div.i img { box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.5); - margin: 6px 16px; } body include header @@ -40,9 +41,9 @@ html each title in titles unless title.is_hidden div.item - div + div.i +gamecover(title.title_id) - div + div.t a(href="/"+title.title_id)= title.title_name p!= process.env.SITE_INVITE |