Skip to content

Commit 1571892

Browse files
author
Francis
committed
Theme - Star - 02
1 parent 65f3662 commit 1571892

18 files changed

Lines changed: 347 additions & 182 deletions

File tree

‎src/App/Views/Themes/star/List.cshtml‎

Lines changed: 42 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414

1515
<partial name="~/Views/Themes/star/_Shared/_Header.cshtml" />
1616

17+
1718
<div class="page-content">
1819

1920
@if (Model.PostListType == PostListType.Search)
@@ -42,6 +43,16 @@
4243
<h2 class="page-category-title"><i class="fa fa-tag"></i> @ViewBag.Category</h2>
4344
</div>
4445
</div>
46+
} else {
47+
<div class="blog-cover">
48+
<div class="blog-cover-wrap">
49+
<div class="blog-cover-content">
50+
<h1>Hello,<br /> My Name is Jane!</h1>
51+
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
52+
53+
</div>
54+
</div>
55+
</div>
4556
}
4657

4758
@if (Model.Posts != null)
@@ -50,40 +61,42 @@
5061
{
5162
var img = string.IsNullOrEmpty(item.Cover) ? Model.Blog.Cover : item.Cover;
5263
var avatar = string.IsNullOrEmpty(item.Author.Avatar) ? "lib/img/avatar.jpg" : item.Author.Avatar;
53-
<article class="post">
54-
<div class="post-cover">
55-
<img src="~/@img" alt="@item.Title">
64+
<article class="post">
65+
66+
<div class="container">
67+
<div class="row">
68+
<div class="col-sm-2">
69+
<time class="post-meta-time">@item.Published.ToFriendlyDateString()</time>
5670
</div>
57-
<div class="container">
58-
<div class="row">
59-
<div class="col-sm-2"></div>
60-
<div class="col-sm-10">
61-
<header class="post-header">
62-
<h2 class="post-title"><a href="~/posts/@item.Slug">@item.Title</a></h2>
63-
</header>
64-
@if (item.Featured)
71+
<div class="col-sm-10">
72+
73+
<header class="post-header">
74+
<div class="post-meta-category">
75+
<a href="#">Technology</a>
76+
</div>
77+
<h2 class="post-title"><a href="~/posts/@item.Slug">@item.Title</a></h2>
78+
@if (item.Featured)
6579
{
66-
<span class="post-featrued-label" title="Featured" data-toggle="tooltip"><i class="fa fa-star"></i></span>
80+
<span class="post-featrued-label" title="Featured" data-toggle="tooltip"><i class="fa fa-star"></i></span>
6781
}
82+
<div class="post-meta">
83+
<a class="post-meta-author" href="~/authors/@item.Author.AppUserName">
84+
<img class="post-meta-author-avatar" src="~/@avatar" alt="Author: @item.Author.DisplayName" />
85+
<span class="post-meta-author-name">@item.Author.DisplayName</span>
86+
</a>
6887
</div>
69-
<div class="col-sm-2">
70-
<div class="post-meta">
71-
<a class="post-meta-author" href="~/authors/@item.Author.AppUserName">
72-
<img class="post-meta-author-avatar" src="~/@avatar" alt="Author: @item.Author.DisplayName" />
73-
<div class="post-meta-author-name">@item.Author.DisplayName</div>
74-
</a>
75-
<div class="post-meta-category">
76-
<a href="#">Technology</a>
77-
</div>
78-
<time class="post-meta-time">@item.Published.ToFriendlyDateString()</time>
79-
</div>
80-
</div>
81-
<div class="col-sm-10">
82-
<div class="post-description">@Html.Raw(Markdig.Markdown.ToHtml(item.Description))</div>
83-
</div>
84-
</div>
88+
</header>
89+
90+
<div class="post-description">@Html.Raw(Markdig.Markdown.ToHtml(item.Description))</div>
91+
92+
93+
<a href="~/posts/@item.Slug" class="post-more">Read More</a>
94+
8595
</div>
86-
</article>
96+
97+
</div>
98+
</div>
99+
</article>
87100
}
88101
}
89102

‎src/App/Views/Themes/star/Post.cshtml‎

Lines changed: 42 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -14,72 +14,67 @@
1414

1515
<div class="page-content">
1616

17-
18-
<article class="post">
17+
<article class="post-single">
1918
<div class="post-cover">
20-
<img src="@Model.Blog.Cover" alt="@Model.Post.Title">
19+
<img class="post-cover-img" src="@Model.Blog.Cover" alt="@Model.Post.Title">
2120

22-
</div>
23-
<div class="container">
24-
<div class="row">
25-
<div class="col-sm-2"></div>
26-
<div class="col-sm-10">
27-
<header class="post-header">
28-
<h2 class="post-title">@Model.Post.Title</h2>
29-
</header>
30-
</div>
31-
<div class="col-sm-2">
32-
<div class="post-meta">
33-
<a class="post-meta-author" href="~/authors/@Model.Post.Author.AppUserName">
34-
<img class="post-meta-author-avatar" src="~/@Model.Post.Author.Avatar" alt="@Model.Post.Author.DisplayName" />
35-
<div class="post-meta-author-name">@Model.Post.Author.DisplayName</div>
36-
</a>
37-
<div class="post-meta-category">
38-
39-
@if (!string.IsNullOrEmpty(Model.Post.Categories))
21+
<header class="post-header container">
22+
<time class="post-time">@string.Format("{0:MMM d, yyyy}", Model.Post.Published) / </time>
23+
<span class="post-category">
24+
25+
@if (!string.IsNullOrEmpty(Model.Post.Categories))
4026
{
4127
var cats = Model.Post.Categories.Split(',');
4228

4329
foreach (var cat in cats)
4430
{
45-
<a href="~/categories/@cat">@cat</a>
31+
<a href="~/categories/@cat">@cat</a>
4632
}
4733
}
48-
</div>
49-
<time class="post-meta-time">@string.Format("{0:MMM d, yyyy}", Model.Post.Published)</time>
50-
</div>
51-
</div>
52-
<div class="col-sm-10">
53-
<div class="post-content">@Html.Raw(Model.Post.Content)</div>
54-
55-
</div>
56-
</div>
34+
</span>
35+
36+
37+
<h2 class="post-title">@Model.Post.Title</h2>
38+
39+
<a class="post-author" href="~/authors/@Model.Post.Author.AppUserName">
40+
<img class="post-author-avatar" src="~/@Model.Post.Author.Avatar" alt="@Model.Post.Author.DisplayName" />
41+
<span class="post-author-name">@Model.Post.Author.DisplayName</span>
42+
</a>
43+
44+
</header>
45+
</div>
46+
<div class="container">
47+
48+
<div class="post-content">@Html.Raw(Model.Post.Content)</div>
5749
</div>
5850
</article>
5951

6052

61-
6253

63-
@if (Model.Older != null || Model.Newer != null)
54+
55+
56+
57+
58+
@if (Model.Older != null || Model.Newer != null)
6459
{
65-
<ul class="pagination justify-content-center">
66-
@if (Model.Older != null)
60+
<ul class="pagination justify-content-center">
61+
@if (Model.Older != null)
6762
{
68-
<li class="item item-prev">
69-
<a class="item-link" href="~/posts/@Model.Older.Slug" title="@Model.Older.Title">
70-
<i class="fa fa-chevron-left"></i>
71-
</a>
72-
</li>
63+
<li class="item item-prev">
64+
<a class="item-link" href="~/posts/@Model.Older.Slug" title="@Model.Older.Title">
65+
<i class="fa fa-chevron-left"></i>
66+
</a>
67+
</li>
7368
}
74-
@if (Model.Newer != null)
69+
@if (Model.Newer != null)
7570
{
76-
<li class="item item-next">
77-
<a class="item-link" href="~/posts/@Model.Newer.Slug" title="@Model.Newer.Title">
78-
<i class="fa fa-chevron-right"></i>
79-
</a>
80-
</li>
71+
<li class="item item-next">
72+
<a class="item-link" href="~/posts/@Model.Newer.Slug" title="@Model.Newer.Title">
73+
<i class="fa fa-chevron-right"></i>
74+
</a>
75+
</li>
8176
}
82-
</ul>
77+
</ul>
8378
}
8479
</div>
8580

‎src/App/Views/Themes/star/_Shared/_Head.cshtml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<title>@Html.Raw(Model.Blog.Title)</title>
44
<meta name="description" content="@Html.Raw(Model.Blog.Description)">
55
<meta name="viewport" content="width=device-width, initial-scale=1">
6-
<link href="https://fonts.googleapis.com/css?family=Roboto:300,500,400,700|Merriweather:700" rel="stylesheet">
6+
<link href="https://fonts.googleapis.com/css?family=Lato|Playfair+Display" rel="stylesheet">
77
<link href="~/themes/star/css/bootstrap.min.css" rel="stylesheet">
88
<link href="~/themes/star/css/font-awesome.min.css" rel="stylesheet">
99
<link href="~/themes/star/css/prism.css" rel="stylesheet">

‎src/App/Views/Themes/star/_Shared/_Header.cshtml‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<header class="blog-header">
2-
<div class="container d-flex">
3-
<a href="~/" class="blog-logo"> <img src="~/themes/star/img/logo.png" alt="@Model.Blog.Title" /></a>
2+
<div class="d-flex">
3+
<a href="~/" class="blog-logo my-auto"> <img src="~/themes/star/img/logo.png" alt="@Model.Blog.Title" /></a>
44
<nav class="navbar navbar-expand-lg navbar-dark ml-auto">
55
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
66
<span class="navbar-toggler-icon"></span>

‎src/App/wwwroot/themes/star/css/styles.min.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/App/wwwroot/themes/star/css/styles.min.css.map‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/App/wwwroot/themes/star/img/cover.jpg‎

303 KB
Loading

‎src/App/wwwroot/themes/star/img/logo.png‎

823 Bytes
Loading

‎src/App/wwwroot/themes/star/scss/base/_variables.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
1-
$font: "Roboto";
1+
$font: "Lato";
22
$font-family-base: $font, sans-serif;
3-
$font-heading: "Merriweather";
3+
$font-heading: 'Playfair Display', serif;
44

55
$fw-light: 300;
66
$fw-normal: 400;
77
$fw-medium: 500;
88
$fw-bold: 700;
99

10-
$color-theme: #5271C4;
10+
$color-theme: #cd9023;
1111
$header-width: 30rem;
1212
$header-width-lg: 38rem;
1313

‎src/App/wwwroot/themes/star/scss/components/_button.scss‎

Lines changed: 20 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,28 @@
11
.btn {
2-
border-width: 2px;
2+
border-width: 2px;
33
}
44

55
.btn-rounded {
6-
border-radius: 5rem;
6+
border-radius: 5rem;
77
}
88

99
.btn-unstyled {
10-
background: none;
11-
border: 0;
10+
background: none;
11+
border: 0;
12+
}
13+
14+
15+
.btn-outline-primary {
16+
border-color: $color-theme;
17+
color: $color-theme;
18+
font-weight: 500;
19+
font-size: .875rem;
20+
padding: .5rem 1rem;
21+
text-transform: uppercase;
22+
23+
&:hover, &:focus, &:active {
24+
background-color: $color-theme !important;
25+
border-color: $color-theme !important;
26+
box-shadow: none !important;
27+
}
1228
}

0 commit comments

Comments
 (0)