/sublet

frontend/styles/main.css

@@ -11,6 +11,7 @@
 @import "./dashboard.css";
 @import "./error.css";
 @import "./message.css";
+@import "./sublet.css";
 
 /* Events */
 @import "./events/edit.css";

frontend/styles/sublet.css

@@ -0,0 +1,71 @@
+#sublet {
+  @apply mx-auto w-full max-w-3xl px-6 py-8;
+
+  header {
+    @apply mb-8;
+
+    h1 {
+      @apply mb-4 text-3xl font-bold tracking-tight md:text-4xl;
+    }
+
+    .intro {
+      @apply mb-6 leading-relaxed;
+    }
+  }
+
+  .apply {
+    @apply bg-lsd-charcoal inline-flex cursor-pointer items-center justify-between gap-4 rounded-lg px-6 py-4 transition-colors;
+    &:hover {
+      @apply bg-lsd-white/20;
+    }
+  }
+
+  .content {
+    @apply flex flex-col gap-10;
+  }
+
+  .section {
+    h2 {
+      @apply border-lsd-white/20 mb-4 border-b pb-2 text-xl font-bold tracking-wide;
+    }
+
+    ul {
+      @apply flex flex-col gap-2;
+    }
+
+    li {
+      @apply relative pl-5;
+      &::before {
+        @apply text-lsd-gray absolute left-0;
+        content: "\2022";
+      }
+    }
+  }
+
+  .photos {
+    @apply w-full;
+
+    img {
+      @apply h-auto w-full rounded-sm;
+    }
+
+    &.single {
+      img {
+        aspect-ratio: 16 / 10;
+        object-fit: cover;
+      }
+    }
+
+    &.pair {
+      @apply grid grid-cols-2 gap-4;
+      img {
+        aspect-ratio: 4 / 3;
+        object-fit: cover;
+      }
+    }
+  }
+
+  .cta {
+    @apply border-lsd-white/20 flex flex-col items-center gap-6 border-t pt-10 text-center;
+  }
+}

frontend/templates/sublet.html

@@ -0,0 +1,119 @@
+{% extends "layout.html" %}
+
+{% block title %}Studios for Sublet - light and sound{% endblock title %}
+
+{% block content %}
+  <section id="sublet">
+    <header>
+      <h1>Studios for Sublet</h1>
+      <p class="intro">
+        Flexible, light-filled studio spaces in the heart of Greenpoint. Ideal
+        for artists, photographers, sound designers, wellness practitioners, and
+        small creative teams.
+      </p>
+      <a
+        class="apply"
+        href="https://app.smartsheet.com/b/form/cc435bbb705c4d389f6dd041054bed0d"
+        target="_blank"
+      >
+        <span>Apply Now</span>
+        <span>&rarr;</span>
+      </a>
+    </header>
+
+    <div class="content">
+      <div class="section">
+        <h2>The Space</h2>
+        <ul>
+          <li>Turnkey sublets or buildout</li>
+          <li>
+            Use as separate work areas or combine into a single larger studio
+          </li>
+          <li>Studios can be combined or modified within reason</li>
+          <li>Big south-facing windows with excellent natural light</li>
+          <li>Roof access</li>
+          <li>Work outside with skyline views</li>
+          <li>Plant plants</li>
+          <li>Make a (temporary, small) mess</li>
+          <li>Giant bathroom with utility sink</li>
+          <li>Shared kitchen & storage</li>
+          <li>2nd-floor walk-up</li>
+        </ul>
+      </div>
+
+      <div class="photos single">
+        <img src="/static/sublet/1.jpg" alt="Studio space" loading="lazy" />
+      </div>
+
+      <div class="photos single">
+        <img src="/static/sublet/2.jpg" alt="Studio space" loading="lazy" />
+      </div>
+
+      <div class="section">
+        <h2>The Building</h2>
+        <ul>
+          <li>
+            Vibrant, active community of photographers, sound artists, lighting
+            designers, and other creatives
+          </li>
+          <li>Licensed massage therapists and acupuncturists onsite</li>
+          <li>
+            Free or reduced entry to weekly dinners, music, and dance events
+            upstairs
+          </li>
+        </ul>
+      </div>
+
+      <div class="photos single">
+        <img src="/static/sublet/3.jpg" alt="Studio space" loading="lazy" />
+      </div>
+
+      <div class="photos single">
+        <img src="/static/sublet/6.jpg" alt="Studio space" loading="lazy" />
+      </div>
+
+      <div class="section">
+        <h2>The Location</h2>
+        <ul>
+          <li>
+            2 blocks from the Greenpoint G and Manhattan Ave restaurants and
+            cafes
+          </li>
+          <li>5 minutes to the Newtown Creek Nature Walk</li>
+        </ul>
+      </div>
+
+      <div class="photos single">
+        <img src="/static/sublet/7.jpg" alt="Studio space" loading="lazy" />
+      </div>
+
+      <div class="photos single">
+        <img src="/static/sublet/8.jpg" alt="Studio space" loading="lazy" />
+      </div>
+
+      <div class="section">
+        <h2>Availability & Pricing</h2>
+        <ul>
+          <li>9 studios available</li>
+          <li>Feb 1 move-in (some flex here)</li>
+          <li>$500&ndash;$1,500 per month, utilities included</li>
+        </ul>
+      </div>
+
+      <div class="cta">
+        <p>
+          If you're looking for a flexible & creative home base in Greenpoint,
+          this is it.
+        </p>
+        <a
+          class="apply"
+          href="https://app.smartsheet.com/b/form/cc435bbb705c4d389f6dd041054bed0d"
+          target="_blank"
+        >
+          <span>Apply Now</span>
+          <span>&rarr;</span>
+        </a>
+      </div>
+    </div>
+  </section>
+{% endblock content %}

src/app/home.rs

@@ -4,7 +4,11 @@ use crate::prelude::*;
 /// Add all `home` routes to the router.
 pub fn add_routes(router: AppRouter) -> AppRouter {
     router
-        .public_routes(|r| r.route("/", get(home_page)).route("/past", get(past_page)))
+        .public_routes(|r| {
+            r.route("/", get(home_page))
+                .route("/past", get(past_page))
+                .route("/sublet", get(sublet_page))
+        })
         // TODO: Rethink roles, not WRITER. Template out buttons based on role.
         .restricted_routes(User::WRITER, |r| r.route("/dashboard", get(dashboard_page)))
 }
@@ -35,3 +39,13 @@ async fn past_page(user: Option<User>, State(state): State<SharedAppState>) -> H
 async fn dashboard_page(user: User) -> HtmlResult {
     Ok(DashboardHtml { user: Some(user) }.into_response())
 }
+
+#[derive(Template, WebTemplate)]
+#[template(path = "sublet.html")]
+struct SubletHtml {
+    user: Option<User>,
+}
+
+async fn sublet_page(user: Option<User>) -> HtmlResult {
+    Ok(SubletHtml { user }.into_response())
+}