mirror of
https://github.com/BradNut/svelteKitForBeginners
synced 2025-09-08 17:40:24 +00:00
39 lines
653 B
Svelte
39 lines
653 B
Svelte
|
<script lang="ts">
|
||
|
|
import Navigation from "$root/components/navigation.svelte";
|
||
|
|
import Trending from "$root/components/trending.svelte";
|
||
|
|
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<div class="container">
|
||
|
|
<Navigation />
|
||
|
|
<main class="feed">
|
||
|
|
<slot />
|
||
|
|
</main>
|
||
|
|
<Trending />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
.container {
|
||
|
|
height: 100vh;
|
||
|
|
max-width: min-content;
|
||
|
|
margin: 0 auto;
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: min-content 50ch;
|
||
|
|
}
|
||
|
|
|
||
|
|
.feed {
|
||
|
|
border: 1px solid var(--color-border-primary);
|
||
|
|
border-top: none;
|
||
|
|
border-bottom: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 1024px) {
|
||
|
|
.container {
|
||
|
|
max-width: 1240px;
|
||
|
|
margin: 0 auto;
|
||
|
|
grid-template-columns: 1fr 50ch 1fr;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|