feat: center gallery grid
This commit is contained in:
parent
29646d14ae
commit
9f55b88b50
@ -278,7 +278,7 @@
|
|||||||
</section>
|
</section>
|
||||||
{:else}
|
{:else}
|
||||||
<div class="button-wrapper">
|
<div class="button-wrapper">
|
||||||
<Button on:click={() => submit()}>Möchtet Ihr diese königliche Einladung annehmen?</Button>
|
<Button on:click={() => submit()}>Einladung versenden</Button>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
{/if}
|
{/if}
|
||||||
|
8
src/lib/components/confetti.js
Normal file
8
src/lib/components/confetti.js
Normal file
File diff suppressed because one or more lines are too long
@ -17,7 +17,7 @@
|
|||||||
});
|
});
|
||||||
|
|
||||||
onMount(async () => {
|
onMount(async () => {
|
||||||
const confetti = (await import('https://esm.run/canvas-confetti')).default;
|
const confetti = (await import('./confetti')).default;
|
||||||
confettiCanvas.width = window.innerWidth / 2;
|
confettiCanvas.width = window.innerWidth / 2;
|
||||||
confettiCanvas.height = window.innerHeight / 2;
|
confettiCanvas.height = window.innerHeight / 2;
|
||||||
|
|
||||||
@ -54,7 +54,7 @@
|
|||||||
|
|
||||||
<style>
|
<style>
|
||||||
canvas {
|
canvas {
|
||||||
position: absolute;
|
position: fixed;
|
||||||
top: 0px;
|
top: 0px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
@ -24,7 +24,7 @@
|
|||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div>
|
<div class="wrapper">
|
||||||
<h1>Gallerie</h1>
|
<h1>Gallerie</h1>
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
{#each items as item}
|
{#each items as item}
|
||||||
@ -47,7 +47,14 @@
|
|||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
|
grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
|
||||||
padding-bottom: 100px;
|
padding-bottom: 100px;
|
||||||
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
width: 90%;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 5rem;
|
font-size: 5rem;
|
||||||
font-family: Parisienne, cursive;
|
font-family: Parisienne, cursive;
|
||||||
@ -87,7 +94,7 @@
|
|||||||
background-image: url(/pattern.jpg) !important;
|
background-image: url(/pattern.jpg) !important;
|
||||||
backdrop-filter: brightness(0.5) !important;
|
backdrop-filter: brightness(0.5) !important;
|
||||||
}
|
}
|
||||||
div {
|
.wrapper {
|
||||||
max-width: 1300px;
|
max-width: 1300px;
|
||||||
width: 80%;
|
width: 80%;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
@ -1,3 +0,0 @@
|
|||||||
[ZoneTransfer]
|
|
||||||
ZoneId=3
|
|
||||||
HostUrl=about:internet
|
|
Loading…
Reference in New Issue
Block a user