增加功能：增加一个置顶的蓝色Bar，UI美化

Bootstrap.Admin/Content/admin-responsive.css

@@ -25,7 +25,7 @@
 
 @media (min-width: 768px) {
     .sidebar {
-        top: 94px;
+        top: 98px;
         bottom: 40px;
         position: absolute;
         overflow: auto;
@@ -105,7 +105,7 @@
 
 @media (min-height: 672px) {
     .sidebar {
-        top: 94px;
+        top: 98px;
         bottom: 40px;
         position: absolute;
         overflow: auto;

Bootstrap.Admin/Content/admin.css

@@ -142,7 +142,7 @@
     left: 0;
     bottom: 40px;
     right: 0;
-    top: 94px;
+    top: 98px;
 }
 
     .main-content.open {
@@ -166,7 +166,7 @@ aside {
     transform: translate(-100%);
     height: 100%;
     position: absolute;
-    top: 94px;
+    top: 98px;
     bottom: 40px;
     left: 0;
     right: 0;

Bootstrap.Admin/Content/nprogress.css

@@ -1,79 +1,79 @@
-/* Make clicks pass-through */
-#nprogress {
-    pointer-events: none;
-}
-
-    #nprogress .bar {
-        background: #29d;
-        position: fixed;
-        z-index: 1031;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 2px;
-    }
-
-    /* Fancy blur effect */
-    #nprogress .peg {
-        display: block;
-        position: absolute;
-        right: 0px;
-        width: 100px;
-        height: 100%;
-        box-shadow: 0 0 10px #29d, 0 0 5px #29d;
-        opacity: 1.0;
-        -webkit-transform: rotate(3deg) translate(0px, -4px);
-        -ms-transform: rotate(3deg) translate(0px, -4px);
-        transform: rotate(3deg) translate(0px, -4px);
-    }
-
-    /* Remove these to get rid of the spinner */
-    #nprogress .spinner {
-        display: block;
-        position: fixed;
-        z-index: 1031;
-        top: 19px;
-        right: 17px;
-    }
-
-    #nprogress .spinner-icon {
-        width: 18px;
-        height: 18px;
-        box-sizing: border-box;
-        border: solid 2px transparent;
-        border-top-color: #29d;
-        border-left-color: #29d;
-        border-radius: 50%;
-        -webkit-animation: nprogress-spinner 400ms linear infinite;
-        animation: nprogress-spinner 400ms linear infinite;
-    }
-
-.nprogress-custom-parent {
-    overflow: hidden;
-    position: relative;
-}
-
-    .nprogress-custom-parent #nprogress .spinner,
-    .nprogress-custom-parent #nprogress .bar {
-        position: absolute;
-    }
-
-@-webkit-keyframes nprogress-spinner {
-    0% {
-        -webkit-transform: rotate(0deg);
-    }
-
-    100% {
-        -webkit-transform: rotate(360deg);
-    }
-}
-
-@keyframes nprogress-spinner {
-    0% {
-        transform: rotate(0deg);
-    }
-
-    100% {
-        transform: rotate(360deg);
-    }
-}
+/* Make clicks pass-through */
+#nprogress {
+    pointer-events: none;
+}
+
+    #nprogress .bar {
+        background: #29d;
+        position: fixed;
+        z-index: 1031;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 4px;
+    }
+
+    /* Fancy blur effect */
+    #nprogress .peg {
+        display: block;
+        position: absolute;
+        right: 0px;
+        width: 100px;
+        height: 100%;
+        box-shadow: 0 0 10px #29d, 0 0 5px #29d;
+        opacity: 1.0;
+        -webkit-transform: rotate(3deg) translate(0px, -4px);
+        -ms-transform: rotate(3deg) translate(0px, -4px);
+        transform: rotate(3deg) translate(0px, -4px);
+    }
+
+    /* Remove these to get rid of the spinner */
+    #nprogress .spinner {
+        display: block;
+        position: fixed;
+        z-index: 1031;
+        top: 22px;
+        right: 17px;
+    }
+
+    #nprogress .spinner-icon {
+        width: 18px;
+        height: 18px;
+        box-sizing: border-box;
+        border: solid 2px transparent;
+        border-top-color: #29d;
+        border-left-color: #29d;
+        border-radius: 50%;
+        -webkit-animation: nprogress-spinner 400ms linear infinite;
+        animation: nprogress-spinner 400ms linear infinite;
+    }
+
+.nprogress-custom-parent {
+    overflow: hidden;
+    position: relative;
+}
+
+    .nprogress-custom-parent #nprogress .spinner,
+    .nprogress-custom-parent #nprogress .bar {
+        position: absolute;
+    }
+
+@-webkit-keyframes nprogress-spinner {
+    0% {
+        -webkit-transform: rotate(0deg);
+    }
+
+    100% {
+        -webkit-transform: rotate(360deg);
+    }
+}
+
+@keyframes nprogress-spinner {
+    0% {
+        transform: rotate(0deg);
+    }
+
+    100% {
+        transform: rotate(360deg);
+    }
+}

Bootstrap.Admin/Content/site-responsive.css

@@ -16,6 +16,10 @@
         overflow: hidden;
     }
 
+    .header {
+        border-bottom: none;
+    }
+
     .header, .site-footer {
         position: fixed;
         z-index: 10;

Bootstrap.Admin/Content/site.css

@@ -40,14 +40,20 @@ a, a:hover, a:focus {
 
 .header {
     padding: 0 15px;
-    height: 94px;
+    height: 98px;
     background: #fff;
-    border-bottom: 1px solid #f1f2f7;
+    border-bottom: 1px solid #ddd;
     top: 0;
     left: 0;
     right: 0;
 }
 
+    .header .bg {
+        background-color: #337ab7;
+        height: 4px;
+        margin: 0 -15px;
+    }
+
     .header a {
         transition: all .25s linear;
     }
@@ -405,12 +411,11 @@ a, a:hover, a:focus {
 
 .breadcrumb {
     position: absolute;
-    top: 56px;
+    top: 60px;
     left: 15px;
     right: 15px;
-    border-color: #ddd;
+    border: solid 1px #ddd;
     border-width: 1px 0 0 0;
-    border-style: solid;
     background-color: transparent;
     border-top-left-radius: 0;
     border-top-right-radius: 0;
@@ -433,7 +438,7 @@ a, a:hover, a:focus {
     left: 0;
     bottom: 40px;
     right: 0;
-    top: 94px;
+    top: 98px;
     overflow: hidden;
 }
 

Bootstrap.Admin/Views/Shared/Header.cshtml

@@ -1,5 +1,7 @@
 @model HeaderBarModel
 <header class="header">
+    <div class="bg">
+    </div>
     <a id="navbar" href="#" class="sidebar-toggle-box">
         <i class="fa fa-bars"></i>
         <span id="websiteTitle">@Model.Title</span>