Skip to content

Commit cc5d2df

Browse files
jaroonljaroonl
committed
fixes for bad merge
1 parent 5fba81c commit cc5d2df

File tree

7 files changed

+1023
-115
lines changed

7 files changed

+1023
-115
lines changed

‎teams-fall2025/0100 Loop/index.html‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,22 @@
1818
<li><a href="#interviews">Interviews</a></li>
1919
</ul>
2020
</nav>
21+
<!-- NEW SEARCH BAR -->
22+
<section id="search" class="section container">
23+
<h2>Find Parking</h2>
24+
<form class="search-bar">
25+
<input type="text" placeholder="Enter stadium or location..." />
26+
<button type="submit">Search</button>
27+
</form>
28+
</section>
29+
2130
<section id="home" class="hero container">
2231
<h1>ParkIt</h1>
2332
<p class="subtitle">Affordable, neighbor-powered parking for concerts and games.</p>
33+
34+
<!-- Map link button -->
35+
<a class="btn primary" href="parking-map.html">View Stadium Parking Map</a>
36+
2437
<div class="hero-cta">
2538
<a class="btn primary" href="#features">Explore Features</a>
2639
<a class="btn" href="#problem">Why ParkIt?</a>

‎teams-fall2025/0100 Loop/style.css‎

Lines changed: 81 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
:root{
1+
:root {
22
--bg: #0e2730;
33
--bg-soft: #123746;
44
--surface: #0f1f29;
@@ -11,129 +11,111 @@
1111
--shadow: 0 10px 30px rgba(0,0,0,0.25);
1212
}
1313

14-
*{ box-sizing: border-box; }
15-
html,body{ margin:0; padding:0; }
16-
body{
17-
font-family: system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
14+
* { box-sizing: border-box; }
15+
html, body { margin: 0; padding: 0; }
16+
17+
body {
18+
font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
1819
color: var(--text);
19-
background: linear-gradient(180deg,var(--bg) 0%, var(--bg-soft) 100%);
20+
background: linear-gradient(180deg, var(--bg) 0%, var(--bg-soft) 100%);
2021
line-height: 1.6;
2122
}
2223

23-
.container{
24+
.container {
2425
width: min(1100px, 92vw);
2526
margin: 0 auto;
2627
}
2728

28-
.site-header{
29+
.site-header {
2930
background:
3031
radial-gradient(1200px 400px at 70% -50%, rgba(73,197,182,0.15), transparent),
3132
radial-gradient(800px 300px at -10% 0%, rgba(126,225,214,0.14), transparent),
3233
var(--bg);
3334
border-bottom: 1px solid rgba(255,255,255,0.06);
3435
}
3536

36-
.nav{
37-
display:flex; align-items:center; justify-content:space-between;
38-
padding: 18px 0;
39-
}
40-
.brand{
41-
color: var(--text);
42-
font-weight: 800;
43-
text-decoration:none;
44-
letter-spacing: 0.5px;
45-
font-size: 1.1rem;
46-
}
47-
.nav-links{
48-
list-style:none; display:flex; gap:18px; padding:0; margin:0;
49-
}
50-
.nav-links a{
51-
text-decoration:none; color: var(--muted);
52-
padding: 8px 10px; border-radius: 10px;
53-
}
54-
.nav-links a:hover{ color: var(--text); background: rgba(255,255,255,0.06); }
37+
.nav { display: flex; align-items: center; justify-content: space-between; padding: 18px 0; }
38+
.brand { color: var(--text); font-weight: 800; text-decoration: none; letter-spacing: 0.5px; font-size: 1.1rem; }
39+
.nav-links { list-style: none; display: flex; gap: 18px; padding: 0; margin: 0; }
40+
.nav-links a { text-decoration: none; color: var(--muted); padding: 8px 10px; border-radius: 10px; }
41+
.nav-links a:hover { color: var(--text); background: rgba(255,255,255,0.06); }
5542

56-
.hero{
57-
padding: 64px 0 72px;
58-
text-align:left;
59-
}
60-
.hero h1{
61-
font-size: clamp(2.4rem, 6vw, 3.6rem);
62-
line-height: 1.1; margin: 4px 0 8px;
63-
letter-spacing: -0.5px;
64-
}
65-
.subtitle{
66-
color: var(--muted);
67-
font-size: clamp(1rem, 2.4vw, 1.25rem);
68-
max-width: 55ch;
69-
}
70-
.hero-cta{ margin-top: 24px; display:flex; gap:12px; flex-wrap:wrap; }
71-
.btn{
72-
appearance:none; border:1px solid rgba(255,255,255,0.12);
73-
background: transparent; color: var(--text);
74-
padding: 10px 16px; border-radius: 14px;
75-
text-decoration:none; transition: 160ms ease;
43+
.hero { padding: 10px 0 72px; text-align: left; }
44+
.hero h1 { font-size: clamp(2.4rem, 6vw, 3.6rem); line-height: 1.1; margin: 4px 0 8px; letter-spacing: -0.5px; }
45+
.subtitle { color: var(--muted); font-size: clamp(1rem, 2.4vw, 1.25rem); max-width: 55ch; }
46+
.hero-cta { margin-top: 24px; display: flex; gap: 12px; flex-wrap: wrap; }
47+
48+
.btn {
49+
appearance: none;
50+
border: 1px solid rgba(255,255,255,0.12);
51+
background: transparent;
52+
color: var(--text);
53+
padding: 10px 16px;
54+
border-radius: 14px;
55+
text-decoration: none;
56+
transition: 160ms ease;
7657
box-shadow: var(--shadow);
7758
}
78-
.btn:hover{ transform: translateY(-1px); border-color: rgba(255,255,255,0.25); }
79-
.btn.primary{
80-
background: linear-gradient(180deg, var(--accent), var(--accent-2));
81-
color:#062822; border-color: transparent; font-weight: 700;
82-
}
8359

84-
.section{ padding: 56px 0; }
85-
.two-col{
86-
display:grid; grid-template-columns: 1.2fr 0.8fr; gap: 28px;
87-
}
88-
@media (max-width: 860px){
89-
.two-col{ grid-template-columns: 1fr; }
90-
}
60+
.btn:hover { transform: translateY(-1px); border-color: rgba(255,255,255,0.25); }
61+
.btn.primary { background: linear-gradient(180deg, var(--accent), var(--accent-2)); color: #062822; border-color: transparent; font-weight: 700; }
9162

92-
h2{
93-
margin:0 0 12px; font-size: clamp(1.6rem, 4vw, 2rem); letter-spacing: -0.2px;
94-
}
95-
.lead{ color: var(--muted); font-size: 1.05rem; }
63+
.section { padding: 20px 0; }
64+
.two-col { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 28px; }
65+
@media (max-width: 860px) { .two-col { grid-template-columns: 1fr; } }
9666

97-
.bullets, .checks{
98-
margin: 14px 0 0; padding-left: 1.2rem;
99-
}
100-
.bullets li{ margin: 8px 0; }
101-
.checks{ list-style: none; padding-left: 0; }
102-
.checks li{
103-
margin: 10px 0; padding-left: 28px; position: relative;
104-
}
105-
.checks li::before{
106-
content:"✓"; position:absolute; left:0; top:0;
107-
color: var(--accent-2); font-weight: 800;
108-
}
67+
h2 { margin: 0 0 12px; font-size: clamp(1.6rem, 4vw, 2rem); letter-spacing: -0.2px; }
68+
.lead { color: var(--muted); font-size: 1.05rem; }
10969

110-
.card{
111-
background: var(--card);
112-
border: 1px solid rgba(255,255,255,0.08);
113-
border-radius: 16px; padding: 18px 18px;
114-
box-shadow: var(--shadow);
115-
}
116-
.card.note{ background: linear-gradient(180deg, rgba(126,225,214,0.08), rgba(16,42,54,0.8)); }
70+
.bullets, .checks { margin: 14px 0 0; padding-left: 1.2rem; }
71+
.bullets li { margin: 8px 0; }
72+
.checks { list-style: none; padding-left: 0; }
73+
.checks li { margin: 10px 0; padding-left: 28px; position: relative; }
74+
.checks li::before { content:"✓"; position:absolute; left:0; top:0; color: var(--accent-2); font-weight: 800; }
75+
76+
.card { background: var(--card); border: 1px solid rgba(255,255,255,0.08); border-radius: 16px; padding: 18px; box-shadow: var(--shadow); }
77+
.card.note { background: linear-gradient(180deg, rgba(126,225,214,0.08), rgba(16,42,54,0.8)); }
11778

118-
.grid{
119-
display:grid;
120-
grid-template-columns: repeat(3, minmax(0,1fr));
121-
gap: 18px;
122-
margin-top: 12px;
79+
.grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; margin-top: 12px; }
80+
@media (max-width: 980px) { .grid { grid-template-columns: repeat(2, 1fr); } }
81+
@media (max-width: 640px) { .grid { grid-template-columns: 1fr; } }
82+
83+
.feature h3 { margin: 6px 0 6px; font-size: 1.05rem; }
84+
.feature p { color: var(--muted); }
85+
86+
.team { text-align: center; }
87+
.muted { color: var(--muted); }
88+
.small { font-size: 0.9rem; }
89+
90+
.site-footer { border-top: 1px solid rgba(255,255,255,0.06); background: var(--surface); padding: 26px 0; text-align: center; }
91+
92+
.search-bar {
93+
display: flex;
94+
justify-content: flex-start;
95+
margin: 2rem 0;
12396
}
124-
@media (max-width: 980px){ .grid{ grid-template-columns: repeat(2,1fr); } }
125-
@media (max-width: 640px){ .grid{ grid-template-columns: 1fr; } }
12697

127-
.feature h3{ margin: 6px 0 6px; font-size: 1.05rem; }
128-
.feature p{ color: var(--muted); }
98+
.search-bar input {
99+
background-color: white;
100+
color: black;
101+
padding: 0.6rem 1rem;
102+
font-size: 1rem;
103+
border: 1px solid #ccc;
104+
border-radius: 8px 0 0 8px;
105+
outline: none;
106+
width: 250px;
107+
}
129108

130-
.team{ text-align:center; }
131-
.muted{ color: var(--muted); }
132-
.small{ font-size: 0.9rem; }
109+
.search-bar button {
110+
padding: 0.6rem 1.2rem;
111+
font-size: 1rem;
112+
border: none;
113+
background-color: #00bfa6;
114+
color: white;
115+
border-radius: 0 8px 8px 0;
116+
cursor: pointer;
117+
}
133118

134-
.site-footer{
135-
border-top: 1px solid rgba(255,255,255,0.06);
136-
background: var(--surface);
137-
padding: 26px 0;
138-
text-align: center;
119+
.search-bar button:hover {
120+
background-color: #009e87;
139121
}

0 commit comments

Comments
 (0)