add: dev ticker

src/routes/(DefaultStyle)/+layout.svelte

@@ -3,6 +3,7 @@
     import Header from "./header.svelte";
     import Footer from "./footer.svelte";
     import { onMount } from 'svelte';
+    import { dev } from '$app/environment'
 
 	let { children } = $props();
 
@@ -19,6 +20,9 @@
 
 <div id="root">
     <div id="scroll"></div>
+    {#if dev}
+        <div id='devTicker'>DEV DUILD</div>
+    {/if}
 
     <div class="headerContainer">
         <header class:hide={!scrollObserver}>
@@ -45,13 +49,23 @@
         min-height: 100vh;
     }
 
+    #devTicker {
+        position: fixed;
+        top: 0;
+        left: 0;
+        padding: 6px;
+        color: yellow;
+        background-color: #0008;
+        z-index: 10;
+    }
+
     .headerContainer {
         position: sticky;
         top: 0;
-        height: 100px;
+        height: 80px;
         z-index: 1;
         @media(width<1000px) {
-            height: 50px;
+            height: 40px;
         }
 
         & header {
@@ -59,7 +73,7 @@
             height: 100%;
             transition: height .4s, transform .4s;
             &.hide {
-                height: 50px;
+                height: 40px;
                 @media(width<1000px) {
                     transform: translate(0px,-50px);
                 }
@@ -96,6 +110,6 @@
 	}
 
     @media (scripting: none) {
-        .headerContainer{height:50px !important;}
+        .headerContainer{height:40px !important;}
     }
 </style>