2026-08-22 23:42:57 +02:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
|
|
2026-08-22 23:50:21 +02:00
|
|
|
<title>Anagram Finder</title>
|
2026-08-22 23:42:57 +02:00
|
|
|
|
|
|
|
|
<link rel="icon" href="/favicon.ico" sizes="any">
|
|
|
|
|
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
|
|
|
|
|
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
|
|
|
|
|
|
|
|
|
|
@fonts
|
|
|
|
|
|
|
|
|
|
<!-- Styles -->
|
|
|
|
|
<style>
|
|
|
|
|
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-content:""}}}@layer theme{:root,:host{--font-sans:"Instrument Sans", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-serif:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-50:oklch(97.1% .013 17.38);--color-red-100:oklch(93.6% .032 17.717);--color-red-200:oklch(88.5% .062 18.334);--color-red-300:oklch(80.8% .114 19.571);--color-red-400:oklch(70.4% .191 22.216);--color-red-500:oklch(63.7% .237 25.331);--color-red-600:oklch(57.7% .245 27.325);--color-red-700:oklch(50.5% .213 27.518);--color-red-800:oklch(44.4% .177 26.899);--color-red-900:oklch(39.6% .141 25.723);--color-red-950:oklch(25.8% .092 26.042);--color-orange-50:oklch(98% .016 73.684);--color-orange-100:oklch(95.4% .038 75.164);--color-orange-200:oklch(90.1% .076 70.697);--color-orange-300:oklch(83.7% .128 66.29);--color-orange-400:oklch(75% .183 55.934);--color-orange-500:oklch(70.5% .213 47.604);--color-orange-600:oklch(64.6% .222 41.116);--color-orange-700:oklch(55.3% .195 38.402);--color-orange-800:oklch(47% .157 37.304);--color-orange-900:oklch(40.8% .123 38.172);--color-orange-950:oklch(26.6% .079 36.259);--color-amber-50:oklch(98.7% .022 95.277);--color-amber-100:oklch(96.2% .059 95.617);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-300:oklch(87.9% .169 91.605);--color-amber-400:oklch(82.8% .189 84.429);--color-amber-500:oklch(76.9% .188 70.08);--color-amber-600:oklch(66.6% .179 58.318);--color-amber-700:oklch(55.5% .163 48.998);--color-amber-800:oklch(47.3% .137 46.201);--color-amber-900:oklch(41.4% .112 45.904);--color-amber-950:oklch(27.9% .077 45.635);--color-yellow-50:oklch(98.7% .026 102.212);--color-yellow-100:oklch(97.3% .071 103.193);--color-yellow-200:oklch(94.5% .129 101.54);--color-yellow-300:oklch(90.5% .182 98.111);--color-yellow-400:oklch(85.2% .199 91.936);--color-yellow-500:oklch(79.5% .184 86.047);--color-yellow-600:oklch(68.1% .162 75.834);--color-yellow-700:oklch(55.4% .135 66.442);--color-yellow-800:oklch(47.6% .114 61.907);--color-yellow-900:oklch(42.1% .095 57.708);--color-yellow-950:oklch(28.6% .066 53.813);--color-lime-50:oklch(98.6% .031 120.757);--color-lime-100:oklch(96.7% .067 122.328);--color-lime-200:oklch(93.8% .127 124.321);--color-lime-300:oklch(89.7% .196 126.665);--color-lime-400:oklch(84.1% .238 128.85);--color-lime-500:oklch(76.8% .233 130.85);--color-lime-600:oklch(64.8% .2 131.684);--color-lime-700:oklch(53.2% .157 131.589);--color-lime-800:oklch(45.3% .124 130.933);--color-lime-900:oklch(40.5% .101 131.063);--color-lime-950:oklch(27.4% .072 132.109);--color-green-50:oklch(98.2% .018 155.826);--color-green-100:oklch(96.2% .044 156.743);--color-green-200:oklch(92.5% .084 155.995);--color-green-300:oklch(87.1% .15 154.449);--color-green-400:oklch(79.2% .209 151
|
|
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
<body class="bg-[#FDFDFC] dark:bg-[#0a0a0a] text-[#1b1b18] flex p-6 lg:p-8 items-center lg:justify-center min-h-screen flex-col">
|
|
|
|
|
<header class="w-full lg:max-w-4xl max-w-[335px] text-sm mb-6 not-has-[nav]:hidden">
|
|
|
|
|
@if (Route::has('login'))
|
|
|
|
|
<nav class="flex items-center justify-end gap-4">
|
|
|
|
|
@auth
|
|
|
|
|
<a
|
|
|
|
|
href="{{ route('dashboard') }}"
|
|
|
|
|
class="inline-block px-5 py-1.5 dark:text-[#EDEDEC] border-[#19140035] hover:border-[#1915014a] border text-[#1b1b18] dark:border-[#3E3E3A] dark:hover:border-[#62605b] rounded-sm text-sm leading-normal"
|
|
|
|
|
>
|
|
|
|
|
Dashboard
|
|
|
|
|
</a>
|
|
|
|
|
@else
|
|
|
|
|
<a
|
|
|
|
|
href="{{ route('login') }}"
|
|
|
|
|
class="inline-block px-5 py-1.5 dark:text-[#EDEDEC] text-[#1b1b18] border border-transparent hover:border-[#19140035] dark:hover:border-[#3E3E3A] rounded-sm text-sm leading-normal"
|
|
|
|
|
>
|
|
|
|
|
Log in
|
|
|
|
|
</a>
|
|
|
|
|
|
|
|
|
|
@if (Route::has('register'))
|
|
|
|
|
<a
|
|
|
|
|
href="{{ route('register') }}"
|
|
|
|
|
class="inline-block px-5 py-1.5 dark:text-[#EDEDEC] border-[#19140035] hover:border-[#1915014a] border text-[#1b1b18] dark:border-[#3E3E3A] dark:hover:border-[#62605b] rounded-sm text-sm leading-normal">
|
|
|
|
|
Register
|
|
|
|
|
</a>
|
|
|
|
|
@endif
|
|
|
|
|
@endauth
|
|
|
|
|
</nav>
|
|
|
|
|
@endif
|
|
|
|
|
</header>
|
|
|
|
|
<div class="flex items-center justify-center w-full transition-opacity opacity-100 duration-750 lg:grow starting:opacity-0">
|
|
|
|
|
<main class="flex max-w-[335px] w-full flex-col-reverse lg:max-w-4xl lg:flex-row">
|
|
|
|
|
<div class="text-[13px] leading-[20px] flex-1 p-6 pb-12 lg:p-20 bg-white dark:bg-[#161615] dark:text-[#EDEDEC] shadow-[inset_0px_0px_0px_1px_rgba(26,26,0,0.16)] dark:shadow-[inset_0px_0px_0px_1px_#fffaed2d] rounded-es-lg rounded-ee-lg lg:rounded-ss-lg lg:rounded-ee-none">
|
2026-08-23 10:04:08 +02:00
|
|
|
<h1 class="mb-1 font-medium">Anagram Finder</h1>
|
|
|
|
|
<p class="mb-4 text-[#706f6c] dark:text-[#A1A09A]">Enter your letters to find every word that fits.</p>
|
|
|
|
|
|
|
|
|
|
<form method="POST" action="{{ route('find') }}" class="flex flex-col gap-4">
|
|
|
|
|
@csrf
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-col gap-1.5">
|
|
|
|
|
<label for="anagram" class="font-medium">Letters</label>
|
|
|
|
|
<input
|
|
|
|
|
id="anagram"
|
|
|
|
|
name="anagram"
|
|
|
|
|
type="text"
|
|
|
|
|
value="{{ old('anagram', $anagram ?? '') }}"
|
|
|
|
|
placeholder="eamstoxil"
|
|
|
|
|
autocomplete="off"
|
|
|
|
|
autofocus
|
|
|
|
|
required
|
|
|
|
|
class="w-full px-3 py-2 rounded-sm bg-white dark:bg-[#161615] text-[#1b1b18] dark:text-[#EDEDEC] border border-[#19140035] dark:border-[#3E3E3A] hover:border-[#1915014a] dark:hover:border-[#62605b] focus:outline-none focus:border-[#1b1b18] dark:focus:border-[#EDEDEC]"
|
|
|
|
|
>
|
|
|
|
|
@error('anagram')
|
|
|
|
|
<p class="text-[#f53003] dark:text-[#FF4433]">{{ $message }}</p>
|
|
|
|
|
@enderror
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<button
|
|
|
|
|
type="submit"
|
|
|
|
|
class="inline-block px-5 py-1.5 self-start rounded-sm text-sm leading-normal cursor-pointer bg-[#1b1b18] dark:bg-[#eeeeec] text-white dark:text-[#1C1C1A] border border-black border-transparent hover:bg-black dark:hover:bg-white"
|
|
|
|
|
>
|
|
|
|
|
Find words
|
|
|
|
|
</button>
|
|
|
|
|
</form>
|
|
|
|
|
@isset($matches)
|
|
|
|
|
<div>
|
|
|
|
|
<ul>
|
|
|
|
|
@foreach($matches as $match)
|
|
|
|
|
<li>{{ $match }} ({{ strlen($match) }})</li>
|
|
|
|
|
@endforeach
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
@endisset
|
2026-08-22 23:42:57 +02:00
|
|
|
</div>
|
|
|
|
|
</main>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
@if (Route::has('login'))
|
|
|
|
|
<div class="h-14.5 hidden lg:block"></div>
|
|
|
|
|
@endif
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
