A world-class math input for the web
pulljosh.com
1<header
2 class="bg-stone-200/50 backdrop-blur-lg border-b border-stone-300 sticky top-0"
3>
4 <div class="max-w-4xl mx-auto px-8 h-16 flex items-center">
5 <a
6 href="/"
7 class="hover:bg-stone-300/50 active:bg-stone-300/75 group px-2 py-2 rounded -mx-2 -my-2"
8 >
9 <h1 class="text-stone-800 font-medium text-3xl flex">
10 <svg
11 class="w-5 mr-1 h-full self-stretch object-contain group-hover:animate-hop"
12 width="100%"
13 height="100%"
14 viewBox="0 0 111 70"
15 version="1.1"
16 xmlns="http://www.w3.org/2000/svg"
17 style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"
18 >
19 <g transform="matrix(1,0,0,1,-101,-685.832)">
20 <g
21 transform="matrix(0.627657,-0.627657,0.807107,0.807107,31.3091,711.917)"
22 >
23 <path
24 d="M120,61L118.407,81L31,77.283L31,62.239L120,61Z"
25 style="fill:rgb(243,152,62);"></path>
26 </g>
27 <g
28 transform="matrix(-0.627657,-0.627657,-0.807107,0.807107,280.694,711.917)"
29 >
30 <path
31 d="M120,61L118.407,81L31,77.283L31,62.239L120,61Z"
32 style="fill:rgb(243,152,62);"></path>
33 </g>
34 </g>
35 </svg>
36 <span class="-mt-[0.26em] -mb-[0.2em]">Caret</span>
37 </h1>
38 </a>
39 </div>
40</header>