Skip to content

Commit

Permalink
feat: Add about page and book image (#493)
Browse files Browse the repository at this point in the history 
## Description

Fixes: #338 #337 #336 

Edits:
- Adding some UI updates to the site, including some nicer colors and a
slightly nicer navigation UI/UX
- Added an about page
- Added book to about/home pages
- Better mobile nav bar 

<img width="931" alt="image"
src="https://github.com/IntelliTect/EssentialCSharp.Web/assets/40438334/f4964837-046e-45c0-b0e0-298b33c59af9">

<img width="938" alt="image"
src="https://github.com/IntelliTect/EssentialCSharp.Web/assets/40438334/2b9c1a20-f9ee-4c69-a64b-63feb0e641ac">

<img width="223" alt="image"
src="https://github.com/IntelliTect/EssentialCSharp.Web/assets/40438334/547893a2-dd83-4ad9-b5f5-134db60aefcd">


Would like to create some kind of graphic to fill this area, created a
story(#494):

<img width="689" alt="image"
src="https://github.com/IntelliTect/EssentialCSharp.Web/assets/40438334/1caf8b95-0e34-40ae-8d62-6ccfcccae377">

Also, I think I need to update the root css colors to match the parser
project side to the added web colors here. There is a bit of a mismatch
at the moment on the generated pages.

### Ensure that your pull request has followed all the steps below:
- [x] Code compilation
- [ ] Created tests which fail without the change (if possible)
- [x] All tests passing
- [ ] Extended the README / documentation, if necessary
  • Loading branch information
@kelseymcmahon
kelseymcmahon authored Jun 5, 2024
1 parent 6de8d28 commit 4749174
Show file tree
Hide file tree
Showing 10 changed files with 382 additions and 210 deletions.
13 changes: 9 additions & 4 deletions EssentialCSharp.Web/Controllers/HomeController.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,16 +60,21 @@ public IActionResult TermsOfService()
return View();
}

[Route("/Announcements",
Name = "Announcements")]
[Route("/Announcements", Name = "Announcements")]
public IActionResult Announcements()
{
ViewBag.PageTitle = "Announcements";
return View();
}

[Route("/home",
Name = "home")]
[Route("/about", Name = "about")]
public IActionResult About()
{
ViewBag.PageTitle = "About";
return View();
}

[Route("/home", Name = "home")]
public IActionResult Home()
{
return View();
Expand Down
71 changes: 71 additions & 0 deletions EssentialCSharp.Web/Views/Home/About.cshtml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
@{
ViewData["Title"] = "About";
}

<div class="px-3">
<h1>@ViewData["Title"]</h1>
<hr class="divider-light-blue" />

<div class="row py-3 gx-5">
<div class="col-12 col-md-6 my-1">
<div class="h3">
Who We Are
</div>
<p>
IntelliTect is a high-end software architecture and development consulting firm based in Spokane, Washington.
</p>
<p>
At IntelliTect, we offer a full range of software and consulting services.
Our passion for innovation manifests itself primarily in technology and software development.
</p>
<p>
We provide high-end architecture consulting, full life-cycle software development, and training that enables our clients to solve their most challenging problems.
</p>
<div>
<a class="btn btn-primary" href="https://intellitect.com/" target="_blank">Learn More About Intellitect</a>
</div>
</div>
<div class="col-12 col-md-6">
<div class="d-flex align-items-center justify-content-center h-100 bg-light">
<img src="/images/intellitect-logo.svg" class="img-fluid" alt="IntelliTect Logo" style="height: 75px">
</div>
</div>
</div>

<hr class="divider-light-blue" />

<div class="row gx-5">
<div class="col-12 col-md-6">
<div class="d-flex align-items-center justify-content-center h-100">
<img src="/images/book.png" class="img-fluid" style="height: 450px" alt="Essential C Sharp Book">
</div>
</div>
<div class="col-12 col-md-6 mt-3">
<div class="h3">
Essential C# Book
</div>
<p>
Check out the interactive and comprehensive guide to the C# coding language to expand your development knowledge and enhance your skill set at your own pace. The site includes everything developers need to master C# and is an excellent tool for beginners to experts.
</p>
<div>
<a class="btn btn-primary" href="https://a.co/d/95wxhTg" target="_blank">Get the Book</a>
</div>

<div class="quote">
<div class="quote-content">
<div class="quote-icon">
<i class="fa fa-solid fa-quote-left"></i>
</div>
<div class="quote-text">
Welcome to one of the most venerable and trusted franchises you could dream of in the world of C# books&mdash;and probably far beyond!
</div>
</div>
<div class="quote-author">
<strong>From the Foreword by Mads Torgersen</strong>
<br />
<i>C# Lead Designer, Microsoft</i>
</div>
</div>
</div>
</div>
</div>
43 changes: 13 additions & 30 deletions EssentialCSharp.Web/Views/Home/Announcements.cshtml
View file
Original file line number Diff line number Diff line change
@@ -1,57 +1,40 @@
@{
ViewData["Title"] = "Announcements";
}
<div class="py-2 px-2">
<div>
<h1>@ViewData["Title"]</h1>
</div>

<div>
<hr class="divider-blue" />
</div>
<div class="px-3">
<h1>@ViewData["Title"]</h1>
<hr class="divider-light-blue" />

<div class="row py-4">
<div class="row">
<div class="col-12 my-2">
<h3>Web Features Coming Soon</h3>
<h2 class="fs-4">Web Features Coming Soon</h2>
</div>
<div v-for="(feature, i) in featuresComingSoonList" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-4">
<div class="card card-blue">
<div v-for="(feature, i) in featuresComingSoonList" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-5">
<div class="card card-primary">
<div class="card-body">
<h5 class="card-title" v-html="feature.title"></h5>
<p class="card-text" v-html="feature.text"></p>
</div>
</div>
</div>
</div>

<div>
<hr class="divider-light-blue" />
</div>

<div class="row py-4">
<div class="col-12 my-2">
<h3>Content Coming Soon</h3>
<h2 class="fs-4">Content Coming Soon</h2>
</div>
<div v-for="(feature, i) in contentComingSoonList" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-4">
<div class="card card-light-blue">
<div v-for="(feature, i) in contentComingSoonList" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-5">
<div class="card card-secondary">
<div class="card-body">
<h5 class="card-title" v-html="feature.title"></h5>
<p class="card-text" v-html="feature.text"></p>
</div>
</div>
</div>
</div>

<div>
<hr class="divider-yellow" />
</div>

<div class="row py-4">
<div class="col-12 my-2">
<h3>Recently Completed</h3>
<h2 class="fs-4">Recently Completed</h2>
</div>
<div v-for="(feature, i) in completedFeaturesList" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-4">
<div class="card card-yellow">
<div v-for="(feature, i) in completedFeaturesList" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-5">
<div class="card card-accent">
<div class="card-body">
<h5 class="card-title" v-html="feature.title"></h5>
<p class="card-text" v-html="feature.text"></p>
Expand Down
27 changes: 16 additions & 11 deletions EssentialCSharp.Web/Views/Home/Guidelines.cshtml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,19 +4,24 @@
var guidelines = (List<GuidelineListing>)ViewBag.Guidelines as List<GuidelineListing>;
}

<div>
@foreach (var group in guidelines.GroupBy(g => g.SanitizedSubsection).OrderBy(g => g.Key))
{
<h2 id="@group.Key?.ToLower()">@group.Key</h2>
foreach (var guideline in group)
<div class="px-3">
<h1>@ViewData["Title"]</h1>
<hr class="divider-light-blue" />

<div>
@foreach (var group in guidelines.GroupBy(g => g.SanitizedSubsection).OrderBy(g => g.Key))
{
<div>
<i class="@GetSymbolForType(guideline.Type)" style="color: @GetColorForType(guideline.Type); padding-right: 10px;"></i>
<span>@guideline.Guideline</span>
</div>
<h2 class="fs-4" id="@group.Key?.ToLower()">@group.Key</h2>
foreach (var guideline in group)
{
<div>
<i class="@GetSymbolForType(guideline.Type)" style="color: @GetColorForType(guideline.Type); padding-right: 10px;"></i>
<span>@guideline.Guideline</span>
</div>
}
<br />
}
<br />
}
</div>
</div>

@functions {
Expand Down
108 changes: 66 additions & 42 deletions EssentialCSharp.Web/Views/Home/Home.cshtml
View file
Original file line number Diff line number Diff line change
@@ -1,39 +1,71 @@
<div class="py-2 px-2">
<div class="px-3">
<div>
<h1>Welcome to Essential C#</h1>
<h4><i>Written by Mark Michaelis with Eric Lippert & Kevin Bost</i></h4>
<div class="quote">
<div class="quote-content">
<div class="quote-icon">
<i class="fa fa-solid fa-quote-left"></i>
</div>

<hr class="divider-light-blue" />

<div class="row gx-5">
<div class="col-12 col-md-6">
<h3>The Comprehensive, Expert Guide to C# Language Programming</h3>
<div class="h5"><i>Written by Mark Michaelis with Eric Lippert & Kevin Bost</i></div>
<p>
Essential C# is a well-organized, no-fluff guide to C# for programmers at all levels of experience.
Reflecting the most important C# features from 3.0 through 8.0 and including modern programming patterns,
it will help you write code that&rsquo;s simple, powerful, robust, secure, and maintainable.
</p>
<p>
World-class C# expert Mark Michaelis presents a complete tutorial and reference for the entire language,
including expert coverage of key C# enhancements, C#&rsquo;s use with .NET Core/.NET Standard,
and cross-platform compilation. He illustrates key C# constructs with succinct examples,
and presents best-practice coding guidelines.
</p>
</div>
</div>

<hr class="divider-light-blue" />

<div class="row gx-5">
<div class="col-12 col-md-6">
<div class="d-flex align-items-center justify-content-center h-100">
<img src="/images/book.png" class="img-fluid" style="height: 450px" alt="Essential C Sharp Book">
</div>
</div>
<div class="col-12 col-md-6 mt-3">
<h3>Essential C# Book</h3>
<p>
Check out the interactive and comprehensive guide to the C# coding language to expand your development knowledge and enhance your skill set at your own pace. The site includes everything developers need to master C# and is an excellent tool for beginners to experts.
</p>
<div>
<a class="btn btn-primary" href="https://a.co/d/95wxhTg" target="_blank">Get the Book</a>
</div>

<div class="quote">
<div class="quote-content">
<div class="quote-icon">
<i class="fa fa-solid fa-quote-left"></i>
</div>
<div class="quote-text">
Welcome to one of the most venerable and trusted franchises you could dream of in the world of C# books&mdash;and probably far beyond!
</div>
</div>
<div class="quote-text">
Welcome to one of the most venerable and trusted franchises you could dream of in the world of C# books&mdash;and probably far beyond!
<div class="quote-author">
<strong>From the Foreword by Mads Torgersen</strong>
<br />
<i>C# Lead Designer, Microsoft</i>
</div>
</div>
<div class="quote-author">
<strong>From the Foreword by Mads Torgersen</strong>
<br />
<i>C# Lead Designer, Microsoft</i>
</div>
</div>
</div>

<div class="py-4">
<h3>The Comprehensive, Expert Guide to C# Language Programming</h3>
<p>Essential C# is a well-organized, no-fluff guide</a> to C# for programmers at all levels of experience. Reflecting the most important C# features from 3.0 through 8.0 and including modern programming patterns, it will help you write code that&rsquo;s simple, powerful, robust, secure, and maintainable. World-class C# expert Mark Michaelis presents a complete tutorial and reference for the entire language, including expert coverage of key C# enhancements, C#&rsquo;s use with .NET Core/.NET Standard, and cross-platform compilation. He illustrates key C# constructs with succinct examples, and presents best-practice coding guidelines.</p>
</div>

<div>
<hr class="divider-blue" />
</div>
<hr class="divider-light-blue" />

<div class="row py-4">
<div class="row">
<div class="col-12 my-2">
<h3>Web Features Coming Soon</h3>
</div>
<div v-for="(feature, i) in featuresComingSoonList.slice(0, 3)" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-4">
<div class="card card-blue">
<div v-for="(feature, i) in featuresComingSoonList.slice(0, 3)" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-5">
<div class="card card-primary">
<div class="card-body">
<h5 class="card-title" v-html="feature.title"></h5>
<p class="card-text" v-html="feature.text"></p>
Expand All @@ -42,47 +74,39 @@
</div>
</div>

<div>
<hr class="divider-light-blue" />
</div>

<div class="row py-4">
<div class="row">
<div class="col-12 my-2">
<h3>Content Coming Soon</h3>
</div>
<div v-for="(feature, i) in contentComingSoonList.slice(0, 3)" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-4">
<div class="card card-light-blue">
<div v-for="(feature, i) in contentComingSoonList.slice(0, 3)" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-5">
<div class="card card-secondary">
<div class="card-body">
<h5 class="card-title" v-html="feature.title"></h5>
<h5 class="card-title" v-html="feature.title"></h5>
<p class="card-text" v-html="feature.text"></p>
</div>
</div>
</div>
</div>

<div>
<hr class="divider-yellow" />
</div>

<div class="row py-4">
<div class="row">
<div class="col-12 my-2">
<h3>Recently Completed</h3>
</div>
<div v-for="(feature, i) in completedFeaturesList.slice(0, 3)" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-4">
<div class="card card-yellow">
<div v-for="(feature, i) in completedFeaturesList.slice(0, 3)" key="i" class="col-sm-12 col-md-6 col-lg-4 mb-5">
<div class="card card-accent">
<div class="card-body">
<h5 class="card-title" v-html="feature.title"></h5>
<p class="card-text" v-html="feature.text"></p>
</div>
</div>
</div>
</div>

<div class="row justify-content-center">
<div class="col-auto">
<button type="button" class="button my-4" onclick="window.location.href='/Announcements'">
<a class="btn btn-primary" href="/Announcements">
View All Announcements
</button>
</a>
</div>
</div>

</div>
Loading

0 comments on commit 4749174

Please sign in to comment.