Skip to content

Commit 37a72dd

Browse files
authored
Merge pull request #4 from zesameri/mens-fashion
Mens fashion
2 parents 20c2460 + 3709eb1 commit 37a72dd

2 files changed

Lines changed: 109 additions & 45 deletions

File tree

css/nyc.css

Lines changed: 41 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -155,14 +155,15 @@
155155
text-transform: uppercase;
156156
}
157157

158-
/* tag colors */
159-
.tag-stay { background: #E1904E; color: #fff; }
160-
.tag-gp { background: #900000; color: #fff; }
161-
.tag-dtbk { background: #136B66; color: #fff; }
162-
.tag-bush { background: #0000AA; color: #fff; }
163-
.tag-mht { background: plum; color: #fff; }
164-
.tag-ktown { background: salmon; color: #333; }
165-
.tag-xtra { background: #ffdead; color: #333; }
158+
/* tag colors — boroughs: #f5ecc2 Manhattan, #f15a30 Brooklyn */
159+
.tag-stay { background: #f5ecc2; color: #333; }
160+
.tag-gp { background: #f15a30; color: #fff; }
161+
.tag-dtbk { background: #f15a30; color: #fff; }
162+
.tag-bush { background: #f15a30; color: #fff; }
163+
.tag-mht { background: #f5ecc2; color: #333; }
164+
.tag-ktown { background: #f5ecc2; color: #333; }
165+
.tag-xtra { background: #f5ecc2; color: #333; }
166+
.tag-fashion { background: #87c540; color: #333; }
166167

167168
/* ── Subsections ── */
168169
.subsection-label {
@@ -230,11 +231,38 @@
230231
border-radius: 99px;
231232
border: 1px solid transparent;
232233
}
233-
.badge-res { background: #E1904E; color: #fff; border-color: #c67a3d; }
234-
.badge-walkin { background: #900000; color: #fff; border-color: #660000; }
235-
.badge-early { background: #136B66; color: #fff; border-color: #0d4f4a; }
236-
.badge-cash { background: #0000AA; color: #fff; border-color: #000080; }
237-
.badge-tickets { background: plum; color: #fff; border-color: #dda0dd; }
234+
.badge-res { background: #709390; color: #fff; border-color: #567572; }
235+
.badge-walkin { background: #87c540; color: #333; border-color: #6aa030; }
236+
.badge-early { background: #87c540; color: #333; border-color: #6aa030; }
237+
.badge-cash { background: #00b49b; color: #fff; border-color: #008f7c; }
238+
.badge-tickets { background: #a7d4e4; color: #333; border-color: #7ab4cc; }
239+
240+
/* ── Legend ── */
241+
.legend {
242+
display: flex;
243+
flex-direction: column;
244+
gap: 8px;
245+
padding: 12px 14px;
246+
background: #333;
247+
border: 1px solid #555;
248+
border-radius: 8px;
249+
margin-bottom: 1.5rem;
250+
}
251+
.legend-row {
252+
display: flex;
253+
align-items: center;
254+
flex-wrap: wrap;
255+
gap: 6px;
256+
}
257+
.legend-label {
258+
font-size: 10px;
259+
font-weight: 600;
260+
text-transform: uppercase;
261+
letter-spacing: 0.06em;
262+
color: #a6a9ac;
263+
width: 60px;
264+
flex-shrink: 0;
265+
}
238266

239267
/* ── Intro note ── */
240268
.intro-note {

nyc.html

Lines changed: 68 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -23,26 +23,32 @@ <h2>Table of Contents</h2>
2323
<li><a href="#williamsburg-greenpoint">Williamsburg / Greenpoint</a></li>
2424
<li><a href="#downtown-brooklyn">Downtown Brooklyn / Brooklyn Heights / Fort Greene</a></li>
2525
<li><a href="#bushwick">Bushwick</a></li>
26-
<li><a href="#manhattan-east-chinatown">Manhattan — East Chinatown / LES</a></li>
27-
<li><a href="#manhattan-koreatown">Manhattan — Koreatown</a></li>
28-
<li><a href="#manhattan-anywhere">Wherever you happen to be in Manhattan</a></li>
26+
<li><a href="#manhattan">Manhattan</a></li>
27+
<li><a href="#masc-fashion">Men's fashion</a></li>
2928
</ul>
3029
</nav>
3130

3231

3332

34-
<div class="intro-note">
35-
Reservations noted where relevant — make them in advance on <strong>Resy</strong> or the restaurant's site.
36-
Spots marked <span class="badge badge-walkin">walk-in only</span> don't take reservations.
37-
Nightlife venues open late and don't take advance bookings — just show up.
38-
Spots marked <span class="badge badge-tickets">get tickets</span> sell out and have online ticketing.
33+
<div class="legend">
34+
<div class="legend-row">
35+
<span class="legend-label">Area</span>
36+
<span class="section-tag tag-gp">Brooklyn</span>
37+
<span class="section-tag tag-mht">Manhattan</span>
38+
</div>
39+
<div class="legend-row">
40+
<span class="legend-label">Logistics</span>
41+
<span class="badge badge-walkin">Walk-in only</span>
42+
<span class="badge badge-res">Reserve ahead</span>
43+
<span class="badge badge-tickets">Get tickets</span>
44+
<span class="badge badge-cash">Cash only</span>
45+
</div>
3946
</div>
4047

4148
<!-- ══ WHERE TO STAY ══ -->
4249
<div class="section">
4350
<div class="section-header">
4451
<h2 id="where-to-stay">Where to stay</h2>
45-
<span class="section-tag tag-stay">Neighborhoods</span>
4652
</div>
4753
<div class="cards">
4854
<div class="card">
@@ -198,7 +204,7 @@ <h2 id="williamsburg-greenpoint">Williamsburg / Greenpoint</h2>
198204
<div class="section">
199205
<div class="section-header">
200206
<h2 id="downtown-brooklyn">Downtown Brooklyn / Brooklyn Heights / Fort Greene</h2>
201-
<span class="section-tag tag-dtbk">Brooklyn</span>
207+
<span class="section-tag tag-dtbk">Charm</span>
202208
</div>
203209
<div class="cards">
204210
<div class="card">
@@ -248,7 +254,7 @@ <h2 id="downtown-brooklyn">Downtown Brooklyn / Brooklyn Heights / Fort Greene</h
248254
<div class="section">
249255
<div class="section-header">
250256
<h2 id="bushwick">Bushwick</h2>
251-
<span class="section-tag tag-bush">All the nightlife is here</span>
257+
<span class="section-tag tag-bush">nightlife</span>
252258
</div>
253259

254260
<div class="subsection-label">Food first</div>
@@ -340,12 +346,14 @@ <h2 id="bushwick">Bushwick</h2>
340346
</div>
341347
</div>
342348

343-
<!-- ══ MANHATTAN — CHINATOWN / LES ══ -->
349+
<!-- ══ MANHATTAN ══ -->
344350
<div class="section">
345351
<div class="section-header">
346-
<h2 id="manhattan-east-chinatown">Manhattan — East Chinatown / LES</h2>
352+
<h2 id="manhattan">Manhattan</h2>
347353
<span class="section-tag tag-mht">Manhattan</span>
348354
</div>
355+
356+
<div class="subsection-label">East Chinatown / LES</div>
349357
<div class="cards">
350358
<div class="card">
351359
<div class="card-top"><div>
@@ -385,10 +393,6 @@ <h2 id="manhattan-east-chinatown">Manhattan — East Chinatown / LES</h2>
385393
</div></div>
386394
<div class="card-note">If you're heading into Brooklyn, cross via the Williamsburg Bridge by Citi Bike or on foot — my favorite view of the city.</div>
387395
</div>
388-
</div>
389-
390-
<div class="subsection-label">North → Soho (local side)</div>
391-
<div class="cards">
392396
<div class="card">
393397
<div class="card-top"><div>
394398
<a class="card-name" href="https://www.google.com/maps/place/?q=place_id:ChIJ6yiuIodZwokRoAGoRh5xSlw" target="_blank">il laboratorio del gelato</a>
@@ -406,7 +410,7 @@ <h2 id="manhattan-east-chinatown">Manhattan — East Chinatown / LES</h2>
406410
</div>
407411
</div>
408412

409-
<div class="subsection-label">North → East Village / Alphabet City</div>
413+
<div class="subsection-label">East Village / Alphabet City</div>
410414
<div class="cards">
411415
<div class="card">
412416
<div class="card-top"><div>
@@ -441,14 +445,8 @@ <h2 id="manhattan-east-chinatown">Manhattan — East Chinatown / LES</h2>
441445
<div class="card-badges"><span class="badge badge-walkin">Walk-in</span></div>
442446
</div>
443447
</div>
444-
</div>
445448

446-
<!-- ══ K-TOWN ══ -->
447-
<div class="section">
448-
<div class="section-header">
449-
<h2 id="manhattan-koreatown">Manhattan — Koreatown night</h2>
450-
<span class="section-tag tag-ktown">K-Town · Midtown</span>
451-
</div>
449+
<div class="subsection-label">Koreatown / Midtown</div>
452450
<div class="cards">
453451
<div class="card">
454452
<div class="card-top"><div>
@@ -475,14 +473,8 @@ <h2 id="manhattan-koreatown">Manhattan — Koreatown night</h2>
475473
<div class="card-badges"><span class="badge badge-res">Reserve private room online</span></div>
476474
</div>
477475
</div>
478-
</div>
479476

480-
<!-- ══ ELSEWHERE IN MANHATTAN ══ -->
481-
<div class="section">
482-
<div class="section-header">
483-
<h2 id="manhattan-anywhere">Wherever you happen to be in Manhattan</h2>
484-
<span class="section-tag tag-xtra">Convenient spots</span>
485-
</div>
477+
<div class="subsection-label">Wherever you are</div>
486478
<div class="cards">
487479
<div class="card">
488480
<div class="card-top"><div>
@@ -511,6 +503,50 @@ <h2 id="manhattan-anywhere">Wherever you happen to be in Manhattan</h2>
511503
</div>
512504
</div>
513505

506+
<!-- ══ MEN'S FASHION ══ -->
507+
<div class="section">
508+
<div class="section-header">
509+
<h2 id="masc-fashion">masc fashion</h2>
510+
<span class="section-tag tag-fashion">Shopping</span>
511+
</div>
512+
513+
<div class="subsection-label">New / current season</div>
514+
<div class="cards">
515+
<div class="card">
516+
<div class="card-top"><div>
517+
<a class="card-name" href="https://www.google.com/maps/search/?api=1&query=Our+Legacy+store+Greenpoint+Brooklyn" target="_blank">??? — Greenpoint store (name TBD)</a>
518+
<div class="card-type">mascwear · Greenpoint, Brooklyn</div>
519+
</div></div>
520+
<div class="card-note">Reportedly the largest Our Legacy selection of any store in the US.</div>
521+
</div>
522+
<div class="card">
523+
<div class="card-top"><div>
524+
<a class="card-name" href="https://www.google.com/maps/search/?api=1&query=ESSX+NYC+140+Essex+St+New+York" target="_blank">ESSX NYC</a>
525+
<div class="card-type">masc wear · 140 Essex St, LES</div>
526+
</div></div>
527+
<div class="card-note">Good Our Legacy selection plus other designers — Margiela, and often some newer experimental names.</div>
528+
</div>
529+
<div class="card">
530+
<div class="card-top"><div>
531+
<a class="card-name" href="https://www.google.com/maps/search/?api=1&query=Assembly+New+York" target="_blank">Assembly New York</a>
532+
<div class="card-type">masc-wear / fem-wear · SoHo</div>
533+
</div></div>
534+
<div class="card-note">Independent and rare designers — international and experimental, with shoes, jewelry, and fragrance too.</div>
535+
</div>
536+
</div>
537+
538+
<div class="subsection-label">Used / secondhand</div>
539+
<div class="cards">
540+
<div class="card">
541+
<div class="card-top"><div>
542+
<a class="card-name" href="https://www.google.com/maps/search/?api=1&query=2nd+Street+27+Howard+St+New+York" target="_blank">2nd Street SoHo</a>
543+
<div class="card-type">Secondhand · 27 Howard St, SoHo</div>
544+
</div></div>
545+
<div class="card-note">Often has good used pieces — worth a browse when you're in SoHo.</div>
546+
</div>
547+
</div>
548+
</div>
549+
514550
<footer>
515551
<p>Made with ♥ · All links open in Google Maps · Reservations via <a href="https://resy.com" target="_blank">Resy</a> unless noted</p>
516552
</footer>

0 commit comments

Comments
 (0)