diff options
Diffstat (limited to 'src/routes')
| -rw-r--r-- | src/routes/+page.svelte | 25 |
1 files changed, 20 insertions, 5 deletions
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 1e49411e..e981ea3f 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -79,13 +79,28 @@ </div> <style> - .list { - width: 100%; + #list-container { + display: flex; + flex-wrap: wrap; } - @media (min-width: 960px) { - #list-container { - display: flex; + /* (1440 / 2) + (1440/8) = 720 + 180 = 900 */ + @media (max-width: 900px) { + .list { + flex: 0 0 100%; + } + } + + /* (1920 / 2) + (1920 / 4) = 960 + 480 = 1440 */ + @media (min-width: 901px) and (max-width: 1440px) { + .list { + flex: 0 0 50%; + } + } + + @media (min-width: 1441px) { + .list { + flex: 0 0 33.33%; } } </style> |