Skip to content

Commit f32f256

Browse files
csharpfritzcsharpfritz
committed
Enhance layout and styling for category filters and site responsiveness; implement environment-specific CSS and JS bundling
1 parent 7ed97c9 commit f32f256

4 files changed

Lines changed: 115 additions & 485 deletions

File tree

‎Web/Pages/Shared/_Layout.cshtml‎

Lines changed: 18 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,20 @@
1010
<!-- Feeds and Sitemap -->
1111
<link rel="sitemap" type="application/xml" title="Sitemap" href="/sitemap.xml" />
1212
<link rel="alternate" type="application/rss+xml" title="Latest Tips" href="/feed.rss" />
13-
14-
<!-- Fonts and External CSS -->
13+
<!-- Fonts and External CSS -->
1514
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@800&display=swap" rel="stylesheet" />
1615
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
1716
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css" />
1817
<link id="prism-theme" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism.min.css" />
1918

20-
<!-- Bundled and minified site CSS -->
21-
<link rel="stylesheet" href="~/css/bundle.min.css" asp-append-version="true" />
19+
<!-- Site CSS -->
20+
<environment exclude="Development">
21+
<link rel="stylesheet" href="~/css/bundle.min.css" asp-append-version="true" />
22+
</environment>
23+
<environment include="Development">
24+
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
25+
<link rel="stylesheet" href="~/css/layout.css" asp-append-version="true" />
26+
</environment>
2227
<link rel="stylesheet" href="~/Web.styles.css" asp-append-version="true" />
2328
@await RenderSectionAsync("Styles", required: false)
2429

@@ -111,8 +116,15 @@
111116
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-bash.min.js"></script>
112117
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-yaml.min.js"></script>
113118

114-
<!-- Bundled and minified site scripts -->
115-
<script src="~/js/bundle.min.js" asp-append-version="true"></script>
119+
<!-- Site scripts -->
120+
<environment exclude="Development">
121+
<script src="~/js/bundle.min.js" asp-append-version="true"></script>
122+
</environment>
123+
<environment include="Development">
124+
<script src="~/js/site.js" asp-append-version="true"></script>
125+
<script src="~/js/analytics.js" asp-append-version="true"></script>
126+
<script src="~/js/theme-switcher.js" asp-append-version="true"></script>
127+
</environment>
116128
<script>
117129
// Fix for code highlighting in theme changes
118130
document.addEventListener('DOMContentLoaded', function() {

‎Web/Pages/Tips/Category.cshtml‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -36,14 +36,13 @@
3636

3737
<div class="row">
3838
<!-- Category Filter Sidebar -->
39-
<div class="col-lg-3 col-md-4 mb-4">
40-
<div class="card shadow-sm">
41-
<div class="card-header bg-light">
39+
<div class="col-lg-3 col-md-4 mb-4"> <div class="card shadow-sm">
40+
<div class="card-header category-filter-header">
4241
<h5 class="card-title mb-0">
4342
<i class="bi bi-grid-3x3-gap"></i> Browse Categories
4443
</h5>
4544
</div>
46-
<div class="card-body p-0">
45+
<div class="card-body category-filter-body">
4746
@foreach (var cat in Model.ViewModel.Categories)
4847
{
4948
<a asp-page="/Tips/Category" asp-route-category="@cat"
@@ -58,14 +57,13 @@
5857
</div>
5958
</div>
6059

61-
<!-- Additional Filters -->
62-
<div class="card shadow-sm mt-3">
63-
<div class="card-header bg-light">
60+
<!-- Additional Filters --> <div class="card shadow-sm mt-3">
61+
<div class="card-header category-filter-header">
6462
<h6 class="card-title mb-0">
6563
<i class="bi bi-funnel"></i> Refine Results
6664
</h6>
6765
</div>
68-
<div class="card-body">
66+
<div class="card-body category-filter-body">
6967
<form method="get" asp-page="/Tips/Index">
7068
<input type="hidden" name="category" value="@Model.Category" />
7169

‎Web/Program.cs‎

Lines changed: 34 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -12,18 +12,22 @@
1212
// Add WebOptimizer services
1313
builder.Services.AddWebOptimizer(pipeline =>
1414
{
15-
// Bundle and minify CSS files
16-
pipeline.MinifyCssFiles();
17-
pipeline.AddCssBundle("/css/bundle.min.css",
18-
"css/site.css",
19-
"css/layout.css");
20-
21-
// Bundle and minify JavaScript files
22-
pipeline.MinifyJsFiles();
23-
pipeline.AddJavaScriptBundle("/js/bundle.min.js",
24-
"js/site.js",
25-
"js/analytics.js",
26-
"js/theme-switcher.js");
15+
if (!builder.Environment.IsDevelopment())
16+
{
17+
// Bundle and minify CSS files in production only
18+
pipeline.MinifyCssFiles();
19+
pipeline.AddCssBundle("/css/bundle.min.css",
20+
"css/site.css",
21+
"css/layout.css");
22+
23+
// Bundle and minify JavaScript files in production only
24+
pipeline.MinifyJsFiles();
25+
pipeline.AddJavaScriptBundle("/js/bundle.min.js",
26+
"js/site.js",
27+
"js/analytics.js",
28+
"js/theme-switcher.js");
29+
}
30+
// In development, no bundling or minification - serve files directly
2731
});
2832

2933
// Add services to the container.
@@ -92,15 +96,25 @@
9296
{
9397
app.UseExceptionHandler("/Error");
9498
app.UseHsts();
99+
100+
// Enable compression and caching only in production
101+
app.UseResponseCompression();
102+
app.UseResponseCaching();
103+
app.UseOutputCache();
104+
}
105+
else
106+
{
107+
app.UseDeveloperExceptionPage();
95108
}
96109

97110
// Enable compression and caching early in the pipeline
98-
app.UseResponseCompression();
99-
app.UseResponseCaching();
100-
app.UseOutputCache();
101-
102111
app.UseHttpsRedirection();
103-
app.UseWebOptimizer(); // Add WebOptimizer middleware before static files
112+
113+
if (!app.Environment.IsDevelopment())
114+
{
115+
app.UseWebOptimizer(); // Only use WebOptimizer in production
116+
}
117+
104118
app.UseStaticFiles(new StaticFileOptions
105119
{
106120
OnPrepareResponse = ctx =>
@@ -109,15 +123,15 @@
109123
{
110124
// Cache static files for 30 days in production
111125
ctx.Context.Response.Headers.CacheControl = "public,max-age=2592000";
126+
ctx.Context.Response.Headers.Vary = "Accept-Encoding";
112127
}
113128
else
114129
{
115130
// Disable caching in development
116-
ctx.Context.Response.Headers.CacheControl = "no-cache, no-store, must-revalidate";
131+
ctx.Context.Response.Headers.CacheControl = "no-cache, no-store";
117132
ctx.Context.Response.Headers.Pragma = "no-cache";
118-
ctx.Context.Response.Headers.Expires = "0";
133+
ctx.Context.Response.Headers.Expires = "-1";
119134
}
120-
ctx.Context.Response.Headers.Vary = "Accept-Encoding";
121135
}
122136
});
123137

0 commit comments

Comments
 (0)