82 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
			
		
		
	
	
			82 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
{include file="public/header" /}
 | 
						||
<style type="text/css">
 | 
						||
	ul {
 | 
						||
		display: block;
 | 
						||
		list-style-type: disc;
 | 
						||
		margin-block-start: 1em;
 | 
						||
		margin-block-end: 1em;
 | 
						||
		margin-inline-start: 0px;
 | 
						||
		margin-inline-end: 0px;
 | 
						||
		/* padding-inline-start: 40px; */
 | 
						||
	}
 | 
						||
	.site-doc-icon {
 | 
						||
		margin-bottom: 50px;
 | 
						||
		font-size: 0;
 | 
						||
	}
 | 
						||
	li {
 | 
						||
		list-style: none;
 | 
						||
	}
 | 
						||
	.site-doc-icon li {
 | 
						||
		display: inline-block;
 | 
						||
		vertical-align: middle;
 | 
						||
		width: 132px;
 | 
						||
		height: 105px;
 | 
						||
		line-height: 25px;
 | 
						||
		padding: 20px 0;
 | 
						||
		margin-right: -1px;
 | 
						||
		margin-bottom: -1px;
 | 
						||
		border: 1px solid #e2e2e2;
 | 
						||
		font-size: 14px;
 | 
						||
		text-align: center;
 | 
						||
		color: #666;
 | 
						||
		transition: all .3s;
 | 
						||
		-webkit-transition: all .3s;
 | 
						||
	}
 | 
						||
	.site-doc-icon li .layui-icon {
 | 
						||
		display: inline-block;
 | 
						||
		font-size: 36px;
 | 
						||
	}
 | 
						||
	.site-doc-icon li .doc-icon-name, .site-doc-icon li .doc-icon-code {
 | 
						||
		color: #c2c2c2;
 | 
						||
	}
 | 
						||
	.site-doc-icon li .doc-icon-fontclass {
 | 
						||
		height: 40px;
 | 
						||
		line-height: 20px;
 | 
						||
		padding: 0 5px;
 | 
						||
		font-size: 13px;
 | 
						||
		color: #333;
 | 
						||
	}
 | 
						||
</style>
 | 
						||
<div class="header" style="margin-bottom:20px;">
 | 
						||
	<span>图标</span>
 | 
						||
	<div></div>
 | 
						||
</div>
 | 
						||
<pre id="pre" class="layui-code">
 | 
						||
	<!-- 图标 -->
 | 
						||
	<i class="layui-icon layui-icon-face-smile"></i>
 | 
						||
	<!-- 图标,设置颜色、大小 -->
 | 
						||
	<i class="layui-icon layui-icon-face-smile" style="font-size:30px;color:#1E9FFF;"></i>
 | 
						||
	<!-- 图标,设置旋转 -->
 | 
						||
	<i class="layui-icon layui-icon-face-smile layui-anim layui-anim-rotate layui-anim-loop"></i>
 | 
						||
</pre>
 | 
						||
<ul class="site-doc-icon" style="text-align: center;">
 | 
						||
	{foreach($lists as $lists_v)}
 | 
						||
		<li>
 | 
						||
			<i class="layui-icon {$lists_v['icon_css']} {if($lists_v['icon_name']=='loading')} layui-anim layui-anim-rotate layui-anim-loop{/if}"></i>
 | 
						||
			<div class="doc-icon-name">{$lists_v['icon_name']}</div>
 | 
						||
			<div class="doc-icon-code">{$lists_v['icon_html']}</div>
 | 
						||
			<div class="doc-icon-fontclass">{$lists_v['icon_css']}</div>
 | 
						||
		</li>
 | 
						||
	{/foreach}
 | 
						||
</ul>
 | 
						||
<script type="text/javascript">
 | 
						||
	layui.use('code', function(){
 | 
						||
		layui.code({
 | 
						||
			elem:'#pre'
 | 
						||
			,title: '使用方法'
 | 
						||
			,encode: true
 | 
						||
			,skin: 'notepad' //如果要默认风格,不用设定该key。
 | 
						||
		});
 | 
						||
	});
 | 
						||
</script>
 | 
						||
{include file="public/tail" /} |