npm + composer updates + let codex re-design the index page

Author: LordSimal

composer.lock

@@ -36,5 +36,5 @@ export DATABASE_URL="mysql://db:db@db:3306/db"
 # Uncomment these to define logging configuration via environment variables.
 #export LOG_DEBUG_URL="file:///path/to/logs/?levels[]=notice&levels[]=info&levels[]=debug&file=debug"
 #export LOG_ERROR_URL="file:///path/to/logs/?levels[]=warning&levels[]=error&levels[]=critical&levels[]=alert&levels[]=emergency&file=error"
-export APP_FULL_BASE_URL="https://plugins.cakephp.org.ddev.site"
 export DEBUG_KIT_SAFE_TLD="site"
+export APP_FULL_BASE_URL="https://plugins.cakephp.org.ddev.site"

config/.env.ddev

@@ -5,20 +5,20 @@
  * Custom templates for pagination elements.
  */
 return [
-    'nextActive' => '<li class=""><a class="hover:text-cake-red" rel="next" href="{{url}}">{{text}}</a></li>',
-    'nextDisabled' => '<li class="next text-gray-400"><a>{{text}}</a></li>',
-    'prevActive' => '<li class="hover:text-cake-red"><a rel="prev" href="{{url}}">{{text}}</a></li>',
-    'prevDisabled' => '<li class="prev text-gray-400"><a>{{text}}</a></li>',
+    'nextActive' => '<li><a class="inline-flex min-h-10 items-center rounded-full border border-slate-200 bg-slate-50 px-4 text-sm font-medium text-slate-700 transition hover:border-cake-red hover:bg-white hover:text-cake-red" rel="next" href="{{url}}">{{text}}</a></li>',
+    'nextDisabled' => '<li><span class="inline-flex min-h-10 items-center rounded-full border border-slate-200 bg-slate-50 px-4 text-sm font-medium text-slate-400">{{text}}</span></li>',
+    'prevActive' => '<li><a class="inline-flex min-h-10 items-center rounded-full border border-slate-200 bg-slate-50 px-4 text-sm font-medium text-slate-700 transition hover:border-cake-red hover:bg-white hover:text-cake-red" rel="prev" href="{{url}}">{{text}}</a></li>',
+    'prevDisabled' => '<li><span class="inline-flex min-h-10 items-center rounded-full border border-slate-200 bg-slate-50 px-4 text-sm font-medium text-slate-400">{{text}}</span></li>',
     'counterRange' => '{{start}} - {{end}} of {{count}}',
     'counterPages' => '{{page}} of {{pages}}',
-    'first' => '<li class="first"><a class="hover:text-cake-red" href="{{url}}">{{text}}</a></li>',
-    'last' => '<li class="last"><a class="hover:text-cake-red" href="{{url}}">{{text}}</a></li>',
-    'number' => '<li><a class="hover:text-cake-red" href="{{url}}">{{text}}</a></li>',
-    'current' => '<li class="active"><a class="text-cake-red hover:text-red-800" href="">{{text}}</a></li>',
-    'ellipsis' => '<li class="ellipsis">&hellip;</li>',
-    'sort' => '<a class="hover:text-red-800" href="{{url}}">{{text}}</a>',
-    'sortAsc' => "<a class=\"whitespace-nowrap text-red-700 after:text-red-700 after:content-['_↑']\" href=\"{{url}}\">{{text}}</a>",
-    'sortDesc' => "<a class=\"whitespace-nowrap text-red-700 after:text-red-700 after:content-['_↓']\" href=\"{{url}}\">{{text}}</a>",
+    'first' => '<li><a class="inline-flex min-h-10 items-center rounded-full border border-slate-200 bg-slate-50 px-4 text-sm font-medium text-slate-700 transition hover:border-cake-red hover:bg-white hover:text-cake-red" href="{{url}}">{{text}}</a></li>',
+    'last' => '<li><a class="inline-flex min-h-10 items-center rounded-full border border-slate-200 bg-slate-50 px-4 text-sm font-medium text-slate-700 transition hover:border-cake-red hover:bg-white hover:text-cake-red" href="{{url}}">{{text}}</a></li>',
+    'number' => '<li><a class="inline-flex size-10 items-center justify-center rounded-full border border-slate-200 bg-white text-sm font-medium text-slate-700 transition hover:border-cake-red hover:text-cake-red" href="{{url}}">{{text}}</a></li>',
+    'current' => '<li><span class="inline-flex size-10 items-center justify-center rounded-full border border-cake-red bg-cake-red text-sm font-semibold text-white">{{text}}</span></li>',
+    'ellipsis' => '<li><span class="inline-flex size-10 items-center justify-center text-sm text-slate-400">&hellip;</span></li>',
+    'sort' => '<a class="font-medium text-slate-600 transition hover:text-cake-red" href="{{url}}">{{text}}</a>',
+    'sortAsc' => "<a class=\"whitespace-nowrap font-medium text-cake-red after:text-cake-red after:content-['_↑']\" href=\"{{url}}\">{{text}}</a>",
+    'sortDesc' => "<a class=\"whitespace-nowrap font-medium text-cake-red after:text-cake-red after:content-['_↓']\" href=\"{{url}}\">{{text}}</a>",
     'sortAscLocked' => '<a class="asc locked" href="{{url}}">{{text}}</a>',
     'sortDescLocked' => '<a class="desc locked" href="{{url}}">{{text}}</a>',
 ];