add app transitions
This commit is contained in:
parent
e4b64f479b
commit
ed289c7b9a
2 changed files with 6 additions and 3 deletions
|
@ -1,8 +1,11 @@
|
|||
<script lang="ts">
|
||||
import CameraContainer from './CameraContainer.svelte'
|
||||
import { fade } from 'svelte/transition'
|
||||
</script>
|
||||
|
||||
<div
|
||||
in:fade={{ duration: 150, delay: 150 }}
|
||||
out:fade={{ duration: 150 }}
|
||||
class="flex gap-4 w-full py-40 px-10 backdrop-blur-lg justify-center h-full rounded-3xl shadow-md bg-slate-300 bg-opacity-30"
|
||||
>
|
||||
<div class="my-auto">
|
||||
|
@ -12,6 +15,3 @@
|
|||
<CameraContainer cameraUrl="camera_url_here" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style lang="postcss">
|
||||
</style>
|
||||
|
|
|
@ -6,10 +6,13 @@
|
|||
<script lang="ts">
|
||||
import Song from './Song.svelte'
|
||||
import { songList } from '../../Dashboard/MediaPlayer/songList'
|
||||
import { fade } from 'svelte/transition'
|
||||
</script>
|
||||
|
||||
<div
|
||||
class="flex gap-4 w-full py-10 px-10 bg-blue-200 bg-opacity-25 backdrop-blur-xl h-full media-background rounded-3xl flex-wrap"
|
||||
in:fade={{ duration: 150, delay: 150 }}
|
||||
out:fade={{ duration: 150 }}
|
||||
>
|
||||
<h2 class="text-8xl font-bold basis-full text-slate-200">Music</h2>
|
||||
<div class="basis-full h-2" />
|
||||
|
|
Loading…
Reference in a new issue