优化分页组件和广告卡片的响应式布局

src/Masuit.MyBlogs.Core/Views/Post/CompareVersion.cshtml

@@ -94,22 +94,15 @@
                                             @ads[0].Title
                                             <span class="text-red">[推广]</span>
                                         </h3>
-
                                         <div class="row padding-bot10">
-                                            @{
-                                                string imgSrc = ads[0].ThumbImgUrl;
-                                                if (!string.IsNullOrEmpty(imgSrc))
-                                                {
-                                                    <div class="col-md-3">
-                                                        <img class="img-thumbnail img-responsive thumb" data-original="@imgSrc" alt="@ads[0].Title" title="@ads[0].Title ">
-                                                    </div>
-                                                }
-                                            }
-                                            <div class="col-md-@(string.IsNullOrEmpty(imgSrc) ? 12 : 9)">
-                                                <p>
-                                                    @ads[0].Description
-                                                </p>
-                                            </div>
+                                            <div class="col-md-2 col-sm-3 col-xs-4 paddingright-clear">
+                                            <img class="img-thumbnail img-responsive" src="@ads[0].ThumbImgUrl" alt="@ads[0].Title" title="@ads[0].Title ">
+                                        </div>
+                                        <div class="col-md-10 col-sm-9">
+                                            <p>
+                                                @ads[0].Description
+                                            </p>
+                                        </div>
                                         </div>
                                     </a>
                                 </section>
@@ -180,18 +173,11 @@
                                             @ads[1].Title
                                             <span class="text-red">[推广]</span>
                                         </h3>
-
                                         <div class="row padding-bot10">
-                                            @{
-                                                string imgSrc = ads[1].ThumbImgUrl;
-                                                if (!string.IsNullOrEmpty(imgSrc))
-                                                {
-                                                    <div class="col-md-3">
-                                                        <img class="img-thumbnail img-responsive thumb" data-original="@imgSrc" alt="@ads[1].Title" title="@ads[1].Title ">
-                                                    </div>
-                                                }
-                                            }
-                                            <div class="col-md-@(string.IsNullOrEmpty(imgSrc) ? 12 : 9)">
+                                            <div class="col-md-2 col-sm-3 col-xs-4 paddingright-clear">
+                                                <img class="img-thumbnail img-responsive" src="@ads[1].ThumbImgUrl" alt="@ads[1].Title" title="@ads[1].Title ">
+                                            </div>
+                                            <div class="col-md-10 col-sm-9">
                                                 <p>
                                                     @ads[1].Description
                                                 </p>

src/Masuit.MyBlogs.Core/Views/Post/Details.cshtml

@@ -123,10 +123,10 @@
                             </h3>
 
                             <div class="row">
-                                <div class="col-md-2 paddingright-clear">
+                                <div class="col-md-2 col-sm-3 col-xs-4 paddingright-clear">
                                     <img class="img-thumbnail img-responsive" src="@ad.ThumbImgUrl" alt="@ad.Title" title="@ad.Title ">
                                 </div>
-                                <div class="col-md-10">
+                                <div class="col-md-10 col-sm-9">
                                     <p>
                                         @ad.Description
                                     </p>

src/Masuit.MyBlogs.Core/Views/Post/Details_Admin.cshtml

@@ -144,10 +144,10 @@
                                 <span class="text-red">[推广]</span>
                             </h3>
                             <div class="row">
-                                <div class="col-md-2 paddingright-clear">
+                                <div class="col-md-2 col-sm-3 col-xs-4 paddingright-clear">
                                     <img class="img-thumbnail img-responsive" src="@ad.ThumbImgUrl" alt="@ad.Title" title="@ad.Title ">
                                 </div>
-                                <div class="col-md-10">
+                                <div class="col-md-10 col-sm-9">
                                     <p>
                                         @ad.Description
                                     </p>

src/Masuit.MyBlogs.Core/Views/Post/HistoryVersion.cshtml

@@ -88,44 +88,7 @@
                             @if (!string.IsNullOrEmpty(Model.ProtectContent))
                             {
                                 <div class="row protected">
-                                    @if (string.IsNullOrEmpty(Context.Session.Get<string>("AccessViewToken")) && !string.IsNullOrEmpty(Model.Post.ProtectContent))
-                                    {
-                                        <p class="text-red text-center size24 margin-bot10">↓↓↓恭喜你发现镇站之宝，请注意，前方高能！非战斗人员请及时撤离，这不是演习！↓↓↓</p>
-                                        <div class="col-md-6">
-                                            <span class="text-red">以下内容已经隐藏，请输入验证码后查看</span>
-                                            <span class="text-green">【完全免费，不收一分钱】</span>
-                                            <form action="/" method="post" class="form-inline" id="code-token">
-                                                <div class="input-group">
-                                                    @Html.AntiForgeryToken()
-                                                    <span class="input-group-addon">验证码：</span>
-                                                    <input type="text" name="token" id="token" class="form-control" />
-                                                    <span class="input-group-btn">
-                                                        <button type="submit" class="btn btn-info">查看文章</button>
-                                                    </span>
-                                                </div>
-                                            </form>
-                                            <p class="text-green">温馨提示：将本页面分享到您的社交平台上，如QQ或微信，并保证3h之内不会删除且获得10个以上的点赞或评论后，通过站长QQ私信获取文章访问密码，<span class="text-red">获取密码后本站所有加密文章将永久开放！</span></p>
-                                        </div>
-                                        <div class="col-md-6">
-                                            <span class="text-green">如果你曾经获取过密码，请输入您的邮箱后查看</span>
-                                            <form action="/" method="post" class="form-inline" id="email-token">
-                                                <div class="input-group">
-                                                    @Html.AntiForgeryToken()
-                                                    <span class="input-group-addon">邮箱：</span>
-                                                    <input type="email" name="Email" id="email3" class="form-control" />
-                                                    <span class="input-group-btn">
-                                                        <button type="submit" class="btn btn-info">查看文章</button>
-                                                    </span>
-                                                </div>
-                                            </form>
-                                            <p class="text-green">温馨提示：请确保您的邮箱已经通过站长的登记，如果您未使用邮箱登记，请先联系站长获取文章密码并登记邮箱即可！</p>
-                                        </div>
-                                    }
-                                    else
-                                    {
-                                        <p class="text-red text-center size20">↓↓↓以下是文章加密部分↓↓↓</p>
-                                        @Html.Raw(await Model.ProtectContent.ReplaceImgAttribute(Model.Title))
-                                    }
+                                    此处为加密内容，历史版本不可查看！
                                 </div>
                             }
                         </article>
@@ -171,18 +134,11 @@
                                 @ad.Title
                                 <span class="text-red">[推广]</span>
                             </h3>
-
                             <div class="row padding-bot10">
-                                @{
-                                    string imgSrc = ad.ThumbImgUrl;
-                                    if (!string.IsNullOrEmpty(imgSrc))
-                                    {
-                                        <div class="col-md-3">
-                                            <img class="img-thumbnail img-responsive thumb" data-original="@imgSrc" alt="@ad.Title" title="@ad.Title ">
-                                        </div>
-                                    }
-                                }
-                                <div class="col-md-@(string.IsNullOrEmpty(imgSrc) ? 12 : 9)">
+                                <div class="col-md-2 col-sm-3 col-xs-4 paddingright-clear">
+                                    <img class="img-thumbnail img-responsive" src="@ad.ThumbImgUrl" alt="@ad.Title" title="@ad.Title ">
+                                </div>
+                                <div class="col-md-10 col-sm-9">
                                     <p>
                                         @ad.Description
                                     </p>

src/Masuit.MyBlogs.Core/Views/Post/HistoryVersion_Admin.cshtml

@@ -89,12 +89,7 @@
                         </header>
                         <article class="article" id="article">
                             @Html.Raw(Model.Content)
-                            @if (!string.IsNullOrEmpty(Model.ProtectContent))
-                            {
-                                <div class="row protected">
-                                    @Html.Raw(Model.ProtectContent)
-                                </div>
-                            }
+                            @Html.Raw(Model.ProtectContent)
                         </article>
                         <div id="cyReward" role="cylabs" data-use="reward"></div>
                     </section>
@@ -140,16 +135,10 @@
                             </h3>
 
                             <div class="row padding-bot10">
-                                @{
-                                    string imgSrc = ad.ThumbImgUrl;
-                                    if (!string.IsNullOrEmpty(imgSrc))
-                                    {
-                                        <div class="col-md-3">
-                                            <img class="img-thumbnail img-responsive thumb" data-original="@imgSrc" alt="@ad.Title" title="@ad.Title ">
-                                        </div>
-                                    }
-                                }
-                                <div class="col-md-@(string.IsNullOrEmpty(imgSrc) ? 12 : 9)">
+                                <div class="col-md-2 col-sm-3 col-xs-4 paddingright-clear">
+                                    <img class="img-thumbnail img-responsive" src="@ad.ThumbImgUrl" alt="@ad.Title" title="@ad.Title ">
+                                </div>
+                                <div class="col-md-10 col-sm-9">
                                     <p>
                                         @ad.Description
                                     </p>

src/Masuit.MyBlogs.Core/Views/Seminar/Index.cshtml

@@ -85,37 +85,40 @@
         {
             <h3>Oops！抱歉~本专题没有收录相关的文章或资源！如果您有相关的结果，您可以 <a asp-controller="Post" asp-action="Publish" class="btn btn-info btn-lg">点击这里</a> 投稿哦！</h3>
         }
-        <div class="pull-left">
-            @{ await Html.RenderPartialAsync("_Pagination", page); }
-        </div>
-        <div class="btn-group pull-right dropup">
-            <a asp-controller="Post" asp-action="All" class="btn btn-info">所有专题</a>
-            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                @(page.OrderBy?.GetDescription()??"排序方式")
-                <span class="caret"></span>
-            </button>
-            <ul class="dropdown-menu">
-                <li>
-                    <a href="">最后修改日期</a>
-                </li>
-                <li>
-                    <a asp-route-orderby="@OrderBy.PostDate">最后发表日期</a>
-                </li>
-                <li role="separator" class="divider"></li>
-                <li>
-                    <a asp-route-orderby="@OrderBy.CommentCount">评论最多</a>
-                </li>
-                <li>
-                    <a asp-route-orderby="@OrderBy.TotalViewCount">访问量最多</a>
-                </li>
-                <li>
-                    <a asp-route-orderby="@OrderBy.VoteUpCount">支持最多</a>
-                </li>
-                <li>
-                    <a asp-route-orderby="@OrderBy.AverageViewCount">最热门</a>
-                </li>
-            </ul>
+        <div class="row">
+            <div class="col-xs-8">
+                @{ await Html.RenderPartialAsync("_Pagination", page); }
+            </div>
+            <div class="col-sm-4 text-right">
+                <div class="btn-group dropup">
+                    <a asp-controller="Post" asp-action="All" class="btn btn-info">所有专题</a>
+                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                        @(page.OrderBy?.GetDescription()??"排序方式")
+                        <span class="caret"></span>
+                    </button>
+                    <ul class="dropdown-menu">
+                        <li>
+                            <a href="">最后修改日期</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.PostDate">最后发表日期</a>
+                        </li>
+                        <li role="separator" class="divider"></li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.CommentCount">评论最多</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.TotalViewCount">访问量最多</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.VoteUpCount">支持最多</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.AverageViewCount">最热门</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
         </div>
-        <div class="height50"></div>
     </div>
 </div>

src/Masuit.MyBlogs.Core/Views/Shared/_ArticleListAdvertisement.cshtml

@@ -9,10 +9,10 @@
         </a>
         <a asp-controller="Advertisement" asp-action="Redirect" asp-route-id="@Model.Id" target="_blank" id="@Stopwatch.GetTimestamp()">
             <div class="row padding-bot10">
-                <div class="col-md-2 col-xs-12 paddingright-clear">
+                <div class="col-sm-2 hidden-xs paddingright-clear">
                     <img class="img-thumbnail img-responsive" src="@Model.ThumbImgUrl" alt="@Model.Title" title="@Model.Title">
                 </div>
-                <div class="col-md-10 col-xs-12">
+                <div class="col-sm-10 col-xs-12">
                     <p>
                         @Model.Description
                     </p>

src/Masuit.MyBlogs.Core/Views/Shared/_ArticleListPartial.cshtml

@@ -33,36 +33,39 @@
                 }
             }
         }
-        <div class="pull-left">
-            @{ await Html.RenderPartialAsync("_Pagination", Model.PageParams); }
-        </div>
-        <div class="btn-group pull-right dropup">
-            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                @(Model.PageParams.OrderBy?.GetDescription()??"排序方式")
-                <span class="caret"></span>
-            </button>
-            <ul class="dropdown-menu">
-                <li>
-                    <a href="">最后修改日期</a>
-                </li>
-                <li>
-                    <a asp-route-orderby="@OrderBy.PostDate">最后发表日期</a>
-                </li>
-                <li role="separator" class="divider"></li>
-                <li>
-                    <a asp-route-orderby="@OrderBy.CommentCount">评论最多</a>
-                </li>
-                <li>
-                    <a asp-route-orderby="@OrderBy.TotalViewCount">访问量最多</a>
-                </li>
-                <li>
-                    <a asp-route-orderby="@OrderBy.VoteUpCount">支持最多</a>
-                </li>
-                <li>
-                    <a asp-route-orderby="@OrderBy.AverageViewCount">最热门</a>
-                </li>
-            </ul>
+        <div class="row">
+            <div class="col-xs-9">
+                @{ await Html.RenderPartialAsync("_Pagination", Model.PageParams); }
+            </div>
+            <div class="col-sm-3 text-right">
+                <div class="btn-group dropup">
+                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                        @(Model.PageParams.OrderBy?.GetDescription()??"排序方式")
+                        <span class="caret"></span>
+                    </button>
+                    <ul class="dropdown-menu">
+                        <li>
+                            <a href="">最后修改日期</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.PostDate">最后发表日期</a>
+                        </li>
+                        <li role="separator" class="divider"></li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.CommentCount">评论最多</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.TotalViewCount">访问量最多</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.VoteUpCount">支持最多</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.AverageViewCount">最热门</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
         </div>
-        <div class="height50"></div>
     </div>
 </div>

src/Masuit.MyBlogs.Core/Views/Shared/_ArticleListPartial_Admin.cshtml

@@ -33,38 +33,39 @@
                 }
             }
         }
-        <div class="pull-left">
-            @{ await Html.RenderPartialAsync("_Pagination", Model.PageParams); }
-        </div>
-        <div class="pull-right">
-            <div class="btn-group dropup">
-                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                    @(Model.PageParams.OrderBy?.GetDescription()??"排序方式")
-                    <span class="caret"></span>
-                </button>
-                <ul class="dropdown-menu">
-                    <li>
-                        <a href="">最后修改日期</a>
-                    </li>
-                    <li>
-                        <a asp-route-orderby="@OrderBy.PostDate">最后发表日期</a>
-                    </li>
-                    <li role="separator" class="divider"></li>
-                    <li>
-                        <a asp-route-orderby="@OrderBy.CommentCount">评论最多</a>
-                    </li>
-                    <li>
-                        <a asp-route-orderby="@OrderBy.TotalViewCount">访问量最多</a>
-                    </li>
-                    <li>
-                        <a asp-route-orderby="@OrderBy.VoteUpCount">支持最多</a>
-                    </li>
-                    <li>
-                        <a asp-route-orderby="@OrderBy.AverageViewCount">最热门</a>
-                    </li>
-                </ul>
+        <div class="row">
+            <div class="col-xs-9">
+                @{ await Html.RenderPartialAsync("_Pagination", Model.PageParams); }
+            </div>
+            <div class="col-sm-3 text-right">
+                <div class="btn-group dropup">
+                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                        @(Model.PageParams.OrderBy?.GetDescription()??"排序方式")
+                        <span class="caret"></span>
+                    </button>
+                    <ul class="dropdown-menu">
+                        <li>
+                            <a href="">最后修改日期</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.PostDate">最后发表日期</a>
+                        </li>
+                        <li role="separator" class="divider"></li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.CommentCount">评论最多</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.TotalViewCount">访问量最多</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.VoteUpCount">支持最多</a>
+                        </li>
+                        <li>
+                            <a asp-route-orderby="@OrderBy.AverageViewCount">最热门</a>
+                        </li>
+                    </ul>
+                </div>
             </div>
         </div>
-        <div class="height50"></div>
     </div>
 </div>

src/Masuit.MyBlogs.Core/wwwroot/Content/common/style.css

@@ -519,7 +519,4 @@ Custom bottom spacer
 
 .mp-popup {
     max-height: 100vh !important;
-}
-.height50 {
-    height: 50px;
 }