Skip to content

Commit 55a55f7

Browse files
congwang-mkclaude
andcommitted
Fix contact page missing stylesheets
The contact page had no CSS entry in the layout's conditional loading, so it only received styles.css — leaving form inputs, card layout, and the contact-methods grid completely unstyled. Add content-pages.css and a new contact.css with form and grid styles. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1 parent 1a6b6a8 commit 55a55f7

2 files changed

Lines changed: 50 additions & 0 deletions

File tree

_layouts/default.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,9 @@
2222
<link rel="stylesheet" href="/assets/css/faq.css">
2323
{% elsif page.url contains '/about' %}
2424
<link rel="stylesheet" href="/assets/css/about.css">
25+
{% elsif page.url contains '/contact' %}
26+
<link rel="stylesheet" href="/assets/css/content-pages.css">
27+
<link rel="stylesheet" href="/assets/css/contact.css">
2528
{% elsif page.url == '/' %}
2629
<link rel="stylesheet" href="/assets/css/products.css">
2730
{% endif %}

assets/css/contact.css

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
/* ===== CONTACT PAGE STYLES ===== */
2+
3+
/* Form Styles */
4+
.form-group {
5+
margin-bottom: var(--space-5);
6+
}
7+
8+
.form-group label {
9+
display: block;
10+
font-size: var(--text-sm);
11+
font-weight: 600;
12+
color: var(--gray-700);
13+
margin-bottom: var(--space-2);
14+
}
15+
16+
.form-group input, .form-group textarea {
17+
width: 100%;
18+
padding: var(--space-3) var(--space-4);
19+
border: 1px solid var(--gray-300);
20+
border-radius: var(--radius-md);
21+
font-size: var(--text-sm);
22+
font-family: var(--font-body);
23+
transition: border-color 0.15s ease;
24+
box-sizing: border-box;
25+
}
26+
27+
.form-group input:focus, .form-group textarea:focus {
28+
outline: none;
29+
border-color: var(--gray-900);
30+
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05);
31+
}
32+
33+
/* Features Grid (for contact methods) */
34+
.features-grid {
35+
display: grid;
36+
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
37+
gap: var(--space-6);
38+
margin-top: var(--space-8);
39+
}
40+
41+
/* Responsive */
42+
@media (max-width: 768px) {
43+
.features-grid {
44+
grid-template-columns: 1fr;
45+
gap: var(--space-4);
46+
}
47+
}

0 commit comments

Comments
 (0)