增加FontAwesome与Glyphicon两种图标选择视图
This commit is contained in:
parent
f38ffa51be
commit
2f7bb03626
|
@ -153,6 +153,7 @@
|
||||||
<Content Include="Content\js\messages_zh.js" />
|
<Content Include="Content\js\messages_zh.js" />
|
||||||
<Content Include="Content\js\messages_zh.min.js" />
|
<Content Include="Content\js\messages_zh.min.js" />
|
||||||
<Content Include="Scripts\Groups.js" />
|
<Content Include="Scripts\Groups.js" />
|
||||||
|
<Content Include="Scripts\icon.js" />
|
||||||
<Content Include="Scripts\Login.js" />
|
<Content Include="Scripts\Login.js" />
|
||||||
<Content Include="Scripts\Roles.js" />
|
<Content Include="Scripts\Roles.js" />
|
||||||
<Content Include="Scripts\Users.js" />
|
<Content Include="Scripts\Users.js" />
|
||||||
|
@ -219,6 +220,7 @@
|
||||||
<Content Include="Views\Admin\FAIcon.cshtml" />
|
<Content Include="Views\Admin\FAIcon.cshtml" />
|
||||||
<Content Include="Views\Admin\Groups.cshtml" />
|
<Content Include="Views\Admin\Groups.cshtml" />
|
||||||
<Content Include="Views\Admin\Roles.cshtml" />
|
<Content Include="Views\Admin\Roles.cshtml" />
|
||||||
|
<Content Include="Views\Shared\Glyphicons.cshtml" />
|
||||||
<None Include="Web.Debug.config">
|
<None Include="Web.Debug.config">
|
||||||
<DependentUpon>Web.config</DependentUpon>
|
<DependentUpon>Web.config</DependentUpon>
|
||||||
</None>
|
</None>
|
||||||
|
|
|
@ -1,4 +1,8 @@
|
||||||
.fontawesome-icon-list .fa-hover a {
|
body {
|
||||||
|
padding-top: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fontawesome-icon-list .fa-hover a {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
|
@ -28,3 +32,46 @@
|
||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
vertical-align: -6px;
|
vertical-align: -6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.fontawesome-icon-list ul {
|
||||||
|
display: block;
|
||||||
|
margin-left: -28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fontawesome-icon-list ul li {
|
||||||
|
overflow: hidden;
|
||||||
|
list-style: none;
|
||||||
|
float: left;
|
||||||
|
padding-left: 10px;
|
||||||
|
padding-right: 15px;
|
||||||
|
padding-top: 2px;
|
||||||
|
padding-bottom: 4px;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
line-height: 32px;
|
||||||
|
height: 32px;
|
||||||
|
white-space: nowrap;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fontawesome-icon-list ul li:hover {
|
||||||
|
background-color: #1d9d74;
|
||||||
|
color: #fff;
|
||||||
|
text-decoration: none;
|
||||||
|
border-radius: 4px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fontawesome-icon-list ul li:hover span:nth-child(1) {
|
||||||
|
font-size: 28px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fontawesome-icon-list ul li span:nth-child(1) {
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.col-sm-6 {
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
Binary file not shown.
|
@ -0,0 +1,12 @@
|
||||||
|
$(function () {
|
||||||
|
$('.fontawesome-icon-list a').click(function () {
|
||||||
|
window.console.log($(this).children('i').attr('class'));
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fontawesome-icon-list ul li').click(function () {
|
||||||
|
window.console.log($(this).children('span:first').attr('class'));
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fontawesome-icon-list ul li').addClass('col-md-3 col-sm-4');
|
||||||
|
});
|
|
@ -6,4 +6,22 @@
|
||||||
<link href="~/Content/css/fa.css" rel="stylesheet" />
|
<link href="~/Content/css/fa.css" rel="stylesheet" />
|
||||||
<link href="~/Content/css/font-awesome.css" rel="stylesheet" />
|
<link href="~/Content/css/font-awesome.css" rel="stylesheet" />
|
||||||
}
|
}
|
||||||
@Html.Partial("AwesomeIcon")
|
@section javascript {
|
||||||
|
<script src="~/Scripts/icon.js"></script>
|
||||||
|
}
|
||||||
|
<section class="container">
|
||||||
|
<section>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-lg-12">
|
||||||
|
<ul class="nav nav-tabs" role="tablist">
|
||||||
|
<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 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>
|
||||||
|
</section>
|
||||||
|
</section>
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue