summaryrefslogtreecommitdiff
path: root/views/index.pug
diff options
context:
space:
mode:
authorTor Andersson <tor@ccxvii.net>2023-03-05 17:56:13 +0100
committerTor Andersson <tor@ccxvii.net>2023-03-05 17:56:13 +0100
commit33c9e87286ccaf9dbf5bc89ed55381c7b03630b4 (patch)
treedbad6e09af22272cab1057a58530046c66fb608c /views/index.pug
parent2a29b33b595f34e463b46388018e456500519404 (diff)
downloadserver-33c9e87286ccaf9dbf5bc89ed55381c7b03630b4.tar.gz
Tweak front page to reduce layout shifts as cover images load.
Diffstat (limited to 'views/index.pug')
-rw-r--r--views/index.pug25
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