package layout

templ header(){

    <nav class="container">
        <ul class="brand">
            <li>
                <a class="contrast" href="https://itsigo.de">
                    @logo()
                </a>
            </li>
        </ul>
        <ul hx-target="main">
            <li>
                <a class="contrast" 
                    hx-get="/"
                    hx-push-url="true"
                >Home</a>
            </li>
            <li>
                <a class="contrast" 
                    hx-get="/hp-mana-tracker"
                    hx-push-url="true"
                >TM-Tracker</a>
            </li>
            <li>
                <a class="contrast" onclick="toggleColorMode()">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 32 32" fill="currentColor" class="icon-theme-toggle  moon"><clipPath id="theme-toggle-cutout"><path d="M0-11h25a1 1 0 0017 13v30H0Z"></path></clipPath><g clip-path="url(#theme-toggle-cutout)"><circle cx="16" cy="16" r="8.4"></circle><path d="M18.3 3.2c0 1.3-1 2.3-2.3 2.3s-2.3-1-2.3-2.3S14.7.9 16 .9s2.3 1 2.3 2.3zm-4.6 25.6c0-1.3 1-2.3 2.3-2.3s2.3 1 2.3 2.3-1 2.3-2.3 2.3-2.3-1-2.3-2.3zm15.1-10.5c-1.3 0-2.3-1-2.3-2.3s1-2.3 2.3-2.3 2.3 1 2.3 2.3-1 2.3-2.3 2.3zM3.2 13.7c1.3 0 2.3 1 2.3 2.3s-1 2.3-2.3 2.3S.9 17.3.9 16s1-2.3 2.3-2.3zm5.8-7C9 7.9 7.9 9 6.7 9S4.4 8 4.4 6.7s1-2.3 2.3-2.3S9 5.4 9 6.7zm16.3 21c-1.3 0-2.3-1-2.3-2.3s1-2.3 2.3-2.3 2.3 1 2.3 2.3-1 2.3-2.3 2.3zm2.4-21c0 1.3-1 2.3-2.3 2.3S23 7.9 23 6.7s1-2.3 2.3-2.3 2.4 1 2.4 2.3zM6.7 23C8 23 9 24 9 25.3s-1 2.3-2.3 2.3-2.3-1-2.3-2.3 1-2.3 2.3-2.3z"></path></g></svg>
                </a>
            </li>
        </ul>
    </nav>
}

templ logo(){
    <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
        height="75" viewBox="0 0 500.000000 500.000000"
        preserveAspectRatio="xMidYMid meet">

        <g transform="translate(0.000000,500.000000) scale(0.100000,-0.100000)" stroke="none">
        <path d="M2265 4953 c-47 -25 -76 -55 -97 -100 -18 -41 -19 -77 -18 -875 0
        -850 -8 -1451 -20 -1446 -4 2 -39 39 -78 83 l-72 80 0 420 c0 364 -2 424 -16
        443 -18 27 -45 28 -67 4 -15 -17 -17 -58 -17 -380 0 -199 -3 -362 -7 -361 -5
        1 -36 32 -70 70 l-63 68 0 831 c0 817 0 830 -20 850 -24 24 -32 25 -59 3 l-22
        -18 0 -745 c0 -410 -3 -760 -7 -778 l-7 -34 -58 60 -57 61 0 588 c0 445 -3
        592 -12 601 -17 17 -53 15 -68 -3 -9 -11 -12 -131 -12 -492 -1 -263 -3 -504
        -5 -537 l-5 -59 -129 134 -129 134 0 323 0 322 -24 11 c-35 16 -62 -2 -70 -48
        -3 -21 -6 -143 -6 -271 l0 -233 -41 33 c-36 29 -48 33 -101 33 -56 0 -62 -2
        -93 -36 -23 -25 -37 -54 -44 -90 l-11 -54 -53 0 c-96 0 -167 -77 -167 -180 0
        -44 -1 -45 -32 -45 -96 0 -175 -56 -201 -142 -17 -53 -16 -86 3 -203 5 -33 21
        -132 35 -220 14 -88 30 -182 35 -210 9 -50 37 -221 85 -520 59 -372 87 -522
        104 -561 37 -83 51 -94 671 -531 102 -71 295 -208 430 -303 135 -96 285 -201
        334 -234 48 -34 125 -95 170 -136 45 -41 108 -88 141 -105 55 -27 68 -30 166
        -30 102 0 108 1 182 38 57 28 90 53 129 97 29 33 56 60 61 60 5 0 30 15 56 33
        25 19 231 164 456 322 758 534 952 674 985 711 59 68 68 98 114 389 14 88 51
        315 81 505 30 190 67 417 80 505 14 88 29 187 35 220 16 97 13 156 -12 205
        -35 67 -82 99 -159 108 l-64 7 -5 62 c-8 103 -64 158 -161 158 l-59 -1 0 33
        c0 45 -21 92 -55 123 -22 21 -37 25 -85 25 -51 0 -63 -4 -99 -33 l-41 -33 0
        261 c0 247 -1 261 -20 280 -25 25 -42 25 -63 2 -15 -16 -17 -55 -17 -337 l0
        -318 -147 -149 c-81 -81 -151 -148 -155 -148 -4 0 -8 246 -8 548 0 479 -2 550
        -16 570 -17 24 -53 29 -72 10 -9 -9 -12 -162 -12 -628 l0 -616 -54 -53 c-43
        -43 -54 -49 -60 -36 -3 9 -6 369 -6 800 l0 784 -22 15 c-29 20 -34 20 -58 -4
        -20 -20 -20 -34 -20 -872 l-1 -853 -64 -69 -65 -69 -1 344 c-1 189 -4 355 -8
        368 -9 35 -46 46 -71 21 -19 -19 -20 -35 -20 -429 l0 -410 -67 -77 -68 -77 -5
        1154 -5 1154 -21 40 c-12 22 -30 47 -40 56 -56 49 -134 62 -189 33 -36 -20
        -121 -19 -170 2 -44 18 -92 17 -130 -3z m136 -132 c23 -18 24 -26 29 -188 5
        -172 2 -2594 -3 -2600 -2 -1 -18 32 -37 75 -18 42 -57 118 -87 169 l-53 92 0
        1178 c1 738 5 1192 11 1215 18 69 90 99 140 59z m280 -10 l29 -30 -2 -1218 -3
        -1218 -46 -70 c-26 -38 -57 -95 -70 -125 -13 -30 -29 -66 -36 -80 -11 -20 -13
        224 -13 1348 l0 1373 25 24 c34 35 78 33 116 -4z m-1270 -1698 c596 -600 724
        -750 829 -968 55 -114 70 -160 76 -240 l6 -70 -47 -24 c-25 -14 -64 -45 -86
        -69 -71 -81 -70 -73 -67 -761 3 -603 3 -610 -16 -597 -11 7 -29 30 -40 52 -20
        38 -21 57 -24 604 -4 610 -2 635 48 713 l29 46 -42 34 c-23 19 -161 119 -307
        222 -146 104 -308 221 -361 259 -53 39 -158 116 -234 171 -458 333 -724 535
        -742 562 -21 32 -11 102 17 125 39 32 70 22 181 -55 57 -41 223 -156 369 -256
        271 -186 714 -499 875 -618 50 -37 83 -59 75 -48 -41 49 -410 350 -975 795
        -332 261 -315 243 -315 319 0 64 20 101 56 101 9 0 50 -33 92 -72 262 -249
        363 -338 970 -852 128 -108 229 -189 223 -179 -17 33 -143 177 -245 281 -55
        57 -227 222 -381 365 -154 144 -327 307 -384 363 l-105 101 -1 77 c0 76 8 95
        41 96 6 0 224 -215 485 -477z m2657 465 c7 -7 12 -42 12 -88 l0 -76 -102 -100
        c-57 -55 -202 -192 -323 -304 -382 -355 -555 -530 -694 -704 -9 -11 29 18 84
        65 55 47 152 128 215 180 328 269 660 558 902 786 42 40 82 73 88 73 6 0 22
        -11 35 -25 20 -19 25 -34 25 -77 0 -30 -6 -62 -14 -74 -8 -11 -107 -92 -221
        -180 -521 -401 -1015 -796 -1015 -811 0 -3 6 -1 13 4 39 31 214 158 287 208
        47 32 148 102 225 155 77 53 273 186 435 295 162 110 323 218 358 242 35 24
        75 43 88 43 70 0 102 -111 47 -161 -44 -40 -441 -325 -1367 -981 -160 -112
        -294 -212 -300 -221 -7 -11 -3 -25 15 -54 14 -21 34 -60 45 -88 18 -47 19 -82
        19 -615 0 -440 -3 -573 -13 -602 -14 -41 -48 -88 -63 -88 -5 0 -9 249 -9 628
        l0 628 -26 52 c-29 58 -90 116 -140 132 -32 11 -34 14 -34 57 0 170 125 394
        389 695 145 166 992 1019 1012 1018 8 0 20 -5 27 -12z m-134 -1390 c12 -16 16
        -47 16 -110 0 -49 3 -88 6 -88 3 0 26 17 52 39 26 21 56 41 66 45 29 10 66
        -19 66 -53 0 -24 -14 -39 -95 -100 l-95 -71 0 -152 c0 -142 -1 -153 -22 -175
        -26 -28 -49 -29 -71 -5 -13 14 -17 44 -19 131 l-3 113 -62 -48 -63 -48 0 -160
        c0 -172 -7 -196 -55 -196 -44 0 -54 27 -57 152 l-3 116 -62 -50 -63 -50 0
        -156 c0 -172 -6 -192 -61 -192 -41 0 -49 24 -49 149 0 61 -3 111 -6 111 -3 0
        -24 -16 -47 -35 -47 -41 -90 -46 -107 -14 -21 37 -3 66 80 129 l80 61 0 141
        c0 118 3 145 17 160 19 22 42 23 69 4 16 -12 20 -30 24 -116 l5 -102 63 48 62
        48 0 140 c0 151 8 176 55 176 39 0 50 -26 55 -132 l5 -99 60 48 60 49 3 144
        c1 85 7 149 14 157 17 21 65 16 82 -9z m-2940 -40 c24 -34 24 -533 0 -566 -21
        -31 -64 -26 -81 8 -19 37 -14 540 6 563 19 24 57 21 75 -5z m184 -84 c22 -15
        22 -16 22 -340 0 -311 -1 -325 -20 -344 -40 -40 -80 -13 -81 53 0 23 0 170 0
        327 0 281 0 285 21 302 27 22 30 22 58 2z m203 -170 c16 -20 14 -651 -3 -671
        -15 -18 -48 -16 -70 4 -17 15 -18 39 -18 334 0 275 2 320 16 333 20 20 58 20
        75 0z m191 -151 c17 -15 18 -38 18 -304 l0 -289 -25 -16 c-23 -15 -27 -15 -50
        0 l-25 16 0 287 c0 252 2 289 17 305 20 22 41 23 65 1z m1053 -33 c81 -39 84
        -84 7 -122 -66 -33 -224 -33 -294 -1 -62 29 -75 53 -45 88 55 65 232 84 332
        35z m-161 -268 c89 -4 148 8 249 52 16 7 17 0 17 -92 l0 -101 -32 -25 c-62
        -46 -115 -61 -218 -60 -76 0 -105 5 -145 23 -90 40 -95 49 -95 167 l0 103 66
        -31 c54 -25 82 -32 158 -36z m-139 -325 c39 -17 72 -21 155 -21 103 -1 122 3
        233 49 16 7 17 -2 17 -97 0 -101 -1 -105 -27 -130 -50 -47 -107 -63 -223 -63
        -91 0 -111 3 -150 23 -87 46 -90 52 -90 170 0 95 1 104 18 97 9 -4 40 -17 67
        -28z m-9 -354 c87 -40 213 -44 309 -11 39 14 78 28 88 32 16 8 17 -5 17 -180
        0 -104 -4 -205 -10 -223 -41 -143 -290 -191 -409 -78 -64 61 -71 90 -71 300 0
        103 4 187 9 187 5 0 35 -12 67 -27z"/>
        <path d="M830 2843 c13 -10 47 -36 75 -59 121 -98 330 -252 745 -549 85 -61
        235 -168 333 -239 98 -70 181 -126 184 -123 28 29 -146 164 -787 612 -231 161
        -679 453 -550 358z"/>
        <path d="M3903 2707 c-406 -266 -929 -628 -1028 -713 -45 -38 -101 -112 -78
        -103 11 5 1143 813 1248 892 158 119 135 106 -142 -76z"/>
        <path d="M2750 2029 c-7 -11 -10 -23 -7 -25 2 -2 9 7 15 21 14 30 7 33 -8 4z"/>
        <path d="M2726 1975 c-9 -26 -7 -32 5 -12 6 10 9 21 6 23 -2 3 -7 -2 -11 -11z"/>
        <path d="M1901 4574 c-19 -14 -21 -25 -21 -108 0 -103 8 -120 57 -114 22 2 29
        9 34 33 9 40 9 134 0 164 -9 32 -43 44 -70 25z"/>
        <path d="M2977 4552 c-14 -15 -17 -40 -17 -128 0 -116 6 -134 46 -134 41 0 54
        35 54 147 0 94 -2 103 -22 117 -29 21 -41 20 -61 -2z"/>
        <path d="M1890 4241 c-6 -12 -10 -104 -10 -228 0 -173 3 -212 16 -231 19 -27
        60 -29 74 -3 15 29 14 453 -2 469 -19 19 -66 15 -78 -7z"/>
        <path d="M2976 4114 c-14 -13 -16 -47 -16 -218 0 -219 3 -231 52 -224 40 5 46
        38 48 239 1 159 -2 189 -15 203 -21 20 -49 20 -69 0z"/>
        </g>
        </svg>
}