sticky-notes/src/lib/components/app-header.svelte

36 lines
775 B
Svelte
Raw Normal View History

2023-09-25 12:59:55 +08:00
<script lang="ts">
import SettingsButton from '$lib/components/settings/settings-button.svelte';
import ThemeToggle from '$lib/components/theme-toggle.svelte';
</script>
2024-12-03 20:28:40 +08:00
<!-- <header class="app-header">
2023-09-25 12:59:55 +08:00
<ThemeToggle />
<h1 class="app-header__title">Notes</h1>
<SettingsButton />
2024-12-03 20:28:40 +08:00
</header> -->
2023-09-25 12:59:55 +08:00
<style lang="scss">
.app-header {
z-index: 1;
position: sticky;
top: 0;
display: flex;
align-items: center;
justify-content: center;
gap: 2rem;
padding: 0.5rem 1rem;
margin: 0;
background-color: var(--card-sectionning-background-color);
border-bottom-left-radius: 1rem;
border-bottom-right-radius: 1rem;
box-shadow: var(--card-box-shadow);
&__title {
flex: 1 0 auto;
font-size: 1.5rem;
text-align: center;
margin: 0;
}
}
</style>