From 7bfd3322230584aa5f52e2fc7fd3e96e30122480 Mon Sep 17 00:00:00 2001 From: myrmidex Date: Sun, 23 Aug 2026 14:45:29 +0200 Subject: [PATCH] Update styling --- .env.example | 2 +- resources/css/app.css | 44 ++++++++++ resources/fonts/7segment.woff | Bin 0 -> 1952 bytes resources/views/index.blade.php | 141 +++++++++++++------------------- 4 files changed, 104 insertions(+), 83 deletions(-) create mode 100644 resources/fonts/7segment.woff diff --git a/.env.example b/.env.example index 40bb13b..808d764 100644 --- a/.env.example +++ b/.env.example @@ -1,4 +1,4 @@ -APP_NAME=Laravel +APP_NAME="Anagram Finder" APP_ENV=local APP_KEY= APP_DEBUG=true diff --git a/resources/css/app.css b/resources/css/app.css index ad6eeed..07106f9 100644 --- a/resources/css/app.css +++ b/resources/css/app.css @@ -8,6 +8,50 @@ @custom-variant dark (&:where(.dark, .dark *)); +@font-face { + font-family: '7Segment'; + /* Relative so Vite resolves and fingerprints it; an absolute /fonts path + 404s against the dev server, which serves assets itself. */ + src: url('../fonts/7segment.woff') format('woff'); + font-weight: normal; + font-style: normal; +} + +.font-digital { + font-family: '7Segment', monospace; +} + +.glow-red { + box-shadow: 0 0 20px rgba(239, 68, 68, 0.4); + transition: box-shadow 300ms ease; +} + +.glow-red:hover { + box-shadow: 0 0 25px rgba(239, 68, 68, 0.6); +} + +.scrollbar-red { + scrollbar-width: thin; + scrollbar-color: var(--color-red-500) transparent; +} + +.scrollbar-red::-webkit-scrollbar { + width: 10px; +} + +.scrollbar-red::-webkit-scrollbar-track { + background: transparent; +} + +.scrollbar-red::-webkit-scrollbar-thumb { + background: var(--color-red-500); + border: 2px solid #000; +} + +.scrollbar-red::-webkit-scrollbar-thumb:hover { + background: var(--color-red-400); +} + @theme { --font-sans: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; diff --git a/resources/fonts/7segment.woff b/resources/fonts/7segment.woff new file mode 100644 index 0000000000000000000000000000000000000000..09ab3150d27946e0bf9697bc3badd40827c7d5ae GIT binary patch literal 1952 zcmZuydpy+J7T>>z5sgQV@_ytsp2rB24vFD73fCiwaLpLQkjEH@4NT@uD#aY>$le0pPlOM<^~V| zo3sGPOGd?NN&o+v_fgAz0ARP_8X4l4OdmSVh@-OsKz{%LA;NJU=pI>Oq;PcsAk0G@ zRS7T?;1bD>ii2n1kn2ex>X-mr zk|9n4-murN$afeW@F%0mj?BmoRNh zOUjw|b1NI)q-YTys;LrEgIh#PO=k|ZYousOt;)%a?Mu{ZjuXg^B~6H0{P%JyR;v9r z{DOZu*wwtT@^!#r%^MH9{OoN36Zh!f^ntdu=FY(=x`j|fPhP2TIJrRI)g3-iIFg_FTpTsb(06_LX4TrG+ z=Pig?M51_cpChd*(mW!M{(;fMWYdjlJyNyF=N(jZ`kLEOd7S=F#eKenf>9lD!rXY^-%(MpBFE};<5fT7j3QN)-#Flj>O_@V1xeX%E# z$t1ESUj_reIS`s)K47MRGVBpR*v<|LP{7-kQo#;5Cj;qih5!t%%R=@imssruw!j0> z0T)~bWuO+k0R3PVY$9^VUc?S@Lug1UQh<~pb;vX16*7-(p}SBWl#IHffoLq6juxP$ zXdT*)4xsZGz~nJK>;QHI3&divbSxJu!|r2^*b7XAO<~J8jw|5mxEW5topDe6IL^XZ zlHBJPBM}cdUN8^I91Aqt?Hdt+5E;_`9V|>S7AR7jYAVS& zllL)I;BEyX1OU|Rsr@%|rEYaebBVp)B3>1r8$Tn1e`23soU(N=7C0x*R3g{@ZoDom`+FhQUz$Dhz30k))$AnoG=4_&l8M0ddGVHta&OSt=C8u8Jxe>~ z!Jo~`;_82KqHYNqoN`PngEekZb#5M9rTltnYWZ+~W3Cc^R!-Tgsx2a*rj_Pm7?3$; zo4SAVBB|f=*6WH{JVV~;U__JSx^_TcdeszX#-sIUQ$fYN#X&-OmTH*Tgpi}19drLC z#dYo7fPO;7>9y7tt?{{G*1r^whc_AM^o~Rw4(Q#o*&G}hRi3ok^1StADMdrK)bCnH zk$zym{OS88+>d>4W}KG`9gPlO7$Vy8;~fM39q*@^U90M zC|6FBzt2{AnR7Zme$j|zTV9>PHU8rnw^F08!E`L~je1FQCz#ER)HCmYPg$#%-F&mteKqBy!A96(o19>B%ivYtgL@s; zv!^Ny+ZW{a#LVAo<907`ItAK)q@8^m!p(2fVybVzQl|mA?fbCZiPvD&>x)NffH`=K zeK|C-)6t>^F|Pq;HOLm(%Ay99%pKuOQj=PpQoCH76|tUfmY#KD@4|-h#p0t^kMio* zZjFh3ys`cRi%*w3Pgz;2Z(;d1tkoNzaw;YSqwzidNsHf(Hk4i;^c$fl?9Y80H15Tt pUeq6{?^!qzt(GUdw;OsRx#N+vH8JV#yci)!5#VE&W{(TOe*s8D?%MzW literal 0 HcmV?d00001 diff --git a/resources/views/index.blade.php b/resources/views/index.blade.php index 8aced73..c6117d6 100644 --- a/resources/views/index.blade.php +++ b/resources/views/index.blade.php @@ -3,99 +3,76 @@ + - Anagram Finder + {{ config('app.name', 'Anagram Finder') }} - @fonts - - - + @vite(['resources/css/app.css']) - -
- @if (Route::has('login')) - - @endif -
-
-
-
-

Anagram Finder

-

Enter your letters to find every word that fits.

+
+ @csrf - - @csrf + + + @error('anagram') +

{{ $message }}

+ @enderror -
- - - @error('anagram') -

{{ $message }}

- @enderror -
+ +
- - - @isset($matches) -
-
    - @foreach($matches as $match) -
  • {{ $match }} ({{ strlen($match) }})
    • - @endforeach + @isset($matches) +
    +

    + > {{ count($matches) }} {{ Str::plural('match', count($matches)) }} +

    + + @if (count($matches)) +
      + @foreach ($matches as $match) +
    • + {{ $match }} + {{ strlen($match) }} +
      • + @endforeach
    -
- @endisset -
-
-
- - @if (Route::has('login')) - - @endif + @else +

+ No words found. +

+ @endif + + @endisset +