205 lines
		
	
	
		
			6.6 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
			
		
		
	
	
			205 lines
		
	
	
		
			6.6 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
| <?php /*a:3:{s:68:"E:\Demos\DemoOwns\PHP\yunzer\app\admin\view\yunzertest\icon_list.php";i:1746709977;s:61:"E:\Demos\DemoOwns\PHP\yunzer\app\admin\view\public\header.php";i:1746849526;s:59:"E:\Demos\DemoOwns\PHP\yunzer\app\admin\view\public\tail.php";i:1746709977;}*/ ?>
 | ||
| <!DOCTYPE html>
 | ||
| <html>
 | ||
| 	<head>
 | ||
| 		<title><?php echo htmlentities((string) $config['admin_name']); ?></title>
 | ||
| 		<meta name="renderer" content="webkit">
 | ||
| 		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
 | ||
| 		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
 | ||
| 		<link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css" media="all"/>
 | ||
| 		<link rel="stylesheet" type="text/css" href="/static/css/moban.css" media="all"/>
 | ||
| 		<link rel="stylesheet" type="text/css" href="/static/css/wangeditor.css" media="all"/>
 | ||
| 		<style type="text/css">
 | ||
| 			.header span{background:#009688;margin-left:30px;padding:10px;color:#ffffff;}
 | ||
| 			.header div{border-bottom:solid 2px #009688;margin-top: 8px;}
 | ||
| 			.header button{float:right;margin-top:-5px;}
 | ||
| 			.pagination {
 | ||
| 				display: inline-block;
 | ||
| 				padding-left: 0;
 | ||
| 				margin: 20px 0;
 | ||
| 				border-radius: 4px;
 | ||
| 			}
 | ||
| 			.pagination > li {
 | ||
| 				display: inline;
 | ||
| 			}
 | ||
| 			.pagination > li > a,
 | ||
| 			.pagination > li > span {
 | ||
| 				position: relative;
 | ||
| 				float: left;
 | ||
| 				padding: 6px 12px;
 | ||
| 				margin-left: -1px;
 | ||
| 				line-height: 1.42857143;
 | ||
| 				color: #337ab7;
 | ||
| 				text-decoration: none;
 | ||
| 				background-color: #fff;
 | ||
| 				border: 1px solid #ddd;
 | ||
| 			}
 | ||
| 			.pagination > li:first-child > a,
 | ||
| 			.pagination > li:first-child > span {
 | ||
| 				margin-left: 0;
 | ||
| 				border-top-left-radius: 4px;
 | ||
| 				border-bottom-left-radius: 4px;
 | ||
| 			}
 | ||
| 			.pagination > li:last-child > a,
 | ||
| 			.pagination > li:last-child > span {
 | ||
| 				border-top-right-radius: 4px;
 | ||
| 				border-bottom-right-radius: 4px;
 | ||
| 			}
 | ||
| 			.pagination > li > a:hover,
 | ||
| 			.pagination > li > span:hover,
 | ||
| 			.pagination > li > a:focus,
 | ||
| 			.pagination > li > span:focus {
 | ||
| 				z-index: 2;
 | ||
| 				color: #23527c;
 | ||
| 				background-color: #eee;
 | ||
| 				border-color: #ddd;
 | ||
| 			}
 | ||
| 			.pagination > .active > a,
 | ||
| 			.pagination > .active > span,
 | ||
| 			.pagination > .active > a:hover,
 | ||
| 			.pagination > .active > span:hover,
 | ||
| 			.pagination > .active > a:focus,
 | ||
| 			.pagination > .active > span:focus {
 | ||
| 				z-index: 3;
 | ||
| 				color: #fff;
 | ||
| 				cursor: default;
 | ||
| 				background-color: #337ab7;
 | ||
| 				border-color: #337ab7;
 | ||
| 			}
 | ||
| 			.pagination > .disabled > span,
 | ||
| 			.pagination > .disabled > span:hover,
 | ||
| 			.pagination > .disabled > span:focus,
 | ||
| 			.pagination > .disabled > a,
 | ||
| 			.pagination > .disabled > a:hover,
 | ||
| 			.pagination > .disabled > a:focus {
 | ||
| 				color: #777;
 | ||
| 				cursor: not-allowed;
 | ||
| 				background-color: #fff;
 | ||
| 				border-color: #ddd;
 | ||
| 			}
 | ||
| 			.close-img { background: url(/static/images/close_img.png); background-size: 20px 20px; width:20px; height: 20px; position: absolute; right: 5px; top: 5px; z-index: 2;}
 | ||
| 		</style>
 | ||
| 		<script type="text/javascript" src="/static/layui/layui.js"></script>
 | ||
| 		<script type="text/javascript">
 | ||
| 			layui.use(['layer','form','table','laydate','element','upload'],function(){
 | ||
| 				layer = layui.layer;		// layui 弹框
 | ||
| 				form = layui.form;			// layui form表单
 | ||
| 				table = layui.table;		// layui 表格
 | ||
| 				laydate = layui.laydate;	// layui 时间框
 | ||
| 				element = layui.element;	// layui element
 | ||
| 				upload = layui.upload;		// layui 上传
 | ||
| 				$ = layui.jquery;			// layui jquery
 | ||
| 			})
 | ||
| 		</script>
 | ||
| 	</head>
 | ||
| 	<body style="padding:10px; box-sizing: border-box;">
 | ||
| <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;">
 | ||
| 	<?php foreach($lists as $lists_v): ?>
 | ||
| 		<li>
 | ||
| 			<i class="layui-icon <?php echo htmlentities((string) $lists_v['icon_css']); if(($lists_v['icon_name']=='loading')): ?> layui-anim layui-anim-rotate layui-anim-loop<?php endif; ?>"></i>
 | ||
| 			<div class="doc-icon-name"><?php echo htmlentities((string) $lists_v['icon_name']); ?></div>
 | ||
| 			<div class="doc-icon-code"><?php echo htmlentities((string) $lists_v['icon_html']); ?></div>
 | ||
| 			<div class="doc-icon-fontclass"><?php echo htmlentities((string) $lists_v['icon_css']); ?></div>
 | ||
| 		</li>
 | ||
| 	<?php endforeach; ?>
 | ||
| </ul>
 | ||
| <script type="text/javascript">
 | ||
| 	layui.use('code', function(){
 | ||
| 		layui.code({
 | ||
| 			elem:'#pre'
 | ||
| 			,title: '使用方法'
 | ||
| 			,encode: true
 | ||
| 			,skin: 'notepad' //如果要默认风格,不用设定该key。
 | ||
| 		});
 | ||
| 	});
 | ||
| </script>
 | ||
| 	</body>
 | ||
| </html>
 | ||
| <script type="text/javascript">
 | ||
| 	// 显示图片
 | ||
| 	function show_img(obj){
 | ||
| 		var imgurl = $(obj).attr('src');
 | ||
| 		var res = getMousePos();
 | ||
| 		var html = '<div style="background:#fff;position:absolute;width:200px;border:solid 1px #cdcdcd;border-radius:6px;padding:2px;left:'+res.x+'px;top:'+res.y+'px;z-index:1000" id="preview">\
 | ||
| 				<img style="width:100%;border-radius:6px;" src="'+imgurl+'">\
 | ||
| 			</div>';
 | ||
| 		$('body').append(html);
 | ||
| 	}
 | ||
| 	// 隐藏图片
 | ||
| 	function hide_img(){
 | ||
| 		$('#preview').remove();
 | ||
| 	}
 | ||
| 	// 图片位置计算
 | ||
| 	function getMousePos(event) {
 | ||
| 		var e = event || window.event;
 | ||
| 		var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft;
 | ||
| 		var scrollY = document.documentElement.scrollTop || document.body.scrollTop;
 | ||
| 		var x = e.pageX || e.clientX + scrollX;
 | ||
| 		var y = e.pageY || e.clientY + scrollY;
 | ||
| 		return { 'x': x, 'y': y };
 | ||
| 	}
 | ||
| 	// 删除图片
 | ||
| 	function deleteImage(path,obj){
 | ||
| 		$(obj).closest('.upload_pic_li').remove();
 | ||
| 	}
 | ||
| </script>
 |