移除Glyphicons图标集

Bootstrap.Admin/Bootstrap.Admin.csproj

@@ -224,7 +224,6 @@
     <Content Include="Content\fonts\fontawesome-webfont.eot" />
     <Content Include="Content\fonts\fontawesome-webfont.woff2" />
     <Content Include="Content\fonts\FontAwesome.otf" />
-    <Content Include="Content\css\fa.responsive.css" />
     <Content Include="packages.config" />
     <None Include="Scripts\_references.js" />
     <Content Include="Content\js\framework.js" />
@@ -299,7 +298,6 @@
     <Content Include="Views\Admin\Roles.cshtml" />
     <Content Include="Views\Admin\Menus.cshtml" />
     <Content Include="Views\Admin\Dicts.cshtml" />
-    <Content Include="Views\Shared\Glyphicons.cshtml" />
     <Content Include="Views\Shared\RoleConfig.cshtml" />
     <Content Include="Views\Shared\IconView.cshtml" />
     <Content Include="Views\Shared\UserConfig.cshtml" />

Bootstrap.Admin/Content/css/fa.css

@@ -1,12 +1,85 @@
-.modal-body #fa-top {
+.page-header {
-    float: left;
+    margin-top: 40px;
-    margin-top: -15px;
 }
 
-.modal-body #fa-bottom {
+.fa-target {
-    clear: both;
+    height: 16px;
-    float: right;
+    display: block;
-    margin-bottom: -15px;
+}
+
+.fa-nav {
+    display: none;
+}
+
+    .fa-nav h2 {
+        background: #FF6C60;
+        color: #fff;
+        margin-top: 0;
+        padding: 10px 15px;
+        font-size: 16px;
+        border-radius: 4px;
+        font-weight: 300;
+    }
+
+    .fa-nav ul {
+        top: 44px;
+        bottom: 0;
+        position: absolute;
+        overflow-y: auto;
+    }
+
+        .fa-nav ul li {
+            margin-bottom: 3px;
+        }
+
+            .fa-nav ul li.active a {
+                color: #7a7a7a;
+                border-left: 4px solid #5bc0de;
+                padding-left: 10px;
+            }
+
+            .fa-nav ul li a {
+                color: #999797;
+                border-left: 4px solid #d3d7dd;
+                padding-left: 10px;
+                padding-top: 3px;
+                padding-bottom: 3px;
+                display: block;
+            }
+
+                .fa-nav ul li a:hover {
+                    color: #999797;
+                    border-left: 4px solid #d9534f;
+                    padding-left: 10px;
+                }
+
+@media (min-width: 768px) {
+    .fa-nav {
+        display: block;
+        position: fixed;
+        top: 130px;
+        right: 32px;
+        width: 140px;
+        bottom: 70px;
+    }
+
+    .fa-icons {
+        margin-right: 160px;
+    }
+}
+
+@media (max-width: 360px) {
+    .icon-content .modal-footer span {
+        display: none;
+    }
+}
+
+@media (max-height: 768px) {
+    .menu-content {
+        top: 20px;
+        position: fixed;
+        width: inherit;
+    }
 }
 
 .form-group .input-group .input-group-btn .btn i {
@@ -19,71 +92,6 @@
         width: auto;
     }
 
-.icon-body {
-    margin-right: 160px;
-}
-
-    .icon-body .page-header {
-        padding: 16px 0;
-    }
-
-.fb-timeliner {
-    position: fixed;
-    top: 96px;
-    right: 46px;
-    width: 140px;
-    bottom: 100px;
-}
-
-    .fb-timeliner ul {
-        top: 44px;
-        width: 150px;
-        bottom: 0;
-        position: absolute;
-        overflow-y: auto;
-        padding-left: 6px;
-    }
-
-        .fb-timeliner ul li {
-            margin-bottom: 3px;
-        }
-
-            .fb-timeliner ul li.active a {
-                color: #7a7a7a;
-                border-left: 4px solid #5bc0de;
-                padding-left: 10px;
-            }
-
-            .fb-timeliner ul li a {
-                color: #999797;
-                border-left: 4px solid #d3d7dd;
-                padding-left: 10px;
-                padding-top: 3px;
-                padding-bottom: 3px;
-                display: block;
-            }
-
-                .fb-timeliner ul li a:hover {
-                    color: #999797;
-                    border-left: 4px solid #d9534f;
-                    padding-left: 10px;
-                }
-
-    .fb-timeliner h2 {
-        background: #828283;
-        color: #fff;
-        margin-top: 0;
-        padding: 10px 15px;
-        font-size: 16px;
-        border-radius: 4px;
-        -webkit-border-radius: 4px;
-        font-weight: 300;
-    }
-
-.recent-highlight {
-    background: #FF6C60 !important;
-}
-
 .icon-content {
     position: fixed;
     top: 15px;
@@ -94,6 +102,12 @@
     display: none;
 }
 
+    .icon-content .fa-nav {
+        right: 46px;
+        top: 86px;
+        bottom: 100px;
+    }
+
     .icon-content .modal-body {
         position: fixed;
         left: 18px;
@@ -225,17 +239,3 @@
     .menu-content .dd {
         max-width: inherit;
     }
-
-.faicon {
-    padding-bottom: 15px;
-}
-
-    .faicon .fb-timeliner {
-        top: 130px;
-        right: 32px;
-        bottom: 70px;
-    }
-
-.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
-    background-color: #41CAC0;
-}

Bootstrap.Admin/Content/css/fa.responsive.css

@@ -1,19 +0,0 @@
-@media (max-width: 768px) {
-    .fb-timeliner {
-        display: none;
-    }
-}
-
-@media (max-width: 360px) {
-    .icon-content .modal-footer span {
-        display: none;
-    }
-}
-
-@media (max-height: 768px) {
-    .menu-content {
-        top: 20px;
-        position: fixed;
-        width: inherit;
-    }
-}

Bootstrap.Admin/Scripts/Menus.js

@@ -242,13 +242,12 @@
         callback: function (result) {
             if (result) {
                 $dialogIcon.find('.modal-body').html(result);
-                var $iconList = $('#iconTab').find('div.fontawesome-icon-list');
+                var $iconList = $('div.fontawesome-icon-list').on('click', 'div.fa-hover a, ul li', function () {
-                $iconList.find('ul li').addClass('col-md-3 col-sm-4 col-xs-6');
-                $iconList.find('div').addClass('col-xs-6');
-                $iconList.on('click', 'div.fa-hover a, ul li', function () {
                     $pickIcon.attr('class', $(this).find('i, span:first').attr('class'));
                     return false;
                 });
+                $iconList.find('ul li').addClass('col-md-3 col-sm-4 col-xs-6');
+                $iconList.find('div').addClass('col-xs-6');
             }
         }
     });

Bootstrap.Admin/Scripts/icon.js

@@ -1,22 +1,11 @@
 $(function () {
-    var $iconList = $('#iconTab').find('div.fontawesome-icon-list');
+    var $iconList = $('div.fontawesome-icon-list').on('click', 'a', function () {
-    var $main = $('#main-content');
-    var $tl = $('#timeline');
-
-    $iconList.on('click', 'a', function () {
         window.console.log($(this).children('i').attr('class'));
         return false;
     });
 
-    $iconList.on('click', 'ul li', function () {
-        window.console.log($(this).children('span:first').attr('class'));
-    });
     $iconList.find('ul li').addClass('col-md-3 col-sm-4 col-xs-6');
     $iconList.find('div').addClass('col-xs-6');
 
-    $main.scrollspy({ offset: 150, target: '#timeline' });
+    $('#main-content').scrollspy({ offset: 150, target: '.fa-nav' });
-    $('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
-        if (e.target.href.indexOf("#Glyphicons") > -1) $tl.attr('style', 'display: none;');
-        else $tl.removeAttr('style');
-    })
 });

Bootstrap.Admin/Views/Admin/FAIcon.cshtml

@@ -5,11 +5,8 @@
 }
 @section css {
     <link href="~/Content/css/fa.css" rel="stylesheet" />
-    <link href="~/Content/css/fa.responsive.css" rel="stylesheet" />
 }
 @section javascript {
     <script src="~/Scripts/icon.js"></script>
 }
-<div class="faicon">
+@Html.Partial("IconView")
-    @Html.Partial("IconView")
-</div>

Bootstrap.Admin/Views/Admin/Menus.cshtml

@@ -5,7 +5,6 @@
 }
 @section css {
     <link href="~/Content/css/fa.css" rel="stylesheet" />
-    <link href="~/Content/css/fa.responsive.css" rel="stylesheet" />
     <link href="~/Content/css/jquery.nestable.css" rel="stylesheet" />
 }
 @section Javascript {
@@ -186,7 +185,7 @@
             <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
             <h4 class="modal-title" id="myIconModalLabel">请选择图标</h4>
         </div>
-        <div class="modal-body" data-spy="scroll" data-target=".fb-timeliner">
+        <div class="modal-body" data-spy="scroll" data-target=".fa-nav">
             <div class="loadIconView"><i class="fa fa-spinner fa-pulse"></i><span>正在加载图标...请稍等</span></div>
         </div>
         <div class="modal-footer">

Bootstrap.Admin/Views/Shared/IconView.cshtml

@@ -1,16 +1,9 @@
-<i id="fa-top"></i>
+<i id="fa-top" class="fa-target"></i>
-<div class="icon-body">
+<div class="fa-icons">
-    <ul class="nav nav-tabs" role="tablist">
+    @Html.Partial("AwesomeIcon")
-        <li role="presentation" class="active"><a href="#Fontawesome" data-toggle="tab">Fontawesome 图标</a></li>
-        <li role="presentation"><a href="#Glyphicons" data-toggle="tab">Glyphicons 图标</a></li>
-    </ul>
-    <div id="iconTab" class="tab-content">
-        <div role="tabpanel" class="tab-pane active" id="Fontawesome">@Html.Partial("AwesomeIcon")</div>
-        <div role="tabpanel" class="tab-pane" id="Glyphicons">@Html.Partial("Glyphicons")</div>
-    </div>
 </div>
-<div id="timeline" class="fb-timeliner">
+<div class="fa-nav">
-    <h2 class="recent-highlight">图标分类</h2>
+    <h2>图标分类</h2>
     <ul class="nav navbar">
         <li><a href="#new">新图标</a></li>
         <li><a href="#web-application">Web 图标</a></li>
@@ -33,4 +26,4 @@
         <li><a href="#fa-bottom">返回底部</a></li>
     </ul>
 </div>
-<i id="fa-bottom"></i>
+<i id="fa-bottom" class="fa-target"></i>