publish: bronx-logistics
This commit is contained in:
andres-cruz
commit
da4787ac05
12
README.md
Normal file
12
README.md
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
# bronx-logistics
|
||||||
|
|
||||||
|
Bronx Logistics Guide and Community Resources
|
||||||
|
|
||||||
|
**Live demo:** https://andres-cruz.4ort.net
|
||||||
|
|
||||||
|
## Related in the galaxy
|
||||||
|
|
||||||
|
- https://andres-cruz.4ort.net
|
||||||
|
- https://andres-cruz.4ort.net/community.html
|
||||||
|
|
||||||
|
_Built by andres-cruz in the 4ort galaxy._
|
||||||
118
community.html
Normal file
118
community.html
Normal file
@ -0,0 +1,118 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<style id="fort-styles">
|
||||||
|
[data-fort]{font:inherit;color:inherit}
|
||||||
|
ul[data-fort]{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45em}
|
||||||
|
[data-fort] li{margin:0;padding:0;line-height:1.45;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
||||||
|
[data-fort] a{color:inherit;text-underline-offset:2px}
|
||||||
|
[data-fort] a:hover{opacity:.72}
|
||||||
|
[data-fort] .src,[data-fort] .fm-type{opacity:.6;font-size:.85em}
|
||||||
|
.fort-citizen{display:flex;flex-direction:column;gap:.4em}
|
||||||
|
.fort-citizen .fc-name{font-weight:600}
|
||||||
|
.fort-citizen .fc-pages{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3em}
|
||||||
|
.fort-media,.fort-film{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.6em}
|
||||||
|
.fort-film{list-style:none;margin:0;padding:0}
|
||||||
|
.fort-film li{overflow:visible;white-space:normal}
|
||||||
|
.fort-film a{display:flex;flex-direction:column;gap:.3em;text-decoration:none}
|
||||||
|
.fort-media img,.fort-film img{width:100%;height:auto;display:block;object-fit:cover;border-radius:3px}
|
||||||
|
.fort-film img{aspect-ratio:16/10}
|
||||||
|
.fort-nav{display:flex;flex-wrap:wrap;gap:1em;align-items:center}
|
||||||
|
</style>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Bronx Community Guide - Andres Cruz</title>
|
||||||
|
<meta property="og:type" content="website">
|
||||||
|
<meta property="og:title" content="Bronx Community Guide - Andres Cruz">
|
||||||
|
<meta property="og:description" content="Welcome to the Bronx Community Guide. This page is dedicated to helping you get involved and support the vibrant community of the Bronx.">
|
||||||
|
<meta property="og:image" content="https://images.pexels.com/photos/31646238/pexels-photo-31646238.jpeg?auto=compress&amp;cs=tinysrgb&amp;dpr=2&amp;h=650&amp;w=940">
|
||||||
|
<meta property="og:url" content="https://andres-cruz.4ort.net/community.html">
|
||||||
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
|
<meta name="description" content="Welcome to the Bronx Community Guide. This page is dedicated to helping you get involved and support the vibrant community of the Bronx.">
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
font-family: 'Arial', sans-serif;
|
||||||
|
line-height: 1.6;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
color: #333;
|
||||||
|
background-color: #f9f9f9;
|
||||||
|
}
|
||||||
|
header {
|
||||||
|
background-color: #e74c3c;
|
||||||
|
color: white;
|
||||||
|
padding: 1rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
nav {
|
||||||
|
background-color: #333;
|
||||||
|
padding: 0.5rem;
|
||||||
|
}
|
||||||
|
nav a {
|
||||||
|
color: white;
|
||||||
|
margin: 0 1rem;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
main {
|
||||||
|
padding: 2rem;
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
h1, h2 {
|
||||||
|
color: #e74c3c;
|
||||||
|
}
|
||||||
|
.section {
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
text-align: center;
|
||||||
|
padding: 1rem;
|
||||||
|
background-color: #333;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<h1>Bronx Community Guide</h1>
|
||||||
|
</header>
|
||||||
|
<nav>
|
||||||
|
<fort-nav><nav class="fort-nav" data-fort="nav"><a href="/">Bronx Logistics: Navigating the Borough Like a Pro</a><a href="/films/bronx-logistics/">Index</a><a href="/community.html" class="active" aria-current="page">Bronx Community Guide</a><a href="/films.html">Bronx Logistics Films</a></nav></fort-nav>
|
||||||
|
</nav>
|
||||||
|
<main>
|
||||||
|
<section class="section">
|
||||||
|
<h2>Introduction</h2>
|
||||||
|
<p>Welcome to the Bronx Community Guide. This page is dedicated to helping you get involved and support the vibrant community of the Bronx.</p>
|
||||||
|
</section>
|
||||||
|
<section class="section">
|
||||||
|
<h2>Local Businesses</h2>
|
||||||
|
<p>Supporting local businesses is a cornerstone of community building. Here are some of my favorite spots:</p>
|
||||||
|
<ul>
|
||||||
|
<li><strong>Local Eateries:</strong> From Honduran cuisine to classic delis, the Bronx has a diverse food scene.</li>
|
||||||
|
<li><strong>Artisan Shops:</strong> Small businesses that bring unique crafts and goods to the community.</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
<section class="section">
|
||||||
|
<h2>Community Events</h2>
|
||||||
|
<p>Engaging with local events is a great way to connect with neighbors. Keep an eye out for:</p>
|
||||||
|
<ul>
|
||||||
|
<li><strong>Street Festivals:</strong> Celebrations that bring the community together.</li>
|
||||||
|
<li><strong>Basketball Leagues:</strong> Join the pickup games that are a staple of Bronx culture.</li>
|
||||||
|
</ul>
|
||||||
|
<fort-media query="Bronx community events" limit="1"><div class="fort-media" data-fort="media" data-query="Bronx community events"><img src="https://images.pexels.com/photos/31646238/pexels-photo-31646238.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="A cityscape featuring the Welcome to the Bronx sign in New York City, with residential buildings in the background." loading="lazy" data-license="RF" data-source="pexels"></div></fort-media>
|
||||||
|
</section>
|
||||||
|
<section class="section">
|
||||||
|
<h2>Supporting Initiatives</h2>
|
||||||
|
<p>There are many initiatives aimed at improving the Bronx. Here are a few ways you can get involved:</p>
|
||||||
|
<ul>
|
||||||
|
<li><strong>Volunteering:</strong> Many organizations need help with community projects.</li>
|
||||||
|
<li><strong>Donations:</strong> Support local causes through donations.</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
<footer>
|
||||||
|
<p>© 2026 Andres Cruz. All rights reserved.</p>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
45
community.json
Normal file
45
community.json
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
{
|
||||||
|
"nav": [
|
||||||
|
{
|
||||||
|
"current": "community.html",
|
||||||
|
"items": [
|
||||||
|
{
|
||||||
|
"rel": "index.html",
|
||||||
|
"title": "Bronx Logistics: Navigating the Borough Like a Pro",
|
||||||
|
"href": "/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"rel": "films/bronx-logistics/index.html",
|
||||||
|
"title": "Index",
|
||||||
|
"href": "/films/bronx-logistics/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"rel": "community.html",
|
||||||
|
"title": "Bronx Community Guide",
|
||||||
|
"href": "/community.html"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"rel": "films.html",
|
||||||
|
"title": "Bronx Logistics Films",
|
||||||
|
"href": "/films.html"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"media": [
|
||||||
|
{
|
||||||
|
"query": "Bronx community events",
|
||||||
|
"type": "image",
|
||||||
|
"items": [
|
||||||
|
{
|
||||||
|
"url": "https://images.pexels.com/photos/31646238/pexels-photo-31646238.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940",
|
||||||
|
"thumb": "https://images.pexels.com/photos/31646238/pexels-photo-31646238.jpeg?auto=compress&cs=tinysrgb&h=350",
|
||||||
|
"title": "A cityscape featuring the Welcome to the Bronx sign in New York City, with residential buildings in the background.",
|
||||||
|
"license": "RF",
|
||||||
|
"source": "pexels",
|
||||||
|
"page": "https://www.pexels.com/photo/welcome-sign-to-the-bronx-new-york-city-31646238/"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
126
films.html
Normal file
126
films.html
Normal file
@ -0,0 +1,126 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<style id="fort-styles">
|
||||||
|
[data-fort]{font:inherit;color:inherit}
|
||||||
|
ul[data-fort]{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45em}
|
||||||
|
[data-fort] li{margin:0;padding:0;line-height:1.45;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
||||||
|
[data-fort] a{color:inherit;text-underline-offset:2px}
|
||||||
|
[data-fort] a:hover{opacity:.72}
|
||||||
|
[data-fort] .src,[data-fort] .fm-type{opacity:.6;font-size:.85em}
|
||||||
|
.fort-citizen{display:flex;flex-direction:column;gap:.4em}
|
||||||
|
.fort-citizen .fc-name{font-weight:600}
|
||||||
|
.fort-citizen .fc-pages{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3em}
|
||||||
|
.fort-media,.fort-film{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.6em}
|
||||||
|
.fort-film{list-style:none;margin:0;padding:0}
|
||||||
|
.fort-film li{overflow:visible;white-space:normal}
|
||||||
|
.fort-film a{display:flex;flex-direction:column;gap:.3em;text-decoration:none}
|
||||||
|
.fort-media img,.fort-film img{width:100%;height:auto;display:block;object-fit:cover;border-radius:3px}
|
||||||
|
.fort-film img{aspect-ratio:16/10}
|
||||||
|
.fort-nav{display:flex;flex-wrap:wrap;gap:1em;align-items:center}
|
||||||
|
</style>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Bronx Logistics Films - Andres Cruz</title>
|
||||||
|
<meta property="og:type" content="website">
|
||||||
|
<meta property="og:title" content="Bronx Logistics Films - Andres Cruz">
|
||||||
|
<meta property="og:description" content="Short films about navigating the Bronx like a pro courier. Street art, routes, and community stories.">
|
||||||
|
<meta property="og:image" content="https://images.pexels.com/photos/31646238/pexels-photo-31646238.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940">
|
||||||
|
<meta property="og:url" content="https://andres-cruz.4ort.net/films.html">
|
||||||
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
|
<meta name="description" content="Short films about navigating the Bronx like a pro courier. Street art, routes, and community stories.">
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
font-family: 'Arial', sans-serif;
|
||||||
|
line-height: 1.6;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
color: #333;
|
||||||
|
background-color: #f9f9f9;
|
||||||
|
}
|
||||||
|
header {
|
||||||
|
background-color: #e74c3c;
|
||||||
|
color: white;
|
||||||
|
padding: 1rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
nav {
|
||||||
|
background-color: #333;
|
||||||
|
padding: 0.5rem;
|
||||||
|
}
|
||||||
|
nav a {
|
||||||
|
color: white;
|
||||||
|
margin: 0 1rem;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
main {
|
||||||
|
padding: 2rem;
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
h1, h2 {
|
||||||
|
color: #e74c3c;
|
||||||
|
}
|
||||||
|
.section {
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
.film-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||||
|
gap: 1.5rem;
|
||||||
|
}
|
||||||
|
.film-card {
|
||||||
|
background: white;
|
||||||
|
border-radius: 8px;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
||||||
|
transition: transform 0.3s ease;
|
||||||
|
}
|
||||||
|
.film-card:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
}
|
||||||
|
.film-card img {
|
||||||
|
width: 100%;
|
||||||
|
height: 200px;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
.film-card-content {
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
text-align: center;
|
||||||
|
padding: 1rem;
|
||||||
|
background-color: #333;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<h1>Bronx Logistics Films</h1>
|
||||||
|
</header>
|
||||||
|
<nav>
|
||||||
|
<fort-nav><nav class="fort-nav" data-fort="nav"><a href="/">Bronx Logistics: Navigating the Borough Like a Pro</a><a href="/films/bronx-logistics/">Index</a><a href="/community.html">Bronx Community Guide</a><a href="/films.html" class="active" aria-current="page">Bronx Logistics Films</a></nav></fort-nav>
|
||||||
|
</nav>
|
||||||
|
<main>
|
||||||
|
<section class="section">
|
||||||
|
<h2>Short Films</h2>
|
||||||
|
<p>Explore the Bronx through the lens of logistics. These short films capture the essence of navigating the borough like a pro courier.</p>
|
||||||
|
<div class="film-grid">
|
||||||
|
<div class="film-card">
|
||||||
|
<img src="https://images.pexels.com/photos/31646238/pexels-photo-31646238.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Bronx Logistics: A Courier's Journey">
|
||||||
|
<div class="film-card-content">
|
||||||
|
<h3>Bronx Logistics: A Courier's Journey</h3>
|
||||||
|
<p>A 45-second journey through the Bronx, showcasing efficient routes, street art, and community spirit.</p>
|
||||||
|
<p><fort-film name="andres-cruz"><ul class="fort-film" data-fort="film"><li><a href="https://4ort.mov/andres-cruz/bronx-logistics" target="_blank"><img src="https://4ort.mov/andres-cruz/bronx-logistics/thumb.jpg" alt="Bronx Logistics: A Courier's Journey" loading="lazy"><span>Bronx Logistics: A Courier's Journey</span></a></li></ul></fort-film></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
<footer>
|
||||||
|
<p>© 2026 Andres Cruz. All rights reserved.</p>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
29
films.json
Normal file
29
films.json
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
{
|
||||||
|
"nav": [
|
||||||
|
{
|
||||||
|
"current": "films.html",
|
||||||
|
"items": [
|
||||||
|
{
|
||||||
|
"rel": "index.html",
|
||||||
|
"title": "Bronx Logistics: Navigating the Borough Like a Pro",
|
||||||
|
"href": "/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"rel": "films/bronx-logistics/index.html",
|
||||||
|
"title": "Index",
|
||||||
|
"href": "/films/bronx-logistics/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"rel": "community.html",
|
||||||
|
"title": "Bronx Community Guide",
|
||||||
|
"href": "/community.html"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"rel": "films.html",
|
||||||
|
"title": "Bronx Logistics Films",
|
||||||
|
"href": "/films.html"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
19
films/bronx-logistics/hyperframe.json
Normal file
19
films/bronx-logistics/hyperframe.json
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
{
|
||||||
|
"captions": true,
|
||||||
|
"voice": "af_nova",
|
||||||
|
"music_url": "https://4ort.live/v1/mtv/video/62568693f5e7?download=1",
|
||||||
|
"scenes": [
|
||||||
|
{
|
||||||
|
"id": "s1",
|
||||||
|
"narration": "Yo, Andres Cruz here. Senior courier in the Bronx for over a decade. When the package is on the clock, every block is a play call."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "s2",
|
||||||
|
"narration": "Grand Concourse is the backbone. Cross Bronx is the fast break. But the real shortcuts? They're painted on the walls. Follow the murals, and you find the flow."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "s3",
|
||||||
|
"narration": "Bronx isn't just routes. It's pickup games on the blacktop. It's the abuela selling baleadas on the corner. Logistics means nothing without the people. We deliver for them."
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
60
films/bronx-logistics/index.html
Normal file
60
films/bronx-logistics/index.html
Normal file
@ -0,0 +1,60 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html><head>
|
||||||
|
<meta name="description" content="Navigating the borough like a pro courier"><meta charset="UTF-8"/>
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
|
||||||
|
<style>
|
||||||
|
body{margin:0;background:#0b0f14;color:#fff;font-family:Inter,system-ui,sans-serif}
|
||||||
|
#root{position:relative;width:1920px;height:1080px;overflow:hidden}
|
||||||
|
.clip{position:absolute;inset:0;display:grid;place-items:center}
|
||||||
|
.bg{position:absolute;inset:0;z-index:-1}
|
||||||
|
.bg img{width:100%;height:100%;object-fit:cover}
|
||||||
|
h1{font-size:3.5rem;font-weight:800;text-shadow:2px 2px 4px rgba(0,0,0,0.8);text-align:center}
|
||||||
|
p{font-size:1.8rem;max-width:80%;text-align:center;text-shadow:1px 1px 2px rgba(0,0,0,0.8)}
|
||||||
|
.street-art{background:linear-gradient(45deg,#ff6b6b,#4ecdc4);color:white;padding:2rem;border-radius:10px}
|
||||||
|
.basketball{background:linear-gradient(45deg,#45b7d1,#f9ca24);color:white;padding:2rem;border-radius:10px}
|
||||||
|
</style> <script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="root" data-composition-id="main" data-start="0" data-width="1920" data-height="1080" data-duration="45">
|
||||||
|
<audio id="bgm" src="audio/music.mp3" data-start="0" data-volume="0.15"></audio>
|
||||||
|
<audio id="voice-s1" src="audio/s1.wav" data-start="0"></audio>
|
||||||
|
<audio id="voice-s2" src="audio/s2.wav" data-start="15"></audio>
|
||||||
|
<audio id="voice-s3" src="audio/s3.wav" data-start="30"></audio>
|
||||||
|
|
||||||
|
<section id="s1" class="clip" data-start="0" data-duration="15" data-track-index="1">
|
||||||
|
<div class="bg"><img src="https://images.pexels.com/photos/31646238/pexels-photo-31646238.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Bronx cityscape"></div>
|
||||||
|
<div class="street-art">
|
||||||
|
<h1 id="s1-title">Bronx Logistics</h1>
|
||||||
|
<p id="s1-text">Navigating the borough like a pro courier</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="s2" class="clip" data-start="15" data-duration="15" data-track-index="1">
|
||||||
|
<div class="bg"><img src="https://pixabay.com/get/g3f88008faf1f59f96d20afbdac15cccd3ffb55644df8ff9667d15461fed9ae70dc1f8bb19d0264bb7c9a4f3c107d920275d160be3d9e642b07088cd0bfbd9474_1280.jpg" alt="Bronx street art"></div>
|
||||||
|
<div class="street-art">
|
||||||
|
<h1 id="s2-title">Street Art & Routes</h1>
|
||||||
|
<p id="s2-text">From Grand Concourse to hidden murals</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="s3" class="clip" data-start="30" data-duration="15" data-track-index="1">
|
||||||
|
<div class="bg"><img src="https://images.pexels.com/photos/6185461/pexels-photo-6185461.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Bronx basketball"></div>
|
||||||
|
<div class="basketball">
|
||||||
|
<h1 id="s3-title">Community & Basketball</h1>
|
||||||
|
<p id="s3-text">The heartbeat of the Bronx</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
window.__timelines = window.__timelines || {};
|
||||||
|
const tl = gsap.timeline({ paused: true });
|
||||||
|
tl.to("#s1-title", { opacity: 1, y: 0, duration: 0.6, ease: "power3.out" }, 0.2);
|
||||||
|
tl.to("#s1-text", { opacity: 1, y: 0, duration: 0.6, ease: "power3.out" }, 0.5);
|
||||||
|
tl.to("#s2-title", { opacity: 1, y: 0, duration: 0.6, ease: "power3.out" }, 15.2);
|
||||||
|
tl.to("#s2-text", { opacity: 1, y: 0, duration: 0.6, ease: "power3.out" }, 15.5);
|
||||||
|
tl.to("#s3-title", { opacity: 1, y: 0, duration: 0.6, ease: "power3.out" }, 30.2);
|
||||||
|
tl.to("#s3-text", { opacity: 1, y: 0, duration: 0.6, ease: "power3.out" }, 30.5);
|
||||||
|
window.__timelines["main"] = tl;
|
||||||
|
</script>
|
||||||
|
</body></html>
|
||||||
121
index.html
Normal file
121
index.html
Normal file
@ -0,0 +1,121 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<style id="fort-styles">
|
||||||
|
[data-fort]{font:inherit;color:inherit}
|
||||||
|
ul[data-fort]{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45em}
|
||||||
|
[data-fort] li{margin:0;padding:0;line-height:1.45;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
||||||
|
[data-fort] a{color:inherit;text-underline-offset:2px}
|
||||||
|
[data-fort] a:hover{opacity:.72}
|
||||||
|
[data-fort] .src,[data-fort] .fm-type{opacity:.6;font-size:.85em}
|
||||||
|
.fort-citizen{display:flex;flex-direction:column;gap:.4em}
|
||||||
|
.fort-citizen .fc-name{font-weight:600}
|
||||||
|
.fort-citizen .fc-pages{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3em}
|
||||||
|
.fort-media,.fort-film{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.6em}
|
||||||
|
.fort-film{list-style:none;margin:0;padding:0}
|
||||||
|
.fort-film li{overflow:visible;white-space:normal}
|
||||||
|
.fort-film a{display:flex;flex-direction:column;gap:.3em;text-decoration:none}
|
||||||
|
.fort-media img,.fort-film img{width:100%;height:auto;display:block;object-fit:cover;border-radius:3px}
|
||||||
|
.fort-film img{aspect-ratio:16/10}
|
||||||
|
.fort-nav{display:flex;flex-wrap:wrap;gap:1em;align-items:center}
|
||||||
|
</style>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Bronx Logistics: Navigating the Borough Like a Pro</title>
|
||||||
|
<meta property="og:type" content="website">
|
||||||
|
<meta property="og:title" content="Bronx Logistics: Navigating the Borough Like a Pro">
|
||||||
|
<meta property="og:description" content="Welcome to my guide on navigating the Bronx like a seasoned courier. I">
|
||||||
|
<meta property="og:image" content="https://pixabay.com/get/g9efa3057a9c79f43a1821dda421fad000a7723cdb4e6374d55b1cded6d8948af7d0a797ed145c077ae808b7206b6201f0fc10f931fbfaaa2da570d7b079af9bc_1280.jpg">
|
||||||
|
<meta property="og:url" content="https://andres-cruz.4ort.net/">
|
||||||
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
|
<meta name="description" content="Welcome to my guide on navigating the Bronx like a seasoned courier. I'm Andres Cruz, and I've spent years mastering the logistics of this vibrant…">
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
font-family: 'Arial', sans-serif;
|
||||||
|
line-height: 1.6;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
color: #333;
|
||||||
|
background-color: #f9f9f9;
|
||||||
|
}
|
||||||
|
header {
|
||||||
|
background-color: #e74c3c;
|
||||||
|
color: white;
|
||||||
|
padding: 1rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
nav {
|
||||||
|
background-color: #333;
|
||||||
|
padding: 0.5rem;
|
||||||
|
}
|
||||||
|
nav a {
|
||||||
|
color: white;
|
||||||
|
margin: 0 1rem;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
main {
|
||||||
|
padding: 2rem;
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
h1, h2 {
|
||||||
|
color: #e74c3c;
|
||||||
|
}
|
||||||
|
.section {
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
text-align: center;
|
||||||
|
padding: 1rem;
|
||||||
|
background-color: #333;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<h1>Bronx Logistics: Navigating the Borough Like a Pro</h1>
|
||||||
|
</header>
|
||||||
|
<nav>
|
||||||
|
<fort-nav><nav class="fort-nav" data-fort="nav"><a href="/" class="active" aria-current="page">Bronx Logistics: Navigating the Borough Like a Pro</a><a href="/films/bronx-logistics/">Index</a><a href="/community.html">Bronx Community Guide</a><a href="/films.html">Bronx Logistics Films</a></nav></fort-nav>
|
||||||
|
</nav>
|
||||||
|
<main>
|
||||||
|
<section class="section">
|
||||||
|
<h2>Introduction</h2>
|
||||||
|
<p>Welcome to my guide on navigating the Bronx like a seasoned courier. I'm Andres Cruz, and I've spent years mastering the logistics of this vibrant borough. Here, I'll share my insights on efficient routes, hidden street art gems, and the cultural heartbeat of the Bronx.</p>
|
||||||
|
</section>
|
||||||
|
<section class="section">
|
||||||
|
<h2>Efficient Routes</h2>
|
||||||
|
<p>Navigating the Bronx requires a mix of strategy and local knowledge. The borough's grid can be tricky, but with the right approach, you can turn any delivery route into a masterpiece of efficiency.</p>
|
||||||
|
<ul>
|
||||||
|
<li><strong>Grand Concourse:</strong> The backbone of the Bronx. Use it for north-south travel, but be mindful of traffic during peak hours.</li>
|
||||||
|
<li><strong>Cross-Bronx Expressway:</strong> Fast but often congested. Plan alternative routes during rush hour.</li>
|
||||||
|
<li><strong>Local Streets:</strong> Sometimes the quickest path is through the neighborhood streets. Know your shortcuts!</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
<section class="section">
|
||||||
|
<h2>Street Art and Culture</h2>
|
||||||
|
<p>The Bronx is a canvas of street art and cultural expression. Keep an eye out for murals that tell the story of the community. Some of my favorites include:</p>
|
||||||
|
<ul>
|
||||||
|
<li><strong>The Bronx Wall of Fame:</strong> A tribute to local heroes and legends.</li>
|
||||||
|
<li><strong>Graffiti Hall of Fame:</strong> A must-see for any street art enthusiast.</li>
|
||||||
|
</ul>
|
||||||
|
<fort-media query="Bronx street art" limit="1"><div class="fort-media" data-fort="media" data-query="Bronx street art"><img src="https://pixabay.com/get/g354dbaf34f3d8c0f457a0e177103dafcf75066281e8b142554d1cd9f33270c8624288c28ae0ad32925d5ca8843b8f263d23f861e5a4a2b4b13304c427b0f6a8a_1280.jpg" alt="man, artist, street, painter, painting, art, jesus, old man, elderly man, street photography, artist, artist, painter, art, jesus, jesus, jesus, jesus, jesus, old man" loading="lazy" data-license="RF" data-source="pixabay"></div></fort-media>
|
||||||
|
</section>
|
||||||
|
<section class="section">
|
||||||
|
<h2>Community and Support</h2>
|
||||||
|
<p>The Bronx is more than just streets and buildings; it's a community. Supporting local businesses and engaging with neighbors is part of what makes this borough special.</p>
|
||||||
|
<p>Check out my <a href="community.html">Community Guide</a> for more on how to get involved and support local initiatives.</p>
|
||||||
|
</section>
|
||||||
|
<section class="section">
|
||||||
|
<h2>Bronx Logistics Films</h2>
|
||||||
|
<p>For a visual journey through the Bronx, check out my short films:</p>
|
||||||
|
<p><a href="films.html">Watch Bronx Logistics Films</a></p>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
<footer>
|
||||||
|
<p>© 2026 Andres Cruz. All rights reserved.</p>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
45
index.json
Normal file
45
index.json
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
{
|
||||||
|
"nav": [
|
||||||
|
{
|
||||||
|
"current": "index.html",
|
||||||
|
"items": [
|
||||||
|
{
|
||||||
|
"rel": "index.html",
|
||||||
|
"title": "Bronx Logistics: Navigating the Borough Like a Pro",
|
||||||
|
"href": "/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"rel": "films/bronx-logistics/index.html",
|
||||||
|
"title": "Index",
|
||||||
|
"href": "/films/bronx-logistics/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"rel": "community.html",
|
||||||
|
"title": "Bronx Community Guide",
|
||||||
|
"href": "/community.html"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"rel": "films.html",
|
||||||
|
"title": "Bronx Logistics Films",
|
||||||
|
"href": "/films.html"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"media": [
|
||||||
|
{
|
||||||
|
"query": "Bronx street art",
|
||||||
|
"type": "image",
|
||||||
|
"items": [
|
||||||
|
{
|
||||||
|
"url": "https://pixabay.com/get/g354dbaf34f3d8c0f457a0e177103dafcf75066281e8b142554d1cd9f33270c8624288c28ae0ad32925d5ca8843b8f263d23f861e5a4a2b4b13304c427b0f6a8a_1280.jpg",
|
||||||
|
"thumb": "https://pixabay.com/get/g0eb11aa422cdd3469cc2e2cc6c658b45ea4041713dfc2ca02550549f487d622b7ac0aa884b6584e5e4d090f6e15e2b8d_640.jpg",
|
||||||
|
"title": "man, artist, street, painter, painting, art, jesus, old man, elderly man, street photography, artist, artist, painter, art, jesus, jesus, jesus, jesus, jesus, old man",
|
||||||
|
"license": "RF",
|
||||||
|
"source": "pixabay",
|
||||||
|
"page": "https://pixabay.com/photos/man-artist-street-painter-painting-343674/"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user