fixed: 字体图标

master
zhizou 2019-08-30 14:23:05 +08:00
parent 66cdb1ed28
commit 6e6031f0a9
21 changed files with 21 additions and 4018 deletions

View File

@ -1,11 +1,11 @@
@import "../lib/layui/css/layui.css";
@import "../lib/fonts/okfont.css";
@import "../lib/fonts/myfont.css";
@import "../lib/fonts/okfont/iconfont.css";
/*@import "../lib/fonts/myfont.css";*/
#navBar .layui-nav-child {
/*transition: height .5s;*/
overflow: hidden;
padding: 5px 0 !important;
padding: 0 !important;
}
#navBar .layui-nav-itemed .layui-nav-child,

View File

@ -3,7 +3,7 @@
"title": "控制台",
"href": "pages/console.html",
"fontFamily": "ok-icon",
"icon": "",
"icon": "",
"spread": true,
"isCheck": true
},
@ -11,7 +11,7 @@
"title": "控制台示例",
"href": "",
"fontFamily": "ok-icon",
"icon": "",
"icon": "",
"children": [
{
"title": "控制台一",
@ -55,8 +55,8 @@
"children": [
{
"title": "地图",
"fontFamily": "my-icon",
"icon": "my-iconditu",
"fontFamily": "ok-icon",
"icon": "",
"spread": false,
"children": [
{
@ -75,8 +75,8 @@
},
{
"title": "数据图",
"fontFamily": "my-icon",
"icon": "my-icontubiao",
"fontFamily": "ok-icon",
"icon": "ok-icon-shuju1",
"spread": false,
"children": [
{
@ -166,7 +166,8 @@
{
"title": "系统管理",
"href": "",
"icon": "",
"fontFamily": "ok-icon",
"icon": "",
"spread": false,
"children": [
{
@ -243,7 +244,7 @@
{
"title": "多级导航",
"fontFamily": "ok-icon",
"icon": "ok-iconnavigation-2",
"icon": "",
"spread": false,
"children": [
{
@ -305,36 +306,36 @@
{
"title": "框架使用",
"fontFamily": "ok-icon",
"icon": "",
"icon": "ok-icon-yooxi",
"spread": false,
"children": [
{
"title": "字体图标",
"href": "pages/other/okfont.html",
"href": "pages/help/ok_font.html",
"icon": "",
"spread": false
},
{
"title": "插件目录",
"href": "pages/help/plugDirectory.html",
"href": "pages/help/plug_directory.html",
"icon": "",
"spread": false
},
{
"title": "内部添加导航",
"href": "pages/help/navOperate.html",
"href": "pages/help/nav_operate.html",
"icon": "",
"spread": false
},
{
"title": "导航的图标",
"href": "pages/help/navIcon.html",
"href": "pages/help/nav_icon.html",
"icon": "",
"spread": false
},
{
"title": "导航的参数",
"href": "pages/help/navParameter.html",
"href": "pages/help/nav_parameter.html",
"icon": "",
"spread": false
}

View File

@ -44,7 +44,7 @@
<li class="no-line layui-nav-item layui-hide-xs">
<a id="lock" class="flex-vc pr10 pl10" href="javascript:">
<i class="ok-iconlock_outline icon-head-i"></i><cite>锁屏</cite>
<i class="ok-icon ok-icon-lock icon-head-i"></i><cite>锁屏</cite>
</a>
</li>
@ -88,7 +88,7 @@
<ul id="navBar" class="layui-nav okadmin-nav okadmin-bg-20222A layui-nav-tree">
<li class="layui-nav-item layui-this">
<a href="javascript:" lay-id="1" data-url="pages/console.html">
<i is-close=false class="ok-icon ok-iconairplay"></i>
<i is-close=false class="ok-icon ok-icon-kongzhitai"></i>
控制台
</a>
</li>
@ -116,7 +116,7 @@
<ul id="tabTitle" class="layui-tab-title ok-tab-title not-scroll">
<li class="layui-this" lay-id="1" tab="index">
<i class="ok-icon ok-iconairplay"></i>
<i class="ok-icon ok-icon-kongzhitai"></i>
<cite is-close=false>控制台</cite>
</li>
</ul>

View File

@ -1,23 +0,0 @@
@font-face {font-family: "my-icon";
src: url('myfont/iconfont.eot?t=1555493820158'); /* IE9 */
src: url('myfont/iconfont.eot?t=1555493820158#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('myfont/iconfont.woff?t=1555493820158') format('woff'),
url('myfont/iconfont.ttf?t=1555493820158') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
url('myfont/iconfont.svg?t=1555493820158#my-icon') format('svg'); /* iOS 4.1- */
}
.my-icon {
font-family: "my-icon" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.my-icontubiao:before {
content: "\e670";
}
.my-iconditu:before {
content: "\e61f";
}

Binary file not shown.

View File

@ -1,32 +0,0 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<!--
2013-9-30: Created.
-->
<svg>
<metadata>
Created by iconfont
</metadata>
<defs>
<font id="myfont" horiz-adv-x="1024" >
<font-face
font-family="myfont"
font-weight="500"
font-stretch="normal"
units-per-em="1024"
ascent="896"
descent="-128"
/>
<missing-glyph />
<glyph glyph-name="tubiao" unicode="&#58992;" d="M929.295093 22.525032 119.673029 22.525032 63.904067 22.525032 63.904067 78.396323l0 586.341561c0 15.451584 12.484061 27.935645 27.935645 27.935645 15.451584 0 27.935645-12.484061 27.935645-27.935645l0-586.341561 809.622065 0c15.451584 0 27.935645-12.484061 27.935645-27.935645C957.230738 35.009094 944.746677 22.525032 929.295093 22.525032L929.295093 22.525032zM845.590487 134.267613l-55.87129 0c-30.800839 0-55.87129 24.968122-55.87129 55.87129L733.847906 525.059658c0 30.800839 24.968122 55.87129 55.87129 55.87129l55.87129 0c30.800839 0 55.87129-24.968122 55.87129-55.87129l0-335.023084C901.461777 159.235735 876.391326 134.267613 845.590487 134.267613L845.590487 134.267613zM566.438693 134.267613l-55.87129 0c-30.800839 0-55.87129 24.968122-55.87129 55.87129L454.696113 692.5712c0 30.800839 24.968122 55.87129 55.87129 55.87129l55.87129 0c30.800839 0 55.87129-24.968122 55.87129-55.87129l0-502.534626C622.207655 159.235735 597.239532 134.267613 566.438693 134.267613L566.438693 134.267613zM287.184571 134.267613l-55.87129 0c-30.800839 0-55.87129 24.968122-55.87129 55.87129L175.441991 413.419406c0 30.800839 24.968122 55.87129 55.87129 55.87129l55.87129 0c30.800839 0 55.87129-24.968122 55.87129-55.87129l0-223.382832C343.055861 159.235735 318.087739 134.267613 287.184571 134.267613L287.184571 134.267613z" horiz-adv-x="1024" />
<glyph glyph-name="ditu" unicode="&#58911;" d="M1234.510488 802.354994l-60.805127-27.42474c-2.769714-1.245272-6.094387-0.830745-8.447882 0.969485l-61.082606 47.36939c-0.277479 0.277479-0.692006 0.554958-0.969485 0.832437l-62.882836 65.789598c-1.384011 1.385703-3.32298 2.355188-5.26195 2.493927l-40.860477 3.600459c-1.80023 0.13874-3.739199-0.275787-5.263642-1.384011l-34.625659-22.716057c-1.663182-1.108224-2.908454-2.769714-3.463412-4.569944l-23.961328-81.441783c-0.692006-2.493927-2.493927-4.432896-4.847423-5.402381l-27.42474-10.94181c-3.185933-1.246964-5.263642-4.294157-5.263642-7.757569l0-28.116746c0-3.877938 2.769714-7.339658 6.510605-8.172095l56.094752-12.050034c7.202611-1.522751 9.002841-11.080549 2.769714-15.097227l-54.572001-35.319356c-0.275787-0.13874-0.553266-0.414527-0.830745-0.553266L781.175761 563.9836c-1.384011-1.245272-3.185933-1.80023-4.986163-1.938969l-52.770079-1.938969c-1.108224 0-2.077709-0.275787-3.047193-0.692006l-51.249021-22.714365c-2.214756-0.971177-4.847423-0.971177-6.925132 0.137048l-68.144786 32.965861c-0.830745 0.414527-1.663182 0.692006-2.632667 0.830745l-89.3364 10.664331c-3.047193 0.416219-5.541121 2.355188-6.647653 5.124902l-12.604992 30.888152c-0.830745 1.938969-2.216448 3.46172-4.155417 4.292465l-77.147626 37.121278c-2.632667 1.245272-4.432896 3.739199-4.710375 6.647653l-1.522751 16.619978c0 0.277479 0 0.693698 0 0.971177l0.969485 35.319356c0 1.66149-0.416219 3.184241-1.246964 4.569944l-32.825429 52.494292c-2.355188 3.739199-7.34135 4.986163-11.219289 2.769714l-53.463777-31.717205c-0.554958-0.416219-1.108224-0.832437-1.663182-1.246964l-11.911294-11.911294c-1.80023-1.801922-4.431205-2.632667-7.063871-2.355188l-27.147261 3.739199c-3.600459 0.554958-7.202611-1.522751-8.725362-4.847423l-12.880779-28.808751c-1.385703-3.047193-4.432896-4.986163-7.757569-4.849115l-35.041877 0.832437c-3.739199 0.137048-7.063871-2.355188-8.172095-5.8186l-19.667171-64.128108c-0.832437-2.908454-3.324672-5.124902-6.233126-5.678168l-93.354769-19.668863c-0.416219-0.13874-0.830745-0.13874-1.246964-0.414527l-51.247329-19.115597c-3.739199-1.384011-5.955647-5.26195-5.263642-9.278628l3.877938-21.469093c0.13874-0.554958 0.277479-1.108224 0.416219-1.524443l33.933653-86.150467c0-0.13874 0.13874-0.277479 0.13874-0.416219 1.938969-4.155417 31.580158-68.144786 31.163939-74.516651-0.416219-5.402381-15.097227-43.213973-20.222129-55.956012-1.108224-2.632667-0.692006-5.67986 0.969485-7.896308l13.296997-18.281468c0.416219-0.554958 0.830745-1.108224 1.385703-1.524443l111.636238-93.07729c0.554958-0.553266 1.246964-0.830745 1.940661-1.245272l172.302625-76.318573c1.66149-0.692006 3.46172-0.830745 5.124902-0.553266l103.464142 22.575625c1.938969 0.416219 4.016678 0.13874 5.816908-0.830745l40.305519-22.161098c3.463412-1.938969 5.124902-5.955647 3.87963-9.694846l-24.516286-79.641553c-0.969485-3.185933 0-6.649345 2.630975-8.727053l88.783134-75.208657c2.355188-1.938969 5.541121-2.493927 8.449574-1.385703l109.005263 43.352712c2.353496 0.969485 5.124902 0.693698 7.34135-0.692006l71.05324-43.352712c0.277479-0.13874 0.416219-0.277479 0.692006-0.416219l31.857637-23.822589c0.692006-0.553266 1.522751-0.969485 2.355188-1.246964l13.989003-4.569944c4.986163-1.663182 10.249804 1.66149 10.80307 6.925132l1.522751 14.543961c0.277479 2.630975 1.801922 5.12321 4.294157 6.370174l178.121225 98.340932c1.384011 0.830745 2.630975 1.938969 3.32298 3.46172l63.436102 122.441c0.693698 1.246964 0.971177 2.630975 0.971177 4.016678l-2.910146 97.785974c0 1.80023-0.692006 3.600459-1.938969 4.986163l-37.672852 45.569161-27.008522 34.211132c-2.355188 3.047193-2.355188 7.34135 0.137048 10.388544l41.413743 50.416584c0.830745 0.969485 1.80023 1.66149 2.908454 2.216448l0 0c6.926824 3.32298 6.094387 13.434045-1.384011 15.511754l-18.975166 5.263642c-0.693698 0.13874-1.385703 0.277479-2.216448 0.277479l-50.832802 0c-2.630975 0-5.124902 1.245272-6.647653 3.32298l-12.466252 17.174936c-2.630975 3.602151-1.938969 8.727053 1.524443 11.496768l61.497133 48.200135c5.539429 4.432896 13.711524 0.13874 13.434045-6.925132l-0.553266-10.94181c-0.277479-6.233126 5.955647-10.527283 11.633815-8.033356l26.040729 11.633815c0.830745 0.416219 1.522751 0.830745 2.077709 1.385703l122.439308 109.005263c1.524443 1.384011 2.632667 3.324672 2.769714 5.539429l5.402381 65.099284c0.277479 4.155417 3.739199 7.478398 7.894616 7.617137l12.327513 0.416219c4.294157 0.13874 7.617137 3.46172 7.894616 7.755877l5.816908 80.472299C1246.699261 800.416025 1240.188656 804.987661 1234.510488 802.354994L1234.510488 802.354994zM1084.922227 81.564335l-17.728202-54.018735 22.853104-32.133424 17.729894 34.211132 13.572785 36.288841-9.419059 25.901989L1084.922227 81.564335 1084.922227 81.564335zM796.827946-91.709467l-24.930813-15.513446 17.728202-20.775395 22.853104 5.124902 26.039037 24.930813-8.309143 14.543961L796.827946-91.709467 796.827946-91.709467z" horiz-adv-x="1247" />
</font>
</defs></svg>

Before

Width:  |  Height:  |  Size: 6.6 KiB

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -1,155 +0,0 @@
body {
padding: 0;
margin: 0;
font-family: sans-serif;
font-size: 1em;
line-height: 1.5;
color: #555;
background: #fff;
}
h1 {
font-size: 1.5em;
font-weight: normal;
}
small {
font-size: .66666667em;
}
a {
color: #e74c3c;
text-decoration: none;
}
a:hover, a:focus {
box-shadow: 0 1px #e74c3c;
}
.bshadow0, input {
box-shadow: inset 0 -2px #e7e7e7;
}
input:hover {
box-shadow: inset 0 -2px #ccc;
}
input, fieldset {
font-family: sans-serif;
font-size: 1em;
margin: 0;
padding: 0;
border: 0;
}
input {
color: inherit;
line-height: 1.5;
height: 1.5em;
padding: .25em 0;
}
input:focus {
outline: none;
box-shadow: inset 0 -2px #449fdb;
}
.glyph {
font-size: 16px;
width: 15em;
padding-bottom: 1em;
margin-right: 4em;
margin-bottom: 1em;
float: left;
overflow: hidden;
}
.liga {
width: 80%;
width: calc(100% - 2.5em);
}
.talign-right {
text-align: right;
}
.talign-center {
text-align: center;
}
.bgc1 {
background: #f1f1f1;
}
.fgc1 {
color: #999;
}
.fgc0 {
color: #000;
}
p {
margin-top: 1em;
margin-bottom: 1em;
}
.mvm {
margin-top: .75em;
margin-bottom: .75em;
}
.mtn {
margin-top: 0;
}
.mtl, .mal {
margin-top: 1.5em;
}
.mbl, .mal {
margin-bottom: 1.5em;
}
.mal, .mhl {
margin-left: 1.5em;
margin-right: 1.5em;
}
.mhmm {
margin-left: 1em;
margin-right: 1em;
}
.mls {
margin-left: .25em;
}
.ptl {
padding-top: 1.5em;
}
.pbs, .pvs {
padding-bottom: .25em;
}
.pvs, .pts {
padding-top: .25em;
}
.unit {
float: left;
}
.unitRight {
float: right;
}
.size1of2 {
width: 50%;
}
.size1of1 {
width: 100%;
}
.clearfix:before, .clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.hidden-true {
display: none;
}
.textbox0 {
width: 3em;
background: #f1f1f1;
padding: .25em .5em;
line-height: 1.5;
height: 1.5em;
}
#testDrive {
display: block;
padding-top: 24px;
line-height: 1.5;
}
.fs0 {
font-size: 16px;
}
.fs1 {
font-size: 24px;
}
.fs2 {
font-size: 24px;
}

View File

@ -1,30 +0,0 @@
if (!('boxShadow' in document.body.style)) {
document.body.setAttribute('class', 'noBoxShadow');
}
document.body.addEventListener("click", function(e) {
var target = e.target;
if (target.tagName === "INPUT" &&
target.getAttribute('class').indexOf('liga') === -1) {
target.select();
}
});
(function() {
var fontSize = document.getElementById('fontSize'),
testDrive = document.getElementById('testDrive'),
testText = document.getElementById('testText');
function updateTest() {
testDrive.innerHTML = testText.value || String.fromCharCode(160);
if (window.icomoonLiga) {
window.icomoonLiga(testDrive);
}
}
function updateSize() {
testDrive.style.fontSize = fontSize.value + 'px';
}
fontSize.addEventListener('change', updateSize, false);
testText.addEventListener('input', updateTest, false);
testText.addEventListener('change', updateTest, false);
updateSize();
}());

View File

@ -1,539 +0,0 @@
@font-face {
font-family: 'okicomoon';
src: url('okfont/okicomoon.eot?m7seco');
src: url('okfont/okicomoon.eot?m7seco#iefix') format('embedded-opentype'),
url('okfont/okicomoon.ttf?m7seco') format('truetype'),
url('okfont/okicomoon.woff?m7seco') format('woff'),
url('okfont/okicomoon.svg?m7seco#okicomoon') format('svg');
font-weight: normal;
font-style: normal;
}
[class^="ok-icon"], [class*=" ok-icon"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'okicomoon' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.ok-iconlock1:before {
content: "\e897";
}
.ok-iconlock_open:before {
content: "\e898";
}
.ok-iconlock_outline:before {
content: "\e899";
}
.ok-iconactivity:before {
content: "\e900";
}
.ok-iconairplay:before {
content: "\e901";
}
.ok-iconalert-circle:before {
content: "\e902";
}
.ok-iconalert-octagon:before {
content: "\e903";
}
.ok-iconalert-triangle:before {
content: "\e904";
}
.ok-iconalign-center:before {
content: "\e905";
}
.ok-iconalign-justify:before {
content: "\e906";
}
.ok-iconalign-left:before {
content: "\e907";
}
.ok-iconalign-right:before {
content: "\e908";
}
.ok-iconanchor:before {
content: "\e909";
}
.ok-iconarchive:before {
content: "\e90b";
}
.ok-iconarrow-down-circle:before {
content: "\e90c";
}
.ok-iconarrow-down-left:before {
content: "\e90d";
}
.ok-iconarrow-down-right:before {
content: "\e90e";
}
.ok-iconarrow-down:before {
content: "\e90f";
}
.ok-iconarrow-left-circle:before {
content: "\e910";
}
.ok-iconarrow-left:before {
content: "\e911";
}
.ok-iconarrow-right-circle:before {
content: "\e912";
}
.ok-iconarrow-right:before {
content: "\e913";
}
.ok-iconarrow-up-circle:before {
content: "\e914";
}
.ok-iconarrow-up-left:before {
content: "\e915";
}
.ok-iconarrow-up-right:before {
content: "\e916";
}
.ok-iconarrow-up:before {
content: "\e917";
}
.ok-iconbar-chart-2:before {
content: "\e91a";
}
.ok-iconbar-chart:before {
content: "\e91b";
}
.ok-iconbattery-charging:before {
content: "\e91c";
}
.ok-iconbattery:before {
content: "\e91d";
}
.ok-iconbell:before {
content: "\e91f";
}
.ok-iconbluetooth:before {
content: "\e920";
}
.ok-iconcamera-off:before {
content: "\e928";
}
.ok-iconcamera:before {
content: "\e929";
}
.ok-iconcheck-circle:before {
content: "\e92b";
}
.ok-iconcheck-square:before {
content: "\e92c";
}
.ok-iconcheck:before {
content: "\e92d";
}
.ok-iconchevron-down:before {
content: "\e92e";
}
.ok-iconchevron-left:before {
content: "\e92f";
}
.ok-iconchevron-right:before {
content: "\e930";
}
.ok-iconchevron-up:before {
content: "\e931";
}
.ok-iconchevrons-down:before {
content: "\e932";
}
.ok-iconchevrons-left:before {
content: "\e933";
}
.ok-iconchevrons-right:before {
content: "\e934";
}
.ok-iconchevrons-up:before {
content: "\e935";
}
.ok-iconcircle:before {
content: "\e937";
}
.ok-iconclipboard:before {
content: "\e938";
}
.ok-iconclock:before {
content: "\e939";
}
.ok-iconcode:before {
content: "\e940";
}
.ok-iconcopy:before {
content: "\e945";
}
.ok-iconcorner-down-left:before {
content: "\e946";
}
.ok-iconcorner-down-right:before {
content: "\e947";
}
.ok-iconcorner-left-down:before {
content: "\e948";
}
.ok-iconcorner-left-up:before {
content: "\e949";
}
.ok-iconcorner-right-down:before {
content: "\e94a";
}
.ok-iconcorner-right-up:before {
content: "\e94b";
}
.ok-iconcorner-up-left:before {
content: "\e94c";
}
.ok-iconcorner-up-right:before {
content: "\e94d";
}
.ok-iconcrop:before {
content: "\e950";
}
.ok-icondelete:before {
content: "\e953";
}
.ok-icondisc:before {
content: "\e954";
}
.ok-icondownload-cloud:before {
content: "\e956";
}
.ok-icondownload:before {
content: "\e957";
}
.ok-iconedit-3:before {
content: "\e95a";
}
.ok-iconedit:before {
content: "\e95b";
}
.ok-iconexternal-link:before {
content: "\e95c";
}
.ok-iconeye-off:before {
content: "\e95d";
}
.ok-iconeye:before {
content: "\e95e";
}
.ok-iconfacebook:before {
content: "\e95f";
}
.ok-iconfast-forward:before {
content: "\e960";
}
.ok-iconfile-minus:before {
content: "\e963";
}
.ok-iconfile-plus:before {
content: "\e964";
}
.ok-iconfile-text:before {
content: "\e965";
}
.ok-iconfile:before {
content: "\e966";
}
.ok-iconflag:before {
content: "\e969";
}
.ok-iconfolder-minus:before {
content: "\e96a";
}
.ok-iconfolder-plus:before {
content: "\e96b";
}
.ok-iconfolder:before {
content: "\e96c";
}
.ok-icongit-branch:before {
content: "\e96f";
}
.ok-icongit-commit:before {
content: "\e970";
}
.ok-icongit-merge:before {
content: "\e971";
}
.ok-icongit-pull-request:before {
content: "\e972";
}
.ok-icongithub:before {
content: "\e973";
}
.ok-iconglobe:before {
content: "\e975";
}
.ok-icongrid:before {
content: "\e976";
}
.ok-iconheadphones:before {
content: "\e979";
}
.ok-iconheart:before {
content: "\e97a";
}
.ok-iconhelp-circle:before {
content: "\e97b";
}
.ok-iconhome:before {
content: "\e97c";
}
.ok-iconimage:before {
content: "\e97d";
}
.ok-iconinbox:before {
content: "\e97e";
}
.ok-iconinfo:before {
content: "\e97f";
}
.ok-iconinstagram:before {
content: "\e980";
}
.ok-iconitalic:before {
content: "\e981";
}
.ok-iconkey:before {
content: "\e982";
}
.ok-iconlayers:before {
content: "\e983";
}
.ok-iconlink-2:before {
content: "\e986";
}
.ok-iconlink:before {
content: "\e987";
}
.ok-iconlinkedin:before {
content: "\e988";
}
.ok-iconlist:before {
content: "\e989";
}
.ok-iconloader:before {
content: "\e98a";
}
.ok-iconlock:before {
content: "\e98b";
}
.ok-iconmail:before {
content: "\e98e";
}
.ok-iconmap-pin:before {
content: "\e98f";
}
.ok-iconmaximize-2:before {
content: "\e991";
}
.ok-iconmaximize:before {
content: "\e992";
}
.ok-iconmenu:before {
content: "\e994";
}
.ok-iconmic-off:before {
content: "\e997";
}
.ok-iconmic:before {
content: "\e998";
}
.ok-iconminimize-2:before {
content: "\e999";
}
.ok-iconminimize:before {
content: "\e99a";
}
.ok-iconminus-circle:before {
content: "\e99b";
}
.ok-iconminus-square:before {
content: "\e99c";
}
.ok-iconminus:before {
content: "\e99d";
}
.ok-iconmonitor:before {
content: "\e99e";
}
.ok-iconmoon:before {
content: "\e99f";
}
.ok-iconmore-horizontal:before {
content: "\e9a0";
}
.ok-iconmore-vertical:before {
content: "\e9a1";
}
.ok-iconmouse-pointer:before {
content: "\e9a2";
}
.ok-iconmove:before {
content: "\e9a3";
}
.ok-iconnavigation-2:before {
content: "\e9a5";
}
.ok-iconnavigation:before {
content: "\e9a6";
}
.ok-iconpaperclip:before {
content: "\e9a9";
}
.ok-iconpie-chart:before {
content: "\e9b5";
}
.ok-iconplay-circle:before {
content: "\e9b6";
}
.ok-iconplay:before {
content: "\e9b7";
}
.ok-iconpower:before {
content: "\e9bc";
}
.ok-iconprinter:before {
content: "\e9bd";
}
.ok-iconradio:before {
content: "\e9be";
}
.ok-iconrefresh-ccw:before {
content: "\e9bf";
}
.ok-iconrefresh-cw:before {
content: "\e9c0";
}
.ok-iconrepeat:before {
content: "\e9c1";
}
.ok-iconrewind:before {
content: "\e9c2";
}
.ok-iconrotate-ccw:before {
content: "\e9c3";
}
.ok-iconrotate-cw:before {
content: "\e9c4";
}
.ok-iconrss:before {
content: "\e9c5";
}
.ok-iconsave:before {
content: "\e9c6";
}
.ok-iconsend:before {
content: "\e9c9";
}
.ok-iconsettings:before {
content: "\e9cb";
}
.ok-iconshare-2:before {
content: "\e9cc";
}
.ok-iconshare:before {
content: "\e9cd";
}
.ok-iconshopping-cart:before {
content: "\e9d1";
}
.ok-iconshuffle:before {
content: "\e9d2";
}
.ok-iconskip-back:before {
content: "\e9d4";
}
.ok-iconskip-forward:before {
content: "\e9d5";
}
.ok-iconslash:before {
content: "\e9d7";
}
.ok-iconsliders:before {
content: "\e9d8";
}
.ok-iconstar:before {
content: "\e9dd";
}
.ok-iconstop-circle:before {
content: "\e9de";
}
.ok-iconsun:before {
content: "\e9df";
}
.ok-icontag:before {
content: "\e9e3";
}
.ok-iconterminal:before {
content: "\e9e5";
}
.ok-iconthermometer:before {
content: "\e9e6";
}
.ok-iconthumbs-down:before {
content: "\e9e7";
}
.ok-iconthumbs-up:before {
content: "\e9e8";
}
.ok-icontrash-2:before {
content: "\e9eb";
}
.ok-icontrash:before {
content: "\e9ec";
}
.ok-icontrello:before {
content: "\e9ed";
}
.ok-icontrending-down:before {
content: "\e9ee";
}
.ok-icontrending-up:before {
content: "\e9ef";
}
.ok-iconwifi:before {
content: "\ea09";
}
.ok-iconwind:before {
content: "\ea0a";
}
.ok-iconx-circle:before {
content: "\ea0b";
}
.ok-iconx-octagon:before {
content: "\ea0c";
}
.ok-iconx-square:before {
content: "\ea0d";
}
.ok-iconx:before {
content: "\ea0e";
}
.ok-iconyoutube:before {
content: "\ea0f";
}
.ok-iconzap-off:before {
content: "\ea10";
}
.ok-iconzap:before {
content: "\ea11";
}
.ok-iconzoom-in:before {
content: "\ea12";
}
.ok-iconzoom-out:before {
content: "\ea13";
}

Binary file not shown.

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 238 KiB

Binary file not shown.

Binary file not shown.

View File

@ -1,49 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>导航的图标</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../lib/layui/css/layui.css">
<style>
.ok-body {
padding: 20px;
}
</style>
</head>
<body>
<div class="ok-body">
<blockquote class="layui-elem-quote">
<p>主要讲述如何设置导航的图标。</p>
</blockquote>
<blockquote class="layui-elem-quote layui-quote-nm">
<p>特别注意:必须要遵守指定的写法</p>
<p>1.默认的图标指向的值layui内置图标</p>
<p>2.要想使用ok-icon图标必须设置navs.json中的fontFamily属性和icon属性</p>
</blockquote>
<pre lay-title="JavaScript">
{
"title": "后台首页",
"fontFamily":"ok-icon",
"icon":"ok-iconairplay",
"href": "pages/home.html",
},
{
"title": "后台首页",
"fontFamily":"ok-icon",
"icon":"&#x26;#xe9a6;",
"href": "pages/home.html",
}
</pre>
</div>
</body>
</html>
<script src="../../lib/layui/layui.js"></script>
<script type="text/javascript">
layui.use(['code'], function () {
var code = layui.code;
code({
elem: 'pre'
});
});
</script>

View File

@ -1,122 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户列表</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../lib/layui/css/layui.css">
<style>
.ok-body {
padding: 20px;
}
</style>
</head>
<body>
<div class="ok-body">
<blockquote class="layui-elem-quote">
<p>主要讲述如何在内部页面添加导航。</p>
</blockquote>
<blockquote class="layui-elem-quote layui-quote-nm">
<p>特别注意:添加导航的同时必须要遵守指定的写法</p>
<p>1.必须指定一个html元素</p>
<p>2.此元素的属性必须有data-url和lay-id</p>
<p>3.data-url属性表示指定的页面且必须是网站的绝对路径</p>
<p>4.lay-id属性请不要以数字开头推荐以字母开头长度不限</p>
<p>5.当lay-id重复时那么则只会打开一个后者只会定位到当前选项卡</p>
</blockquote>
<pre lay-title="JavaScript">
layui.use(function(){
var okTab = parent.objOkTab;//获取父级的okTab;layui.okTab()不推荐这样获取
var page = '&lt;div lay-id="add-1" data-url="/pages/user/user.html"&gt;个人中心&lt;/div&gt;';
okTab.tabAdd(page);
})
</pre>
<div class="layui-card">
<button class="layui-btn" id="addNav1">
<i class="layui-icon">&#xe61f;</i>新的选项卡1
</button>
<button class="layui-btn" id="addNav2">
<i class="layui-icon">&#xe61f;</i>新的选项卡2
</button>
<button class="layui-btn" id="addNav3" lay-id="add-3" data-url="https://cn.vuejs.org/v2/api/">
<i class="layui-icon">&#xe61f;</i>新的选项卡3
</button>
<button class="layui-btn" id="addNav4" data-url="/pages/user/user.html">
<i class="layui-icon">&#xe61f;</i>没有加lay-id
</button>
<a class="layui-btn" href="../../pages/user/user.html">普通跳转页</a>
</div>
<div class="layui-card">
<button class="param layui-btn" data-url="/pages/help/navOperate.html?param=a">
跳转传参a
</button>
<button class="param layui-btn" data-url="/pages/help/navOperate.html?param=b">
跳转传参b
</button>
<button class="param2 layui-btn">
不会被关闭的导航c
</button>
</div>
</div>
</body>
</html>
<script src="../../lib/layui/layui.js"></script>
<script type="text/javascript">
function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
var r = window.location.search.substr(1).match(reg); //匹配目标参数
if (r != null) return unescape(r[2]);
return null; //返回参数值
}
</script>
<script type="text/javascript">
layui.use(['element', 'table', 'form', 'jquery', 'okTab', 'laydate', 'code'], function () {
var $ = layui.jquery,
p_layer = parent.layer || layer;
var okTab = layui.okTab();//获取父级的oktab
var code = layui.code;
code({
elem: 'pre'
});
$("#addNav1").click(function () {
//方式一(推荐)
var url = "pages/user/user.html";
var page = '<div lay-id="add-1" data-url="' + url + '"><cite>个人中心</cite></div>';
okTab.tabAdd(page);
});
$("#addNav2").click(function () {
//方式二(获取父级对象进行添加)
var p_layui = parent.layui;//获取父级的layui
var p_okTab = p_layui.okTab();//拿到导航操作对象
var url = "pages/user/user.html";
var page = '<a lay-id="u-1" href="javascript:;" data-url="' + url + '"><cite>个人中心</cite><span class="layui-badge-dot"></span></a>';
p_okTab.tabAdd(page);
});
$("#addNav3,#addNav4").click(function () {
okTab.tabAdd(this);
});
$("button.param").click(function () {
var url = $(this).attr("data-url");
var page = '<div lay-id="param" data-url="' + url + '"><cite>选项卡传参</cite></div>';
okTab.tabAdd(page);
});
$("button.param2").click(function () {
var url = '/pages/help/navOperate.html?param=c';
var page = '<div lay-id="param2" is-close="false" data-url="' + url + '">不会被关闭</div>';
okTab.tabAdd(page);
});
var getParam = getUrlParam("param");
if (getParam) {
layer.msg("参数为" + getParam);
}
});
</script>

View File

@ -1,43 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户列表</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../lib/layui/css/layui.css">
<style>
.ok-body {
padding: 20px;
}
</style>
</head>
<body>
<div class="ok-body">
<blockquote class="layui-elem-quote">
<p>主要讲述导航参数的说明。</p>
</blockquote>
<pre lay-title="导航参数">
{
"title": "后台首页", //导航标题
"fontFamily": "ok-icon", //标题的字体图标来源
"icon": "ok-iconairplay", //制定字体图标
"href": "pages/home.html", //指向的页面路径
"isClose": true, //设置导航页是否关闭(默认true)
"spread": false, //设置是否打开
"isCheck": false //是否选中
"target":"_blank" //打开方式 _blank覆盖当前窗口
"children": [{}] //子导航 参数同上(可嵌套无限个)
}
</pre>
</div>
</body>
</html>
<script src="../../lib/layui/layui.js"></script>
<script type="text/javascript">
layui.use(['code'], function () {
var code = layui.code;
code({
elem: 'pre'
});
});
</script>

View File

@ -1,41 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>插件目录</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../lib/layui/css/layui.css">
<style>
.ok-body {
padding: 20px;
}
</style>
</head>
<body>
<div class="ok-body">
<blockquote class="layui-elem-quote">
<p>主要描述插件的目录和插件的引入。</p>
</blockquote>
<blockquote class="layui-elem-quote layui-quote-nm">
<p>1.如果你想使用countUp数字步进器那么你需要引入一个countUp插件</p>
</blockquote>
<pre lay-title="导航参数">
引入插件并加载一个插件
layui.use(['countUp'], function () {
var countUp = layui.countUp;
var page = '&lt;div lay-id="add-1" data-url="/pages/user/user.html"&gt;个人中心&lt;/div&gt;';
okTab.tabAdd(page);
});
</pre>
</div>
</body>
</html>
<script src="../../lib/layui/layui.js"></script>
<script type="text/javascript">
layui.use(['code'], function () {
var code = layui.code;
code({
elem: 'pre'
});
});
</script>

File diff suppressed because it is too large Load Diff