adaptive width on large

Cargo.toml

@@ -11,7 +11,7 @@ axum = { version = "0.7", optional = true }
 jsonwebtoken = { version = "9", optional = true }
 tokio = { version = "1.39", features = ["rt-multi-thread"], optional = true }
 tower = { version = "0.4", optional = true }
-tower-http = { version = "0.5", features = ["fs", "trace"], optional = true }
+tower-http = { version = "0.5", features = ["fs", "trace", "cors"], optional = true }
 sqlx = { version = "0.8", features = [
     "runtime-tokio-rustls",
     "sqlite",

src/routes/link.rs

@@ -110,17 +110,15 @@ fn Link<T: 'static + Clone, S: 'static>(
     links: Resource<T, S>,
 ) -> impl IntoView {
     view! {
-        <li class="mx-auto w-44 lg:w-60">
+        <li class="w-44 lg:w-fit">
-            <a class="bg-prim-light w-full hover:bg-prim-lightest border-b hover:border-third border-transparent text-xl rounded-lg text-center hover:text-third transition-colors px-5 py-4 inline-block"
+            <a class="bg-prim-light container flex flex-col lg:gap-2 lg:flex-row w-full item-center hover:scale-110 transition hover:bg-prim-lightest border-b hover:border-third border-transparent rounded-lg text-center hover:text-third px-5 py-4"
                 target="_blank"
                 href={move || link.with(|x| x.link.to_string())}>
-                <div class="flex justify-center mb-2">
+                <img src={move || link.with(|x| x.icon.to_string())}
-                    <img src={move || link.with(|x| x.icon.to_string())}
+                     alt={move || link.with(|x| x.name.to_string())}
-                         alt={move || link.with(|x| x.name.to_string())}
+                     class="size-32 lg:size-10 object-cover overflow-hidden" />
-                         class="block size-32 lg:size-54 object-cover overflow-hidden" />
-                </div>
 
-                <span>{move || link.with(|x| x.name.to_string())}</span>
+                <span class="flex-1 text-2xl mt-2 lg:mt-0 flex justify-center items-center">{move || link.with(|x| x.name.to_string())}</span>
             </a>
             {move || {
                 edit.get().then(|| {

src/setup.rs

@@ -21,10 +21,16 @@ pub async fn init_app(configuration_path: Option<&str>) {
     let leptos_options = conf.leptos_options;
     let serve_dir = tower_http::services::ServeDir::new(&leptos_options.site_root)
         .append_index_html_on_directories(false);
+
+    let cors = tower_http::cors::CorsLayer::new()
+        .allow_methods([axum::http::Method::GET, axum::http::Method::POST])
+        .allow_origin(tower_http::cors::Any);
+
     logging::log!("listening on http://{}", &addr);
     let app = axum::Router::new()
         .leptos_routes(&leptos_options, routes, || view! { <App/> })
         .fallback_service(serve_dir)
+        .layer(cors)
         .layer(
             tower_http::trace::TraceLayer::new_for_http()
                 .make_span_with(