diff --git a/assets/css/base.css b/assets/css/base.css new file mode 100644 index 0000000..a923d82 --- /dev/null +++ b/assets/css/base.css @@ -0,0 +1,98 @@ +/* 默认字体大小（桌面端） */ +body { + font-size: 16px; +} + +h1 { + font-size: 24px; +} + +h2 { + font-size: 20px; +} + +h3 { + font-size: 18px; +} + +h4 { + font-size: 16px; +} + +/* * 手机端-手机端-手机端-手机端-手机端-手机端-手机端-手机端-手机端 * */ + +/* 手机端 */ +@media (max-width: 767px) { + body { + font-size: 12px; + } + + h1 { + font-size: 18px; + } + + h2 { + font-size: 16px; + } + + h3 { + font-size: 14px; + } + + h4 { + font-size: 12px; + } +} + +/* 手机端（竖屏） */ +@media (max-width: 767px) and (orientation: portrait) { + .container { + background-color: lightblue; + } +} + +/* 手机端（横屏） */ +@media (max-width: 767px) and (orientation: landscape) { + .container { + background-color: lightcyan; + } +} + +/* 平板端 */ +@media (min-width: 768px) and (max-width: 1024px) { + body { + font-size: 14px; + } + + h1 { + font-size: 20px; + } + + h2 { + font-size: 18px; + } + + h3 { + font-size: 16px; + } + + h4 { + font-size: 14px; + } +} + +/* * 平板端-平板端-平板端-平板端-平板端-平板端-平板端-平板端-平板端 * */ + +/* 平板端（竖屏） */ +@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) { + .container { + background-color: lightgreen; + } +} + +/* 平板端（横屏） */ +@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) { + .container { + background-color: lightgoldenrodyellow; + } +} diff --git a/assets/css/font.css b/assets/css/font.css new file mode 100644 index 0000000..4d37b99 --- /dev/null +++ b/assets/css/font.css @@ -0,0 +1,40 @@ +/*@font-face {*/ +/* font-family: 'HYY';*/ +/* src: url('/assets/fonts/HYYiSongW.otf') format('woff2');*/ +/* unicode-range: U+4E00-9FFF; !* 中文字符范围 *!*/ +/* font-weight: normal;*/ +/* font-style: normal;*/ +/*}*/ +@font-face { + font-family: "KingHwa_OldSong"; + src: url("/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.eot"); /* IE9 */ + src: url("/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */ + + url("/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.woff") format("woff"), /* chrome、firefox */ + url("/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+ */ + + url("/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.svg#KingHwa_OldSong") format("svg"); /* iOS 4.1- */ + font-style: normal; + font-weight: normal; +} +/* nice*/ +@font-face { + font-family: 'nice'; + src: url('/assets/fonts/nice.ttf') format('woff2'); + unicode-range: U+0000-007F; /* 基本拉丁字母 */ + font-weight: normal; + font-style: normal; +} +/*TechnicLite*/ +@font-face { + font-family: 'TechnicLite'; + src: url('/assets/fonts/TechnicLite.ttf') format('woff2'); + unicode-range: U+0000-007F; /* 基本拉丁字母 */ + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: 'MyFont'; + src: url('/assets/fonts/nice.ttf') format('woff2'); + unicode-range: U+4E00-9FFF, U+3400-4DBF; /* 基本汉字及扩展A区 */ +} diff --git a/assets/css/iconfont.css b/assets/css/iconfont.css new file mode 100644 index 0000000..4acba42 --- /dev/null +++ b/assets/css/iconfont.css @@ -0,0 +1,2 @@ +@import "../icon/cocoIconFont/iconfont.css"; +@import "../icon/sxIconFont/iconfont.css"; diff --git a/assets/css/style.css b/assets/css/style.css new file mode 100644 index 0000000..e6a7e1b --- /dev/null +++ b/assets/css/style.css @@ -0,0 +1,12 @@ +html, body { + position: relative; + width: 100%; + height: 100%; + margin: 0; + padding: 0; + overflow: hidden; +} + +:root { + font-family: 'LXGW WenKai', 'Huiwen-mincho', 'nice', 'TechnicLite', sans-serif; +} diff --git a/assets/css/transitions.css b/assets/css/transitions.css new file mode 100644 index 0000000..2a46885 --- /dev/null +++ b/assets/css/transitions.css @@ -0,0 +1,10 @@ +/* 淡入淡出动画 */ +.fade-enter-active, +.fade-leave-active { + transition: opacity 0.3s ease; +} + +.fade-enter-from, +.fade-leave-to { + opacity: 0; +} diff --git a/assets/css/value.css b/assets/css/value.css new file mode 100644 index 0000000..a34a715 --- /dev/null +++ b/assets/css/value.css @@ -0,0 +1,27 @@ +:root { + /*主体内容最大宽度*/ + --main-max-width: 1200px; + /*主体内容自适应宽度*/ + --main-width-auto: min(1200px, 70%); + + /*背景颜色*/ + --bg-color-b1: #000; + --bg-color-b2: #111; + --bg-color-b3: #222; + --bg-color-b4: #333; + --bg-color-b5: #444; + --bg-color-b6: #666; + --bg-color-b7: #777; + --bg-color-b8: #888; + --bg-color-b9: #999; + --bg-color-ba: #aaa; + --bg-color-bb: #bbb; + --bg-color-bc: #ccc; + --bg-color-bd: #ddd; + --bg-color-be: #eee; + --bg-color-bf: #fff; + + /*字体颜色*/ + --color-text: #fefefe; + --bg-opacity: 0.5; +} diff --git a/assets/fonts/KingHwa_OldSong/KingHwa_OldSong-embed.css b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong-embed.css new file mode 100644 index 0000000..db5c4bc --- /dev/null +++ b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong-embed.css @@ -0,0 +1,13 @@ +@font-face { + font-family: "KingHwa_OldSong"; + src: url("KingHwa_OldSong.eot"); /* IE9 */ + src: url("KingHwa_OldSong.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */ + + url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAAKAIAAAwAgT1MvMtIIgX0AAACsAAAAYGNtYXBnoWT5AAABDAAAAUpnbHlmnNFerQAAAlgAABa8aGVhZCRJ9wgAABkUAAAANmhoZWEIKQMbAAAZTAAAACRobXR4BAoAMwAAGXAAAAAIbG9jYQj6EqYAABl4AAAACG1heHAAZwaAAAAZgAAAACBuYW1lnSG5kgAAGaAAAATucG9zdH4ubigAAB6QAAAANAAEA+gBkAAFAAACAAIAAAAAAAKZAmYAAAIAADMBXgAAAgAFAAAAAAAAAKAAAv8QAAAABAAAEgAAAABUUlcAAUBksGYfAz//IwDdAz8A3QAEAAkAAQAAAaYCywAAACAABgAAAAMAAAADAAAAHAABAAAAAABEAAMAAQAAABwABAAoAAAABgAEAAEAAmSwZh///wAAZLBmH///m1GZ4wABAAAAAAAAAAABBgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGMAAP9/A+gDKgAdAGEAdQB5AJEAmQC1AL8A3wDjAPcA+wETARsBNwFBAWEBZQFpAX0BgQGZAaEBvQHHAecB6wH/AgMCGwIjAj8CSQJpAm0CgQKFAp0CpQLBAssC6wLvAwMDBwMfAycDQwNNA20DcQOFA4kDoQOpA8UDzwPvA/MEBwQLBCMEKwRHBFEEcQR1BIkEjQSlBK0EyQTTBPME9wULBQ8FJwUvBUsFVQV1BXkFjQWRBakFsQXNBdcF9wX7Bg8GEwYrBjMGTwZZBnkGfQAAARYXFhcWBwYnJgcGJyY3NicmJyYnJjc2NzYXFhUUBzYXFgcGFxY3Njc2NzYXFgcGBwYHBgcGFxYHBhUWFxYXFgcGJyYnJjc2NzYnJjc2NzY3Njc2JyYHBgcGBwYjJicmNzYnMxUjNTM1IzUzNSM1MxUjFTMVIyczFSMXNTMVIxUzFSMVMxUjNTM1IzUzNSM1MxU3MxUjNTMVIycjNTMVIxUzFSMVIxUzNTMVIxUzFSM1MzUjNTsBNTMVIzUjNTMVBzMVIzUzNSM1MxUzNSM1MxUzNTMVMzUzFSMVMzUzFSMHMzUjNyM1MxUjFTMVIxUzFSM1MzUjNTMXIzUzJxUjNTM1IzUzNSM1MxUjFTMVIxUzFSM1ByM1MxUjNTMXMxUjNTM1IzUzNTM1IxUjNTM1IzUzFSMVMxUrARUjNTMVMxUjNTcjNTMVIxUzFSM1IxUzFSM1IxUjNSMVIzUzNSMVIzUzNyMVMzcRIREBMxUjNTM1IzUzNSM1MxUjFTMVIyczFSMXNTMVIxUzFSMVMxUjNTM1IzUzNSM1MxU3MxUjNTMVIycjNTMVIxUzFSMVIxUzNTMVIxUzFSM1MzUjNTsBNTMVIzUjNTMVBzMVIzUzNSM1MxUzNSM1MxUzNTMVMzUzFSMVMzUzFSMHMzUjNyM1MxUjFTMVIxUzFSM1MzUjNTMXIzUzJxUjNTM1IzUzNSM1MxUjFTMVIxUzFSM1ByM1MxUjNTMXMxUjNTM1IzUzNTM1IxUjNTM1IzUzFSMVMxUrARUjNTMVMxUjNTcjNTMVIxUzFSM1IxUzFSM1IxUjNSMVIzUzNSMVIzUzNyMVMwMzFSM1MzUjNTM1IzUzFSMVMxUjJzMVIxc1MxUjFTMVIxUzFSM1MzUjNTM1IzUzFTczFSM1MxUjJyM1MxUjFTMVIxUjFTM1MxUjFTMVIzUzNSM1OwE1MxUjNSM1MxUHMxUjNTM1IzUzFTM1IzUzFTM1MxUzNTMVIxUzNTMVIwczNSM3IzUzFSMVMxUjFTMVIzUzNSM1MxcjNTMnFSM1MzUjNTM1IzUzFSMVMxUjFTMVIzUHIzUzFSM1MxczFSM1MzUjNTM1MzUjFSM1MzUjNTMVIxUzFSsBFSM1MxUzFSM1NyM1MxUjFTMVIzUjFTMVIzUjFSM1IxUjNTM1IxUjNTM3IxUzATMVIzUzNSM1MzUjNTMVIxUzFSMnMxUjFzUzFSMVMxUjFTMVIzUzNSM1MzUjNTMVNzMVIzUzFSMnIzUzFSMVMxUjFSMVMzUzFSMVMxUjNTM1IzU7ATUzFSM1IzUzFQczFSM1MzUjNTMVMzUjNTMVMzUzFTM1MxUjFTM1MxUjBzM1IzcjNTMVIxUzFSMVMxUjNTM1IzUzFyM1MycVIzUzNSM1MzUjNTMVIxUzFSMVMxUjNQcjNTMVIzUzFzMVIzUzNSM1MzUzNSMVIzUzNSM1MxUjFTMVKwEVIzUzFTMVIzU3IzUzFSMVMxUjNSMVMxUjNSMVIzUjFSM1MzUjFSM1MzcjFTMDMxUjNTM1IzUzNSM1MxUjFTMVIyczFSMXNTMVIxUzFSMVMxUjNTM1IzUzNSM1MxU3MxUjNTMVIycjNTMVIxUzFSMVIxUzNTMVIxUzFSM1MzUjNTsBNTMVIzUjNTMVBzMVIzUzNSM1MxUzNSM1MxUzNTMVMzUzFSMVMzUzFSMHMzUjNyM1MxUjFTMVIxUzFSM1MzUjNTMXIzUzJxUjNTM1IzUzNSM1MxUjFTMVIxUzFSM1ByM1MxUjNTMXMxUjNTM1IzUzNTM1IxUjNTM1IzUzFSMVMxUrARUjNTMVMxUjNTcjNTMVIxUzFSM1IxUzFSM1IxUjNSMVIzUzNSMVIzUzNyMVMwMzFSM1MzUjNTM1IzUzFSMVMxUjJzMVIxc1MxUjFTMVIxUzFSM1MzUjNTM1IzUzFTczFSM1MxUjJyM1MxUjFTMVIxUjFTM1MxUjFTMVIzUzNSM1OwE1MxUjNSM1MxUHMxUjNTM1IzUzFTM1IzUzFTM1MxUzNTMVIxUzNTMVIwczNSM3IzUzFSMVMxUjFTMVIzUzNSM1MxcjNTMnFSM1MzUjNTM1IzUzFSMVMxUjFTMVIzUHIzUzFSM1MxczFSM1MzUjNTM1MzUjFSM1MzUjNTMVIxUzFSsBFSM1MxUzFSM1NyM1MxUjFTMVIzUjFTMVIzUjFSM1IxUjNTM1IxUjNTM3IxUzAboOI18CAhQPEAwhDQICCzAFBCweEiUHAgkFBgexCQQFBgocEhwkPoFWRSMYCgojK1ZCBQg1HAoYAQMFCwUKCQsUDgsPEAYGOiUQCCUTHVkkJBsbZlJ3FxgTDxoPGQwJ1Rg2GRkZGTYYGBgZLCwsBRgYGBg2GRkZGQUlDBERDBwOIA0NDQ4RCgUFIA4ODiMFESUqAg42Dg4FFA8FCgUJBQ4TBQ4VEBAFGDYZGRkZNhgYGBksLCwFGBgYGDYZGRkZBSUMEREMHA4gDQ0NDhEKBQUgDg4OIwURJSoCDjYODgUUDwUK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AHkAcgBpAGcAaAB0ACAAMgAwADIAMgAgAFQAZQByAHIAeQBXAGEAbgBnAC4AQQBsAGwAIAByAGkAZwBoAHQAcwAgAHIAZQBzAGUAcgB2AGUAZAAuAE4ArACDAO8AgAABAFsAiwBPAFMAUgBlAGcAdQBsAGEAcgBOAKwAgwDvAIAAAQBbAIsATwBTADIALgAwADAAMgBOAKwAgwDvAIAAAQBbAIsATwBTADIALgAwADAAMgBLAGkAbgBnAEgAdwBhAF8ATwBsAGQAUwBvAG4AZwBLAGkAbgBnAEgAdwBhAF8ATwBsAGQAUwBvAG4AZwAgAGkAcwAgAGEAIAB0AHIAYQBkAGUAbQBhAHIAawAgAG8AZgAgAFQAZQByAHIAeQBXAGEAbgBnAC4AIABOAKwAgwDvAIAAAQBbAIsATwBTACAAMABvADAAAQBUAGUAcgByAHkAVwBhAG4AZwAwAG4AVQBGAGoAGQAwAGcAMABZADAAAgBOAKwAgwDvAIAAAQBbAIsATwBTAGYALwBzAIsAXgD3AHQAXgB2AIQAVQBGAGgABwAwAAIATgCsAIMA7wCAAAEAWwCLAE8AUwBmAC8AcwCLAF4A9wB0AF4AdgCEAFUARgBqABkAMAACAFQAZQByAHIAeQBXAGEAbgBnAHMAiwBeAPcAdABeAGcACACEAD0ATgBMAFUAfACXABwAbgDhAFkAKQAgAGwAXwBnAKsAbgAUAHAAawBbAPkAYQABAHcAIAAgAFkA0QCGAAcAVwDOAFkAFgBbANIAXABxAFsA+gAgAFkAHABTAEoAlAAYAIAAcgBSADAAWwCiAIIAOQAAAAIAAAAAAAD/TAAzAAAAAAAAAAAAAAAAAAAAAAAAAAMAAwAAAQIBAwV1NjRCMAV1NjYxRg==) format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+ */ + + url("KingHwa_OldSong.svg#KingHwa_OldSong") format("svg"); /* iOS 4.1- */ + font-style: normal; + font-weight: normal; +} + + diff --git a/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.css b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.css new file mode 100644 index 0000000..db802bb --- /dev/null +++ b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.css @@ -0,0 +1,14 @@ +@font-face { + font-family: "KingHwa_OldSong"; + src: url("KingHwa_OldSong.eot"); /* IE9 */ + src: url("KingHwa_OldSong.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */ + + url("KingHwa_OldSong.woff") format("woff"), /* chrome、firefox */ + url("KingHwa_OldSong.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+ */ + + url("KingHwa_OldSong.svg#KingHwa_OldSong") format("svg"); /* iOS 4.1- */ + font-style: normal; + font-weight: normal; +} + + diff --git a/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.eot b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.eot new file mode 100644 index 0000000..2ff8a28 Binary files /dev/null and b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.eot differ diff --git a/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.svg b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.svg new file mode 100644 index 0000000..2860e91 --- /dev/null +++ b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.ttf b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.ttf new file mode 100644 index 0000000..031ee3b Binary files /dev/null and b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.ttf differ diff --git a/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.woff b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.woff new file mode 100644 index 0000000..a4f4d78 Binary files /dev/null and b/assets/fonts/KingHwa_OldSong/KingHwa_OldSong.woff differ diff --git a/assets/fonts/TechnicLite.ttf b/assets/fonts/TechnicLite.ttf new file mode 100644 index 0000000..f95556f Binary files /dev/null and b/assets/fonts/TechnicLite.ttf differ diff --git a/assets/fonts/nice.ttf b/assets/fonts/nice.ttf new file mode 100644 index 0000000..4a07cd3 Binary files /dev/null and b/assets/fonts/nice.ttf differ diff --git a/assets/icon/cocoIconFont/demo.css b/assets/icon/cocoIconFont/demo.css new file mode 100644 index 0000000..a67054a --- /dev/null +++ b/assets/icon/cocoIconFont/demo.css @@ -0,0 +1,539 @@ +/* Logo 字体 */ +@font-face { + font-family: "iconfont logo"; + src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834'); + src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg'); +} + +.logo { + font-family: "iconfont logo"; + font-size: 160px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/* tabs */ +.nav-tabs { + position: relative; +} + +.nav-tabs .nav-more { + position: absolute; + right: 0; + bottom: 0; + height: 42px; + line-height: 42px; + color: #666; +} + +#tabs { + border-bottom: 1px solid #eee; +} + +#tabs li { + cursor: pointer; + width: 100px; + height: 40px; + line-height: 40px; + text-align: center; + font-size: 16px; + border-bottom: 2px solid transparent; + position: relative; + z-index: 1; + margin-bottom: -1px; + color: #666; +} + + +#tabs .active { + border-bottom-color: #f00; + color: #222; +} + +.tab-container .content { + display: none; +} + +/* 页面布局 */ +.main { + padding: 30px 100px; + width: 960px; + margin: 0 auto; +} + +.main .logo { + color: #333; + text-align: left; + margin-bottom: 30px; + line-height: 1; + height: 110px; + margin-top: -50px; + overflow: hidden; + *zoom: 1; +} + +.main .logo a { + font-size: 160px; + color: #333; +} + +.helps { + margin-top: 40px; +} + +.helps pre { + padding: 20px; + margin: 10px 0; + border: solid 1px #e7e1cd; + background-color: #fffdef; + overflow: auto; +} + +.icon_lists { + width: 100% !important; + overflow: hidden; + *zoom: 1; +} + +.icon_lists li { + width: 100px; + margin-bottom: 10px; + margin-right: 20px; + text-align: center; + list-style: none !important; + cursor: default; +} + +.icon_lists li .code-name { + line-height: 1.2; +} + +.icon_lists .icon { + display: block; + height: 100px; + line-height: 100px; + font-size: 42px; + margin: 10px auto; + color: #333; + -webkit-transition: font-size 0.25s linear, width 0.25s linear; + -moz-transition: font-size 0.25s linear, width 0.25s linear; + transition: font-size 0.25s linear, width 0.25s linear; +} + +.icon_lists .icon:hover { + font-size: 100px; +} + +.icon_lists .svg-icon { + /* 通过设置 font-size 来改变图标大小 */ + width: 1em; + /* 图标和文字相邻时，垂直对齐 */ + vertical-align: -0.15em; + /* 通过设置 color 来改变 SVG 的颜色/fill */ + fill: currentColor; + /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示 + normalize.css 中也包含这行 */ + overflow: hidden; +} + +.icon_lists li .name, +.icon_lists li .code-name { + color: #666; +} + +/* markdown 样式 */ +.markdown { + color: #666; + font-size: 14px; + line-height: 1.8; +} + +.highlight { + line-height: 1.5; +} + +.markdown img { + vertical-align: middle; + max-width: 100%; +} + +.markdown h1 { + color: #404040; + font-weight: 500; + line-height: 40px; + margin-bottom: 24px; +} + +.markdown h2, +.markdown h3, +.markdown h4, +.markdown h5, +.markdown h6 { + color: #404040; + margin: 1.6em 0 0.6em 0; + font-weight: 500; + clear: both; +} + +.markdown h1 { + font-size: 28px; +} + +.markdown h2 { + font-size: 22px; +} + +.markdown h3 { + font-size: 16px; +} + +.markdown h4 { + font-size: 14px; +} + +.markdown h5 { + font-size: 12px; +} + +.markdown h6 { + font-size: 12px; +} + +.markdown hr { + height: 1px; + border: 0; + background: #e9e9e9; + margin: 16px 0; + clear: both; +} + +.markdown p { + margin: 1em 0; +} + +.markdown>p, +.markdown>blockquote, +.markdown>.highlight, +.markdown>ol, +.markdown>ul { + width: 80%; +} + +.markdown ul>li { + list-style: circle; +} + +.markdown>ul li, +.markdown blockquote ul>li { + margin-left: 20px; + padding-left: 4px; +} + +.markdown>ul li p, +.markdown>ol li p { + margin: 0.6em 0; +} + +.markdown ol>li { + list-style: decimal; +} + +.markdown>ol li, +.markdown blockquote ol>li { + margin-left: 20px; + padding-left: 4px; +} + +.markdown code { + margin: 0 3px; + padding: 0 5px; + background: #eee; + border-radius: 3px; +} + +.markdown strong, +.markdown b { + font-weight: 600; +} + +.markdown>table { + border-collapse: collapse; + border-spacing: 0px; + empty-cells: show; + border: 1px solid #e9e9e9; + width: 95%; + margin-bottom: 24px; +} + +.markdown>table th { + white-space: nowrap; + color: #333; + font-weight: 600; +} + +.markdown>table th, +.markdown>table td { + border: 1px solid #e9e9e9; + padding: 8px 16px; + text-align: left; +} + +.markdown>table th { + background: #F7F7F7; +} + +.markdown blockquote { + font-size: 90%; + color: #999; + border-left: 4px solid #e9e9e9; + padding-left: 0.8em; + margin: 1em 0; +} + +.markdown blockquote p { + margin: 0; +} + +.markdown .anchor { + opacity: 0; + transition: opacity 0.3s ease; + margin-left: 8px; +} + +.markdown .waiting { + color: #ccc; +} + +.markdown h1:hover .anchor, +.markdown h2:hover .anchor, +.markdown h3:hover .anchor, +.markdown h4:hover .anchor, +.markdown h5:hover .anchor, +.markdown h6:hover .anchor { + opacity: 1; + display: inline-block; +} + +.markdown>br, +.markdown>p>br { + clear: both; +} + + +.hljs { + display: block; + background: white; + padding: 0.5em; + color: #333333; + overflow-x: auto; +} + +.hljs-comment, +.hljs-meta { + color: #969896; +} + +.hljs-string, +.hljs-variable, +.hljs-template-variable, +.hljs-strong, +.hljs-emphasis, +.hljs-quote { + color: #df5000; +} + +.hljs-keyword, +.hljs-selector-tag, +.hljs-type { + color: #a71d5d; +} + +.hljs-literal, +.hljs-symbol, +.hljs-bullet, +.hljs-attribute { + color: #0086b3; +} + +.hljs-section, +.hljs-name { + color: #63a35c; +} + +.hljs-tag { + color: #333333; +} + +.hljs-title, +.hljs-attr, +.hljs-selector-id, +.hljs-selector-class, +.hljs-selector-attr, +.hljs-selector-pseudo { + color: #795da3; +} + +.hljs-addition { + color: #55a532; + background-color: #eaffea; +} + +.hljs-deletion { + color: #bd2c00; + background-color: #ffecec; +} + +.hljs-link { + text-decoration: underline; +} + +/* 代码高亮 */ +/* PrismJS 1.15.0 +https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */ +/** + * prism.js default theme for JavaScript, CSS and HTML + * Based on dabblet (http://dabblet.com) + * @author Lea Verou + */ +code[class*="language-"], +pre[class*="language-"] { + color: black; + background: none; + text-shadow: 0 1px white; + font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; + text-align: left; + white-space: pre; + word-spacing: normal; + word-break: normal; + word-wrap: normal; + line-height: 1.5; + + -moz-tab-size: 4; + -o-tab-size: 4; + tab-size: 4; + + -webkit-hyphens: none; + -moz-hyphens: none; + -ms-hyphens: none; + hyphens: none; +} + +pre[class*="language-"]::-moz-selection, +pre[class*="language-"] ::-moz-selection, +code[class*="language-"]::-moz-selection, +code[class*="language-"] ::-moz-selection { + text-shadow: none; + background: #b3d4fc; +} + +pre[class*="language-"]::selection, +pre[class*="language-"] ::selection, +code[class*="language-"]::selection, +code[class*="language-"] ::selection { + text-shadow: none; + background: #b3d4fc; +} + +@media print { + + code[class*="language-"], + pre[class*="language-"] { + text-shadow: none; + } +} + +/* Code blocks */ +pre[class*="language-"] { + padding: 1em; + margin: .5em 0; + overflow: auto; +} + +:not(pre)>code[class*="language-"], +pre[class*="language-"] { + background: #f5f2f0; +} + +/* Inline code */ +:not(pre)>code[class*="language-"] { + padding: .1em; + border-radius: .3em; + white-space: normal; +} + +.token.comment, +.token.prolog, +.token.doctype, +.token.cdata { + color: slategray; +} + +.token.punctuation { + color: #999; +} + +.namespace { + opacity: .7; +} + +.token.property, +.token.tag, +.token.boolean, +.token.number, +.token.constant, +.token.symbol, +.token.deleted { + color: #905; +} + +.token.selector, +.token.attr-name, +.token.string, +.token.char, +.token.builtin, +.token.inserted { + color: #690; +} + +.token.operator, +.token.entity, +.token.url, +.language-css .token.string, +.style .token.string { + color: #9a6e3a; + background: hsla(0, 0%, 100%, .5); +} + +.token.atrule, +.token.attr-value, +.token.keyword { + color: #07a; +} + +.token.function, +.token.class-name { + color: #DD4A68; +} + +.token.regex, +.token.important, +.token.variable { + color: #e90; +} + +.token.important, +.token.bold { + font-weight: bold; +} + +.token.italic { + font-style: italic; +} + +.token.entity { + cursor: help; +} diff --git a/assets/icon/cocoIconFont/demo_index.html b/assets/icon/cocoIconFont/demo_index.html new file mode 100644 index 0000000..05a4c5e --- /dev/null +++ b/assets/icon/cocoIconFont/demo_index.html @@ -0,0 +1,878 @@ + + + + + iconfont Demo + + + + + + + + + + + + + +
+

+ + +

+
+ + + 查看项目 + +
+
+
+
    + +
  • + +
    菜单管理
    +
    
    +
    • + +
  • + +
    订单或日志
    +
    
    +
    • + +
  • + +
    答题系统管理
    +
    
    +
    • + +
  • + +
    产品介绍
    +
    
    +
    • + +
  • + +
    服务管理
    +
    
    +
    • + +
  • + +
    服务注册中心
    +
    
    +
    • + +
  • + +
    规则管理
    +
    
    +
    • + +
  • + +
    广播信息
    +
    
    +
    • + +
  • + +
    家长试题
    +
    
    +
    • + +
  • + +
    服务链路
    +
    
    +
    • + +
  • + +
    服务权限管理
    +
    
    +
    • + +
  • + +
    客服
    +
    
    +
    • + +
  • + +
    家政系统管理
    +
    
    +
    • + +
  • + +
    监控模块管理
    +
    
    +
    • + +
  • + +
    角色管理
    +
    
    +
    • + +
  • + +
    基础配置管理
    +
    
    +
    • + +
  • + +
    留言管理
    +
    
    +
    • + +
  • + +
    孩子试题
    +
    
    +
    • + +
  • + +
    图片
    +
    
    +
    • + +
  • + +
    角色权限
    +
    
    +
    • + +
  • + +
    角色类型
    +
    
    +
    • + +
  • + +
    用户管理（2）
    +
    
    +
    • + +
  • + +
    系统管理（填充）
    +
    
    +
    • + +
  • + +
    用户
    +
    
    +
    • + +
  • + +
    系统设置（线性）
    +
    
    +
    • + +
  • + +
    指南
    +
    
    +
    • + +
  • + +
    试题管理
    +
    
    +
    • + +
  • + +
    状态或审核
    +
    
    +
    • + +
  • + +
    字典管理
    +
    
    +
    • + +
  • + +
    用户管理
    +
    
    +
    • + +
+
+

Unicode 引用

+
+ +

Unicode 是字体在网页端最原始的应用方式，特点是：

+
    +
  • 支持按字体的方式去动态调整图标大小，颜色等等。
    • +
  • 默认情况下不支持多色，直接添加多色图标会自动去色。
    • +
+
+

注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）

+
+

Unicode 使用步骤如下：

+

第一步：拷贝项目下面生成的 @font-face

+
@font-face {
+  font-family: 'iconfont';
+  src: url('iconfont.woff2?t=1745318587973') format('woff2'),
+       url('iconfont.woff?t=1745318587973') format('woff'),
+       url('iconfont.ttf?t=1745318587973') format('truetype');
+}
+
+

第二步：定义使用 iconfont 的样式

+
.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+

第三步：挑选相应图标并获取字体编码，应用于页面

+
+<span class="iconfont">&#x33;</span>
+
+
+

"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    + 菜单管理 +
    +
    .icon-caidanguanli +
    +
    • + +
  • + +
    + 订单或日志 +
    +
    .icon-dingdanhuorizhi +
    +
    • + +
  • + +
    + 答题系统管理 +
    +
    .icon-datixitongguanli +
    +
    • + +
  • + +
    + 产品介绍 +
    +
    .icon-chanpinjieshao +
    +
    • + +
  • + +
    + 服务管理 +
    +
    .icon-fuwuguanli +
    +
    • + +
  • + +
    + 服务注册中心 +
    +
    .icon-fuwuzhucezhongxin +
    +
    • + +
  • + +
    + 规则管理 +
    +
    .icon-guizeguanli +
    +
    • + +
  • + +
    + 广播信息 +
    +
    .icon-guangboxinxi +
    +
    • + +
  • + +
    + 家长试题 +
    +
    .icon-jiachangshiti +
    +
    • + +
  • + +
    + 服务链路 +
    +
    .icon-fuwulianlu +
    +
    • + +
  • + +
    + 服务权限管理 +
    +
    .icon-fuwuquanxianguanli +
    +
    • + +
  • + +
    + 客服 +
    +
    .icon-kefu +
    +
    • + +
  • + +
    + 家政系统管理 +
    +
    .icon-jiazhengxitongguanli +
    +
    • + +
  • + +
    + 监控模块管理 +
    +
    .icon-jiankongmokuaiguanli +
    +
    • + +
  • + +
    + 角色管理 +
    +
    .icon-jiaoseguanli +
    +
    • + +
  • + +
    + 基础配置管理 +
    +
    .icon-jichupeizhiguanli +
    +
    • + +
  • + +
    + 留言管理 +
    +
    .icon-liuyanguanli +
    +
    • + +
  • + +
    + 孩子试题 +
    +
    .icon-haizishiti +
    +
    • + +
  • + +
    + 图片 +
    +
    .icon-tupian +
    +
    • + +
  • + +
    + 角色权限 +
    +
    .icon-jiaosequanxian +
    +
    • + +
  • + +
    + 角色类型 +
    +
    .icon-jiaoseleixing +
    +
    • + +
  • + +
    + 用户管理（2） +
    +
    .icon-yonghuguanli +
    +
    • + +
  • + +
    + 系统管理（填充） +
    +
    .icon-xitongguanlitianchong +
    +
    • + +
  • + +
    + 用户 +
    +
    .icon-yonghu +
    +
    • + +
  • + +
    + 系统设置（线性） +
    +
    .icon-xitongshezhixianxing +
    +
    • + +
  • + +
    + 指南 +
    +
    .icon-zhinan +
    +
    • + +
  • + +
    + 试题管理 +
    +
    .icon-shitiguanli +
    +
    • + +
  • + +
    + 状态或审核 +
    +
    .icon-zhuangtaihuoshenhe +
    +
    • + +
  • + +
    + 字典管理 +
    +
    .icon-zidianguanli +
    +
    • + +
  • + +
    + 用户管理 +
    +
    .icon-yonghuguanli1 +
    +
    • + +
+
+

font-class 引用

+
+ +

font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。

+

与 Unicode 使用方式相比，具有如下特点：

+
    +
  • 相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。
    • +
  • 因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。
    • +
+

使用步骤如下：

+

第一步：引入项目下面生成的 fontclass 代码：

+
<link rel="stylesheet" href="./iconfont.css">
+
+

第二步：挑选相应图标并获取类名，应用于页面：

+
<span class="iconfont icon-xxx"></span>
+
+
+

" + iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    菜单管理
    +
    #icon-caidanguanli
    +
    • + +
  • + +
    订单或日志
    +
    #icon-dingdanhuorizhi
    +
    • + +
  • + +
    答题系统管理
    +
    #icon-datixitongguanli
    +
    • + +
  • + +
    产品介绍
    +
    #icon-chanpinjieshao
    +
    • + +
  • + +
    服务管理
    +
    #icon-fuwuguanli
    +
    • + +
  • + +
    服务注册中心
    +
    #icon-fuwuzhucezhongxin
    +
    • + +
  • + +
    规则管理
    +
    #icon-guizeguanli
    +
    • + +
  • + +
    广播信息
    +
    #icon-guangboxinxi
    +
    • + +
  • + +
    家长试题
    +
    #icon-jiachangshiti
    +
    • + +
  • + +
    服务链路
    +
    #icon-fuwulianlu
    +
    • + +
  • + +
    服务权限管理
    +
    #icon-fuwuquanxianguanli
    +
    • + +
  • + +
    客服
    +
    #icon-kefu
    +
    • + +
  • + +
    家政系统管理
    +
    #icon-jiazhengxitongguanli
    +
    • + +
  • + +
    监控模块管理
    +
    #icon-jiankongmokuaiguanli
    +
    • + +
  • + +
    角色管理
    +
    #icon-jiaoseguanli
    +
    • + +
  • + +
    基础配置管理
    +
    #icon-jichupeizhiguanli
    +
    • + +
  • + +
    留言管理
    +
    #icon-liuyanguanli
    +
    • + +
  • + +
    孩子试题
    +
    #icon-haizishiti
    +
    • + +
  • + +
    图片
    +
    #icon-tupian
    +
    • + +
  • + +
    角色权限
    +
    #icon-jiaosequanxian
    +
    • + +
  • + +
    角色类型
    +
    #icon-jiaoseleixing
    +
    • + +
  • + +
    用户管理（2）
    +
    #icon-yonghuguanli
    +
    • + +
  • + +
    系统管理（填充）
    +
    #icon-xitongguanlitianchong
    +
    • + +
  • + +
    用户
    +
    #icon-yonghu
    +
    • + +
  • + +
    系统设置（线性）
    +
    #icon-xitongshezhixianxing
    +
    • + +
  • + +
    指南
    +
    #icon-zhinan
    +
    • + +
  • + +
    试题管理
    +
    #icon-shitiguanli
    +
    • + +
  • + +
    状态或审核
    +
    #icon-zhuangtaihuoshenhe
    +
    • + +
  • + +
    字典管理
    +
    #icon-zidianguanli
    +
    • + +
  • + +
    用户管理
    +
    #icon-yonghuguanli1
    +
    • + +
+
+

Symbol 引用

+
+ +

这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇文章 + 这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：

+
    +
  • 支持多色图标了，不再受单色限制。
    • +
  • 通过一些技巧，支持像字体那样，通过 font-size, color 来调整样式。
    • +
  • 兼容性较差，支持 IE9+，及现代浏览器。
    • +
  • 浏览器渲染 SVG 的性能一般，还不如 png。
    • +
+

使用步骤如下：

+

第一步：引入项目下面生成的 symbol 代码：

+
<script src="./iconfont.js"></script>
+
+

第二步：加入通用 CSS 代码（引入一次就行）：

+
<style>
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+</style>
+
+

第三步：挑选相应图标并获取类名，应用于页面：

+
<svg class="icon" aria-hidden="true">
+  <use xlink:href="#icon-xxx"></use>
+</svg>
+
+
+
+ +
+
+ + + diff --git a/assets/icon/cocoIconFont/iconfont.css b/assets/icon/cocoIconFont/iconfont.css new file mode 100644 index 0000000..d65373d --- /dev/null +++ b/assets/icon/cocoIconFont/iconfont.css @@ -0,0 +1,135 @@ +@font-face { + font-family: "cocoIconFont"; /* Project id 4902183 */ + src: url('iconfont.woff2?t=1745318587973') format('woff2'), + url('iconfont.woff?t=1745318587973') format('woff'), + url('iconfont.ttf?t=1745318587973') format('truetype'); +} + +.cocoIconFont { + font-family: "cocoIconFont" !important; + font-size: 16px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-caidanguanli:before { + content: "\e661"; +} + +.icon-dingdanhuorizhi:before { + content: "\e662"; +} + +.icon-datixitongguanli:before { + content: "\e663"; +} + +.icon-chanpinjieshao:before { + content: "\e664"; +} + +.icon-fuwuguanli:before { + content: "\e665"; +} + +.icon-fuwuzhucezhongxin:before { + content: "\e666"; +} + +.icon-guizeguanli:before { + content: "\e667"; +} + +.icon-guangboxinxi:before { + content: "\e668"; +} + +.icon-jiachangshiti:before { + content: "\e669"; +} + +.icon-fuwulianlu:before { + content: "\e66a"; +} + +.icon-fuwuquanxianguanli:before { + content: "\e66b"; +} + +.icon-kefu:before { + content: "\e66c"; +} + +.icon-jiazhengxitongguanli:before { + content: "\e66d"; +} + +.icon-jiankongmokuaiguanli:before { + content: "\e66e"; +} + +.icon-jiaoseguanli:before { + content: "\e66f"; +} + +.icon-jichupeizhiguanli:before { + content: "\e670"; +} + +.icon-liuyanguanli:before { + content: "\e671"; +} + +.icon-haizishiti:before { + content: "\e672"; +} + +.icon-tupian:before { + content: "\e673"; +} + +.icon-jiaosequanxian:before { + content: "\e674"; +} + +.icon-jiaoseleixing:before { + content: "\e675"; +} + +.icon-yonghuguanli:before { + content: "\e676"; +} + +.icon-xitongguanlitianchong:before { + content: "\e677"; +} + +.icon-yonghu:before { + content: "\e678"; +} + +.icon-xitongshezhixianxing:before { + content: "\e679"; +} + +.icon-zhinan:before { + content: "\e67a"; +} + +.icon-shitiguanli:before { + content: "\e67b"; +} + +.icon-zhuangtaihuoshenhe:before { + content: "\e67c"; +} + +.icon-zidianguanli:before { + content: "\e67d"; +} + +.icon-yonghuguanli1:before { + content: "\e67e"; +} + diff --git a/assets/icon/cocoIconFont/iconfont.js b/assets/icon/cocoIconFont/iconfont.js new file mode 100644 index 0000000..606d5e3 --- /dev/null +++ b/assets/icon/cocoIconFont/iconfont.js @@ -0,0 +1 @@ +window._iconfont_svg_string_4902183='',(l=>{var c=(h=(h=document.getElementsByTagName("script"))[h.length-1]).getAttribute("data-injectcss"),h=h.getAttribute("data-disable-injectsvg");if(!h){var t,i,o,a,s,m=function(c,h){h.parentNode.insertBefore(c,h)};if(c&&!l.__iconfont__svg__cssinject__){l.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(c){console&&console.log(c)}}t=function(){var c,h=document.createElement("div");h.innerHTML=l._iconfont_svg_string_4902183,(h=h.getElementsByTagName("svg")[0])&&(h.setAttribute("aria-hidden","true"),h.style.position="absolute",h.style.width=0,h.style.height=0,h.style.overflow="hidden",h=h,(c=document.body).firstChild?m(h,c.firstChild):c.appendChild(h))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(t,0):(i=function(){document.removeEventListener("DOMContentLoaded",i,!1),t()},document.addEventListener("DOMContentLoaded",i,!1)):document.attachEvent&&(o=t,a=l.document,s=!1,e(),a.onreadystatechange=function(){"complete"==a.readyState&&(a.onreadystatechange=null,n())})}function n(){s||(s=!0,o())}function e(){try{a.documentElement.doScroll("left")}catch(c){return void setTimeout(e,50)}n()}})(window); \ No newline at end of file diff --git a/assets/icon/cocoIconFont/iconfont.json b/assets/icon/cocoIconFont/iconfont.json new file mode 100644 index 0000000..0735a92 --- /dev/null +++ b/assets/icon/cocoIconFont/iconfont.json @@ -0,0 +1,219 @@ +{ + "id": "4902183", + "name": "start2-coco", + "font_family": "iconfont", + "css_prefix_text": "icon-", + "description": "", + "glyphs": [ + { + "icon_id": "8605710", + "name": "菜单管理", + "font_class": "caidanguanli", + "unicode": "e661", + "unicode_decimal": 58977 + }, + { + "icon_id": "8605712", + "name": "订单或日志", + "font_class": "dingdanhuorizhi", + "unicode": "e662", + "unicode_decimal": 58978 + }, + { + "icon_id": "8605713", + "name": "答题系统管理", + "font_class": "datixitongguanli", + "unicode": "e663", + "unicode_decimal": 58979 + }, + { + "icon_id": "8605714", + "name": "产品介绍", + "font_class": "chanpinjieshao", + "unicode": "e664", + "unicode_decimal": 58980 + }, + { + "icon_id": "8605716", + "name": "服务管理", + "font_class": "fuwuguanli", + "unicode": "e665", + "unicode_decimal": 58981 + }, + { + "icon_id": "8605718", + "name": "服务注册中心", + "font_class": "fuwuzhucezhongxin", + "unicode": "e666", + "unicode_decimal": 58982 + }, + { + "icon_id": "8605719", + "name": "规则管理", + "font_class": "guizeguanli", + "unicode": "e667", + "unicode_decimal": 58983 + }, + { + "icon_id": "8605720", + "name": "广播信息", + "font_class": "guangboxinxi", + "unicode": "e668", + "unicode_decimal": 58984 + }, + { + "icon_id": "8605724", + "name": "家长试题", + "font_class": "jiachangshiti", + "unicode": "e669", + "unicode_decimal": 58985 + }, + { + "icon_id": "8605725", + "name": "服务链路", + "font_class": "fuwulianlu", + "unicode": "e66a", + "unicode_decimal": 58986 + }, + { + "icon_id": "8605726", + "name": "服务权限管理", + "font_class": "fuwuquanxianguanli", + "unicode": "e66b", + "unicode_decimal": 58987 + }, + { + "icon_id": "8605730", + "name": "客服", + "font_class": "kefu", + "unicode": "e66c", + "unicode_decimal": 58988 + }, + { + "icon_id": "8605731", + "name": "家政系统管理", + "font_class": "jiazhengxitongguanli", + "unicode": "e66d", + "unicode_decimal": 58989 + }, + { + "icon_id": "8605732", + "name": "监控模块管理", + "font_class": "jiankongmokuaiguanli", + "unicode": "e66e", + "unicode_decimal": 58990 + }, + { + "icon_id": "8605733", + "name": "角色管理", + "font_class": "jiaoseguanli", + "unicode": "e66f", + "unicode_decimal": 58991 + }, + { + "icon_id": "8605734", + "name": "基础配置管理", + "font_class": "jichupeizhiguanli", + "unicode": "e670", + "unicode_decimal": 58992 + }, + { + "icon_id": "8605736", + "name": "留言管理", + "font_class": "liuyanguanli", + "unicode": "e671", + "unicode_decimal": 58993 + }, + { + "icon_id": "8605738", + "name": "孩子试题", + "font_class": "haizishiti", + "unicode": "e672", + "unicode_decimal": 58994 + }, + { + "icon_id": "8605739", + "name": "图片", + "font_class": "tupian", + "unicode": "e673", + "unicode_decimal": 58995 + }, + { + "icon_id": "8605740", + "name": "角色权限", + "font_class": "jiaosequanxian", + "unicode": "e674", + "unicode_decimal": 58996 + }, + { + "icon_id": "8605742", + "name": "角色类型", + "font_class": "jiaoseleixing", + "unicode": "e675", + "unicode_decimal": 58997 + }, + { + "icon_id": "8605743", + "name": "用户管理（2）", + "font_class": "yonghuguanli", + "unicode": "e676", + "unicode_decimal": 58998 + }, + { + "icon_id": "8605744", + "name": "系统管理（填充）", + "font_class": "xitongguanlitianchong", + "unicode": "e677", + "unicode_decimal": 58999 + }, + { + "icon_id": "8605745", + "name": "用户", + "font_class": "yonghu", + "unicode": "e678", + "unicode_decimal": 59000 + }, + { + "icon_id": "8605746", + "name": "系统设置（线性）", + "font_class": "xitongshezhixianxing", + "unicode": "e679", + "unicode_decimal": 59001 + }, + { + "icon_id": "8605747", + "name": "指南", + "font_class": "zhinan", + "unicode": "e67a", + "unicode_decimal": 59002 + }, + { + "icon_id": "8605748", + "name": "试题管理", + "font_class": "shitiguanli", + "unicode": "e67b", + "unicode_decimal": 59003 + }, + { + "icon_id": "8605753", + "name": "状态或审核", + "font_class": "zhuangtaihuoshenhe", + "unicode": "e67c", + "unicode_decimal": 59004 + }, + { + "icon_id": "8605754", + "name": "字典管理", + "font_class": "zidianguanli", + "unicode": "e67d", + "unicode_decimal": 59005 + }, + { + "icon_id": "8605760", + "name": "用户管理", + "font_class": "yonghuguanli1", + "unicode": "e67e", + "unicode_decimal": 59006 + } + ] +} diff --git a/assets/icon/cocoIconFont/iconfont.ttf b/assets/icon/cocoIconFont/iconfont.ttf new file mode 100644 index 0000000..03ccec2 Binary files /dev/null and b/assets/icon/cocoIconFont/iconfont.ttf differ diff --git a/assets/icon/cocoIconFont/iconfont.woff b/assets/icon/cocoIconFont/iconfont.woff new file mode 100644 index 0000000..d503170 Binary files /dev/null and b/assets/icon/cocoIconFont/iconfont.woff differ diff --git a/assets/icon/cocoIconFont/iconfont.woff2 b/assets/icon/cocoIconFont/iconfont.woff2 new file mode 100644 index 0000000..fb0210f Binary files /dev/null and b/assets/icon/cocoIconFont/iconfont.woff2 differ diff --git a/assets/icon/sxIconFont/demo.css b/assets/icon/sxIconFont/demo.css new file mode 100644 index 0000000..a67054a --- /dev/null +++ b/assets/icon/sxIconFont/demo.css @@ -0,0 +1,539 @@ +/* Logo 字体 */ +@font-face { + font-family: "iconfont logo"; + src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834'); + src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg'); +} + +.logo { + font-family: "iconfont logo"; + font-size: 160px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/* tabs */ +.nav-tabs { + position: relative; +} + +.nav-tabs .nav-more { + position: absolute; + right: 0; + bottom: 0; + height: 42px; + line-height: 42px; + color: #666; +} + +#tabs { + border-bottom: 1px solid #eee; +} + +#tabs li { + cursor: pointer; + width: 100px; + height: 40px; + line-height: 40px; + text-align: center; + font-size: 16px; + border-bottom: 2px solid transparent; + position: relative; + z-index: 1; + margin-bottom: -1px; + color: #666; +} + + +#tabs .active { + border-bottom-color: #f00; + color: #222; +} + +.tab-container .content { + display: none; +} + +/* 页面布局 */ +.main { + padding: 30px 100px; + width: 960px; + margin: 0 auto; +} + +.main .logo { + color: #333; + text-align: left; + margin-bottom: 30px; + line-height: 1; + height: 110px; + margin-top: -50px; + overflow: hidden; + *zoom: 1; +} + +.main .logo a { + font-size: 160px; + color: #333; +} + +.helps { + margin-top: 40px; +} + +.helps pre { + padding: 20px; + margin: 10px 0; + border: solid 1px #e7e1cd; + background-color: #fffdef; + overflow: auto; +} + +.icon_lists { + width: 100% !important; + overflow: hidden; + *zoom: 1; +} + +.icon_lists li { + width: 100px; + margin-bottom: 10px; + margin-right: 20px; + text-align: center; + list-style: none !important; + cursor: default; +} + +.icon_lists li .code-name { + line-height: 1.2; +} + +.icon_lists .icon { + display: block; + height: 100px; + line-height: 100px; + font-size: 42px; + margin: 10px auto; + color: #333; + -webkit-transition: font-size 0.25s linear, width 0.25s linear; + -moz-transition: font-size 0.25s linear, width 0.25s linear; + transition: font-size 0.25s linear, width 0.25s linear; +} + +.icon_lists .icon:hover { + font-size: 100px; +} + +.icon_lists .svg-icon { + /* 通过设置 font-size 来改变图标大小 */ + width: 1em; + /* 图标和文字相邻时，垂直对齐 */ + vertical-align: -0.15em; + /* 通过设置 color 来改变 SVG 的颜色/fill */ + fill: currentColor; + /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示 + normalize.css 中也包含这行 */ + overflow: hidden; +} + +.icon_lists li .name, +.icon_lists li .code-name { + color: #666; +} + +/* markdown 样式 */ +.markdown { + color: #666; + font-size: 14px; + line-height: 1.8; +} + +.highlight { + line-height: 1.5; +} + +.markdown img { + vertical-align: middle; + max-width: 100%; +} + +.markdown h1 { + color: #404040; + font-weight: 500; + line-height: 40px; + margin-bottom: 24px; +} + +.markdown h2, +.markdown h3, +.markdown h4, +.markdown h5, +.markdown h6 { + color: #404040; + margin: 1.6em 0 0.6em 0; + font-weight: 500; + clear: both; +} + +.markdown h1 { + font-size: 28px; +} + +.markdown h2 { + font-size: 22px; +} + +.markdown h3 { + font-size: 16px; +} + +.markdown h4 { + font-size: 14px; +} + +.markdown h5 { + font-size: 12px; +} + +.markdown h6 { + font-size: 12px; +} + +.markdown hr { + height: 1px; + border: 0; + background: #e9e9e9; + margin: 16px 0; + clear: both; +} + +.markdown p { + margin: 1em 0; +} + +.markdown>p, +.markdown>blockquote, +.markdown>.highlight, +.markdown>ol, +.markdown>ul { + width: 80%; +} + +.markdown ul>li { + list-style: circle; +} + +.markdown>ul li, +.markdown blockquote ul>li { + margin-left: 20px; + padding-left: 4px; +} + +.markdown>ul li p, +.markdown>ol li p { + margin: 0.6em 0; +} + +.markdown ol>li { + list-style: decimal; +} + +.markdown>ol li, +.markdown blockquote ol>li { + margin-left: 20px; + padding-left: 4px; +} + +.markdown code { + margin: 0 3px; + padding: 0 5px; + background: #eee; + border-radius: 3px; +} + +.markdown strong, +.markdown b { + font-weight: 600; +} + +.markdown>table { + border-collapse: collapse; + border-spacing: 0px; + empty-cells: show; + border: 1px solid #e9e9e9; + width: 95%; + margin-bottom: 24px; +} + +.markdown>table th { + white-space: nowrap; + color: #333; + font-weight: 600; +} + +.markdown>table th, +.markdown>table td { + border: 1px solid #e9e9e9; + padding: 8px 16px; + text-align: left; +} + +.markdown>table th { + background: #F7F7F7; +} + +.markdown blockquote { + font-size: 90%; + color: #999; + border-left: 4px solid #e9e9e9; + padding-left: 0.8em; + margin: 1em 0; +} + +.markdown blockquote p { + margin: 0; +} + +.markdown .anchor { + opacity: 0; + transition: opacity 0.3s ease; + margin-left: 8px; +} + +.markdown .waiting { + color: #ccc; +} + +.markdown h1:hover .anchor, +.markdown h2:hover .anchor, +.markdown h3:hover .anchor, +.markdown h4:hover .anchor, +.markdown h5:hover .anchor, +.markdown h6:hover .anchor { + opacity: 1; + display: inline-block; +} + +.markdown>br, +.markdown>p>br { + clear: both; +} + + +.hljs { + display: block; + background: white; + padding: 0.5em; + color: #333333; + overflow-x: auto; +} + +.hljs-comment, +.hljs-meta { + color: #969896; +} + +.hljs-string, +.hljs-variable, +.hljs-template-variable, +.hljs-strong, +.hljs-emphasis, +.hljs-quote { + color: #df5000; +} + +.hljs-keyword, +.hljs-selector-tag, +.hljs-type { + color: #a71d5d; +} + +.hljs-literal, +.hljs-symbol, +.hljs-bullet, +.hljs-attribute { + color: #0086b3; +} + +.hljs-section, +.hljs-name { + color: #63a35c; +} + +.hljs-tag { + color: #333333; +} + +.hljs-title, +.hljs-attr, +.hljs-selector-id, +.hljs-selector-class, +.hljs-selector-attr, +.hljs-selector-pseudo { + color: #795da3; +} + +.hljs-addition { + color: #55a532; + background-color: #eaffea; +} + +.hljs-deletion { + color: #bd2c00; + background-color: #ffecec; +} + +.hljs-link { + text-decoration: underline; +} + +/* 代码高亮 */ +/* PrismJS 1.15.0 +https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */ +/** + * prism.js default theme for JavaScript, CSS and HTML + * Based on dabblet (http://dabblet.com) + * @author Lea Verou + */ +code[class*="language-"], +pre[class*="language-"] { + color: black; + background: none; + text-shadow: 0 1px white; + font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; + text-align: left; + white-space: pre; + word-spacing: normal; + word-break: normal; + word-wrap: normal; + line-height: 1.5; + + -moz-tab-size: 4; + -o-tab-size: 4; + tab-size: 4; + + -webkit-hyphens: none; + -moz-hyphens: none; + -ms-hyphens: none; + hyphens: none; +} + +pre[class*="language-"]::-moz-selection, +pre[class*="language-"] ::-moz-selection, +code[class*="language-"]::-moz-selection, +code[class*="language-"] ::-moz-selection { + text-shadow: none; + background: #b3d4fc; +} + +pre[class*="language-"]::selection, +pre[class*="language-"] ::selection, +code[class*="language-"]::selection, +code[class*="language-"] ::selection { + text-shadow: none; + background: #b3d4fc; +} + +@media print { + + code[class*="language-"], + pre[class*="language-"] { + text-shadow: none; + } +} + +/* Code blocks */ +pre[class*="language-"] { + padding: 1em; + margin: .5em 0; + overflow: auto; +} + +:not(pre)>code[class*="language-"], +pre[class*="language-"] { + background: #f5f2f0; +} + +/* Inline code */ +:not(pre)>code[class*="language-"] { + padding: .1em; + border-radius: .3em; + white-space: normal; +} + +.token.comment, +.token.prolog, +.token.doctype, +.token.cdata { + color: slategray; +} + +.token.punctuation { + color: #999; +} + +.namespace { + opacity: .7; +} + +.token.property, +.token.tag, +.token.boolean, +.token.number, +.token.constant, +.token.symbol, +.token.deleted { + color: #905; +} + +.token.selector, +.token.attr-name, +.token.string, +.token.char, +.token.builtin, +.token.inserted { + color: #690; +} + +.token.operator, +.token.entity, +.token.url, +.language-css .token.string, +.style .token.string { + color: #9a6e3a; + background: hsla(0, 0%, 100%, .5); +} + +.token.atrule, +.token.attr-value, +.token.keyword { + color: #07a; +} + +.token.function, +.token.class-name { + color: #DD4A68; +} + +.token.regex, +.token.important, +.token.variable { + color: #e90; +} + +.token.important, +.token.bold { + font-weight: bold; +} + +.token.italic { + font-style: italic; +} + +.token.entity { + cursor: help; +} diff --git a/assets/icon/sxIconFont/demo_index.html b/assets/icon/sxIconFont/demo_index.html new file mode 100644 index 0000000..e8c98fa --- /dev/null +++ b/assets/icon/sxIconFont/demo_index.html @@ -0,0 +1,2764 @@ + + + + + iconfont Demo + + + + + + + + + + + + + +
+

+ + +

+
+ + + 查看项目 + +
+
+
+
    + +
  • + +
    菜单
    +
    &#xe66a;
    +
    • + +
  • + +
    保存
    +
    &#xe66b;
    +
    • + +
  • + +
    不可见
    +
    &#xe66c;
    +
    • + +
  • + +
    编辑
    +
    &#xe66d;
    +
    • + +
  • + +
    定位
    +
    &#xe66e;
    +
    • + +
  • + +
    打印
    +
    &#xe66f;
    +
    • + +
  • + +
    发布
    +
    &#xe670;
    +
    • + +
  • + +
    分享
    +
    &#xe671;
    +
    • + +
  • + +
    更多
    +
    &#xe672;
    +
    • + +
  • + +
    加号
    +
    &#xe673;
    +
    • + +
  • + +
    关闭
    +
    &#xe674;
    +
    • + +
  • + +
    复制
    +
    &#xe675;
    +
    • + +
  • + +
    电话
    +
    &#xe676;
    +
    • + +
  • + +
    撤销
    +
    &#xe677;
    +
    • + +
  • + +
    减号
    +
    &#xe678;
    +
    • + +
  • + +
    放大
    +
    &#xe679;
    +
    • + +
  • + +
    可见
    +
    &#xe67a;
    +
    • + +
  • + +
    警告
    +
    &#xe67b;
    +
    • + +
  • + +
    减少
    +
    &#xe67c;
    +
    • + +
  • + +
    个人中心
    +
    &#xe67d;
    +
    • + +
  • + +
    拍照
    +
    &#xe67e;
    +
    • + +
  • + +
    评论
    +
    &#xe67f;
    +
    • + +
  • + +
    列表
    +
    &#xe680;
    +
    • + +
  • + +
    门店
    +
    &#xe681;
    +
    • + +
  • + +
    日历
    +
    &#xe682;
    +
    • + +
  • + +
    链接
    +
    &#xe683;
    +
    • + +
  • + +
    删除
    +
    &#xe684;
    +
    • + +
  • + +
    扫一扫
    +
    &#xe685;
    +
    • + +
  • + +
    上传
    +
    &#xe686;
    +
    • + +
  • + +
    刷新
    +
    &#xe687;
    +
    • + +
  • + +
    清除
    +
    &#xe688;
    +
    • + +
  • + +
    收藏
    +
    &#xe689;
    +
    • + +
  • + +
    缩小
    +
    &#xe68a;
    +
    • + +
  • + +
    通知
    +
    &#xe68b;
    +
    • + +
  • + +
    搜索
    +
    &#xe68c;
    +
    • + +
  • + +
    图片
    +
    &#xe68d;
    +
    • + +
  • + +
    退出
    +
    &#xe68e;
    +
    • + +
  • + +
    文件夹
    +
    &#xe68f;
    +
    • + +
  • + +
    向上
    +
    &#xe690;
    +
    • + +
  • + +
    完成
    +
    &#xe691;
    +
    • + +
  • + +
    筛选
    +
    &#xe692;
    +
    • + +
  • + +
    文件
    +
    &#xe693;
    +
    • + +
  • + +
    下载
    +
    &#xe694;
    +
    • + +
  • + +
    向左
    +
    &#xe695;
    +
    • + +
  • + +
    信息
    +
    &#xe696;
    +
    • + +
  • + +
    向右
    +
    &#xe697;
    +
    • + +
  • + +
    向下
    +
    &#xe698;
    +
    • + +
  • + +
    新增
    +
    &#xe699;
    +
    • + +
  • + +
    专题
    +
    &#xe69a;
    +
    • + +
  • + +
    咨询
    +
    &#xe69b;
    +
    • + +
  • + +
    消息
    +
    &#xe69c;
    +
    • + +
  • + +
    数据
    +
    &#xe69d;
    +
    • + +
  • + +
    技术服务
    +
    &#xe69e;
    +
    • + +
  • + +
    架构
    +
    &#xe69f;
    +
    • + +
  • + +
    票据
    +
    &#xe6a0;
    +
    • + +
  • + +
    数据库
    +
    &#xe6a1;
    +
    • + +
  • + +
    API管理
    +
    &#xe6a2;
    +
    • + +
  • + +
    性能
    +
    &#xe6a3;
    +
    • + +
  • + +
    提醒
    +
    &#xe646;
    +
    • + +
  • + +
    位置
    +
    &#xe647;
    +
    • + +
  • + +
    通知
    +
    &#xe648;
    +
    • + +
  • + +
    文件
    +
    &#xe649;
    +
    • + +
  • + +
    向右
    +
    &#xe64a;
    +
    • + +
  • + +
    向上
    +
    &#xe64b;
    +
    • + +
  • + +
    向左
    +
    &#xe64c;
    +
    • + +
  • + +
    向下
    +
    &#xe64d;
    +
    • + +
  • + +
    信息
    +
    &#xe64e;
    +
    • + +
  • + +
    人
    +
    &#xe64f;
    +
    • + +
  • + +
    菜单
    +
    &#xe650;
    +
    • + +
  • + +
    票务
    +
    &#xe651;
    +
    • + +
  • + +
    客房
    +
    &#xe652;
    +
    • + +
  • + +
    数据平台
    +
    &#xe653;
    +
    • + +
  • + +
    项目
    +
    &#xe654;
    +
    • + +
  • + +
    询问
    +
    &#xe655;
    +
    • + +
  • + +
    首页
    +
    &#xe656;
    +
    • + +
  • + +
    技术服务
    +
    &#xe657;
    +
    • + +
  • + +
    数据源
    +
    &#xe658;
    +
    • + +
  • + +
    管理平台
    +
    &#xe659;
    +
    • + +
  • + +
    票据
    +
    &#xe65a;
    +
    • + +
  • + +
    架构
    +
    &#xe65b;
    +
    • + +
  • + +
    字段
    +
    &#xe65c;
    +
    • + +
  • + +
    表格
    +
    &#xe65d;
    +
    • + +
  • + +
    查询备份
    +
    &#xe65e;
    +
    • + +
  • + +
    查询
    +
    &#xe65f;
    +
    • + +
  • + +
    过程
    +
    &#xe660;
    +
    • + +
  • + +
    输出
    +
    &#xe661;
    +
    • + +
  • + +
    血缘
    +
    &#xe662;
    +
    • + +
  • + +
    输入
    +
    &#xe663;
    +
    • + +
  • + +
    路径
    +
    &#xe664;
    +
    • + +
  • + +
    数据源
    +
    &#xe665;
    +
    • + +
  • + +
    数据
    +
    &#xe666;
    +
    • + +
  • + +
    集团企业
    +
    &#xe667;
    +
    • + +
  • + +
    数据平台
    +
    &#xe668;
    +
    • + +
  • + +
    管理平台
    +
    &#xe669;
    +
    • + +
  • + +
    标签
    +
    &#xe634;
    +
    • + +
  • + +
    保存
    +
    &#xe635;
    +
    • + +
  • + +
    编辑
    +
    &#xe636;
    +
    • + +
  • + +
    撤销
    +
    &#xe637;
    +
    • + +
  • + +
    发布
    +
    &#xe638;
    +
    • + +
  • + +
    拍照
    +
    &#xe639;
    +
    • + +
  • + +
    放大
    +
    &#xe63a;
    +
    • + +
  • + +
    门店
    +
    &#xe63b;
    +
    • + +
  • + +
    电话
    +
    &#xe63c;
    +
    • + +
  • + +
    减少
    +
    &#xe63d;
    +
    • + +
  • + +
    日历
    +
    &#xe63e;
    +
    • + +
  • + +
    数据
    +
    &#xe63f;
    +
    • + +
  • + +
    收藏
    +
    &#xe640;
    +
    • + +
  • + +
    设置
    +
    &#xe641;
    +
    • + +
  • + +
    删除
    +
    &#xe642;
    +
    • + +
  • + +
    文件夹
    +
    &#xe643;
    +
    • + +
  • + +
    缩小
    +
    &#xe644;
    +
    • + +
  • + +
    图片
    +
    &#xe645;
    +
    • + +
+
+

Unicode 引用

+
+ +

Unicode 是字体在网页端最原始的应用方式，特点是：

+
    +
  • 支持按字体的方式去动态调整图标大小，颜色等等。
    • +
  • 默认情况下不支持多色，直接添加多色图标会自动去色。
    • +
+
+

注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）

+
+

Unicode 使用步骤如下：

+

第一步：拷贝项目下面生成的 @font-face

+
@font-face {
+  font-family: 'sxIconFont';
+  src: url('iconfont.woff2?t=1745318762007') format('woff2'),
+       url('iconfont.woff?t=1745318762007') format('woff'),
+       url('iconfont.ttf?t=1745318762007') format('truetype');
+}
+
+

第二步：定义使用 iconfont 的样式

+
.sxIconFont {
+  font-family: "sxIconFont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+

第三步：挑选相应图标并获取字体编码，应用于页面

+
+<span class="sxIconFont">&#x33;</span>
+
+
+

"sxIconFont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    + 菜单 +
    +
    .sxIconFont-caidan1 +
    +
    • + +
  • + +
    + 保存 +
    +
    .sxIconFont-baocun1 +
    +
    • + +
  • + +
    + 不可见 +
    +
    .sxIconFont-bukejian +
    +
    • + +
  • + +
    + 编辑 +
    +
    .sxIconFont-bianji1 +
    +
    • + +
  • + +
    + 定位 +
    +
    .sxIconFont-dingwei +
    +
    • + +
  • + +
    + 打印 +
    +
    .sxIconFont-dayin +
    +
    • + +
  • + +
    + 发布 +
    +
    .sxIconFont-fabu1 +
    +
    • + +
  • + +
    + 分享 +
    +
    .sxIconFont-fenxiang +
    +
    • + +
  • + +
    + 更多 +
    +
    .sxIconFont-gengduo +
    +
    • + +
  • + +
    + 加号 +
    +
    .sxIconFont-jiahao +
    +
    • + +
  • + +
    + 关闭 +
    +
    .sxIconFont-guanbi +
    +
    • + +
  • + +
    + 复制 +
    +
    .sxIconFont-fuzhi +
    +
    • + +
  • + +
    + 电话 +
    +
    .sxIconFont-dianhua1 +
    +
    • + +
  • + +
    + 撤销 +
    +
    .sxIconFont-chexiao1 +
    +
    • + +
  • + +
    + 减号 +
    +
    .sxIconFont-jianhao +
    +
    • + +
  • + +
    + 放大 +
    +
    .sxIconFont-fangda1 +
    +
    • + +
  • + +
    + 可见 +
    +
    .sxIconFont-kejian +
    +
    • + +
  • + +
    + 警告 +
    +
    .sxIconFont-jinggao +
    +
    • + +
  • + +
    + 减少 +
    +
    .sxIconFont-jianshao1 +
    +
    • + +
  • + +
    + 个人中心 +
    +
    .sxIconFont-gerenzhongxin +
    +
    • + +
  • + +
    + 拍照 +
    +
    .sxIconFont-paizhao1 +
    +
    • + +
  • + +
    + 评论 +
    +
    .sxIconFont-pinglun +
    +
    • + +
  • + +
    + 列表 +
    +
    .sxIconFont-liebiao +
    +
    • + +
  • + +
    + 门店 +
    +
    .sxIconFont-mendian1 +
    +
    • + +
  • + +
    + 日历 +
    +
    .sxIconFont-rili1 +
    +
    • + +
  • + +
    + 链接 +
    +
    .sxIconFont-lianjie +
    +
    • + +
  • + +
    + 删除 +
    +
    .sxIconFont-shanchu1 +
    +
    • + +
  • + +
    + 扫一扫 +
    +
    .sxIconFont-saoyisao +
    +
    • + +
  • + +
    + 上传 +
    +
    .sxIconFont-shangchuan +
    +
    • + +
  • + +
    + 刷新 +
    +
    .sxIconFont-shuaxin +
    +
    • + +
  • + +
    + 清除 +
    +
    .sxIconFont-qingchu +
    +
    • + +
  • + +
    + 收藏 +
    +
    .sxIconFont-shoucang1 +
    +
    • + +
  • + +
    + 缩小 +
    +
    .sxIconFont-suoxiao1 +
    +
    • + +
  • + +
    + 通知 +
    +
    .sxIconFont-tongzhi1 +
    +
    • + +
  • + +
    + 搜索 +
    +
    .sxIconFont-sousuo +
    +
    • + +
  • + +
    + 图片 +
    +
    .sxIconFont-tupian1 +
    +
    • + +
  • + +
    + 退出 +
    +
    .sxIconFont-tuichu +
    +
    • + +
  • + +
    + 文件夹 +
    +
    .sxIconFont-wenjianjia1 +
    +
    • + +
  • + +
    + 向上 +
    +
    .sxIconFont-xiangshang1 +
    +
    • + +
  • + +
    + 完成 +
    +
    .sxIconFont-wancheng +
    +
    • + +
  • + +
    + 筛选 +
    +
    .sxIconFont-shaixuan +
    +
    • + +
  • + +
    + 文件 +
    +
    .sxIconFont-wenjian1 +
    +
    • + +
  • + +
    + 下载 +
    +
    .sxIconFont-xiazai +
    +
    • + +
  • + +
    + 向左 +
    +
    .sxIconFont-xiangzuo1 +
    +
    • + +
  • + +
    + 信息 +
    +
    .sxIconFont-xinxi1 +
    +
    • + +
  • + +
    + 向右 +
    +
    .sxIconFont-xiangyou1 +
    +
    • + +
  • + +
    + 向下 +
    +
    .sxIconFont-xiangxia1 +
    +
    • + +
  • + +
    + 新增 +
    +
    .sxIconFont-xinzeng +
    +
    • + +
  • + +
    + 专题 +
    +
    .sxIconFont-zhuanti +
    +
    • + +
  • + +
    + 咨询 +
    +
    .sxIconFont-zixun +
    +
    • + +
  • + +
    + 消息 +
    +
    .sxIconFont-xiaoxi +
    +
    • + +
  • + +
    + 数据 +
    +
    .sxIconFont-shuju2 +
    +
    • + +
  • + +
    + 技术服务 +
    +
    .sxIconFont-jishufuwu1 +
    +
    • + +
  • + +
    + 架构 +
    +
    .sxIconFont-jiagou1 +
    +
    • + +
  • + +
    + 票据 +
    +
    .sxIconFont-piaoju1 +
    +
    • + +
  • + +
    + 数据库 +
    +
    .sxIconFont-shujuku +
    +
    • + +
  • + +
    + API管理 +
    +
    .sxIconFont-APIguanli +
    +
    • + +
  • + +
    + 性能 +
    +
    .sxIconFont-xingneng +
    +
    • + +
  • + +
    + 提醒 +
    +
    .sxIconFont-tixing +
    +
    • + +
  • + +
    + 位置 +
    +
    .sxIconFont-weizhi +
    +
    • + +
  • + +
    + 通知 +
    +
    .sxIconFont-tongzhi +
    +
    • + +
  • + +
    + 文件 +
    +
    .sxIconFont-wenjian +
    +
    • + +
  • + +
    + 向右 +
    +
    .sxIconFont-xiangyou +
    +
    • + +
  • + +
    + 向上 +
    +
    .sxIconFont-xiangshang +
    +
    • + +
  • + +
    + 向左 +
    +
    .sxIconFont-xiangzuo +
    +
    • + +
  • + +
    + 向下 +
    +
    .sxIconFont-xiangxia +
    +
    • + +
  • + +
    + 信息 +
    +
    .sxIconFont-xinxi +
    +
    • + +
  • + +
    + 人 +
    +
    .sxIconFont-ren +
    +
    • + +
  • + +
    + 菜单 +
    +
    .sxIconFont-caidan +
    +
    • + +
  • + +
    + 票务 +
    +
    .sxIconFont-piaowu +
    +
    • + +
  • + +
    + 客房 +
    +
    .sxIconFont-kefang +
    +
    • + +
  • + +
    + 数据平台 +
    +
    .sxIconFont-shujupingtai +
    +
    • + +
  • + +
    + 项目 +
    +
    .sxIconFont-xiangmu +
    +
    • + +
  • + +
    + 询问 +
    +
    .sxIconFont-xunwen +
    +
    • + +
  • + +
    + 首页 +
    +
    .sxIconFont-shouye +
    +
    • + +
  • + +
    + 技术服务 +
    +
    .sxIconFont-jishufuwu +
    +
    • + +
  • + +
    + 数据源 +
    +
    .sxIconFont-shujuyuan +
    +
    • + +
  • + +
    + 管理平台 +
    +
    .sxIconFont-guanlipingtai +
    +
    • + +
  • + +
    + 票据 +
    +
    .sxIconFont-piaoju +
    +
    • + +
  • + +
    + 架构 +
    +
    .sxIconFont-jiagou +
    +
    • + +
  • + +
    + 字段 +
    +
    .sxIconFont-ziduan +
    +
    • + +
  • + +
    + 表格 +
    +
    .sxIconFont-biaoge +
    +
    • + +
  • + +
    + 查询备份 +
    +
    .sxIconFont-chaxunbeifen +
    +
    • + +
  • + +
    + 查询 +
    +
    .sxIconFont-chaxun +
    +
    • + +
  • + +
    + 过程 +
    +
    .sxIconFont-guocheng +
    +
    • + +
  • + +
    + 输出 +
    +
    .sxIconFont-shuchu +
    +
    • + +
  • + +
    + 血缘 +
    +
    .sxIconFont-xieyuan +
    +
    • + +
  • + +
    + 输入 +
    +
    .sxIconFont-shuru +
    +
    • + +
  • + +
    + 路径 +
    +
    .sxIconFont-lujing +
    +
    • + +
  • + +
    + 数据源 +
    +
    .sxIconFont-shujuyuan1 +
    +
    • + +
  • + +
    + 数据 +
    +
    .sxIconFont-shuju1 +
    +
    • + +
  • + +
    + 集团企业 +
    +
    .sxIconFont-jituanqiye +
    +
    • + +
  • + +
    + 数据平台 +
    +
    .sxIconFont-shujupingtai1 +
    +
    • + +
  • + +
    + 管理平台 +
    +
    .sxIconFont-guanlipingtai1 +
    +
    • + +
  • + +
    + 标签 +
    +
    .sxIconFont-biaoqian +
    +
    • + +
  • + +
    + 保存 +
    +
    .sxIconFont-baocun +
    +
    • + +
  • + +
    + 编辑 +
    +
    .sxIconFont-bianji +
    +
    • + +
  • + +
    + 撤销 +
    +
    .sxIconFont-chexiao +
    +
    • + +
  • + +
    + 发布 +
    +
    .sxIconFont-fabu +
    +
    • + +
  • + +
    + 拍照 +
    +
    .sxIconFont-paizhao +
    +
    • + +
  • + +
    + 放大 +
    +
    .sxIconFont-fangda +
    +
    • + +
  • + +
    + 门店 +
    +
    .sxIconFont-mendian +
    +
    • + +
  • + +
    + 电话 +
    +
    .sxIconFont-dianhua +
    +
    • + +
  • + +
    + 减少 +
    +
    .sxIconFont-jianshao +
    +
    • + +
  • + +
    + 日历 +
    +
    .sxIconFont-rili +
    +
    • + +
  • + +
    + 数据 +
    +
    .sxIconFont-shuju +
    +
    • + +
  • + +
    + 收藏 +
    +
    .sxIconFont-shoucang +
    +
    • + +
  • + +
    + 设置 +
    +
    .sxIconFont-shezhi +
    +
    • + +
  • + +
    + 删除 +
    +
    .sxIconFont-shanchu +
    +
    • + +
  • + +
    + 文件夹 +
    +
    .sxIconFont-wenjianjia +
    +
    • + +
  • + +
    + 缩小 +
    +
    .sxIconFont-suoxiao +
    +
    • + +
  • + +
    + 图片 +
    +
    .sxIconFont-tupian +
    +
    • + +
+
+

font-class 引用

+
+ +

font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。

+

与 Unicode 使用方式相比，具有如下特点：

+
    +
  • 相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。
    • +
  • 因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。
    • +
+

使用步骤如下：

+

第一步：引入项目下面生成的 fontclass 代码：

+
<link rel="stylesheet" href="./iconfont.css">
+
+

第二步：挑选相应图标并获取类名，应用于页面：

+
<span class="sxIconFont sxIconFont-xxx"></span>
+
+
+

" + sxIconFont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    菜单
    +
    #sxIconFont-caidan1
    +
    • + +
  • + +
    保存
    +
    #sxIconFont-baocun1
    +
    • + +
  • + +
    不可见
    +
    #sxIconFont-bukejian
    +
    • + +
  • + +
    编辑
    +
    #sxIconFont-bianji1
    +
    • + +
  • + +
    定位
    +
    #sxIconFont-dingwei
    +
    • + +
  • + +
    打印
    +
    #sxIconFont-dayin
    +
    • + +
  • + +
    发布
    +
    #sxIconFont-fabu1
    +
    • + +
  • + +
    分享
    +
    #sxIconFont-fenxiang
    +
    • + +
  • + +
    更多
    +
    #sxIconFont-gengduo
    +
    • + +
  • + +
    加号
    +
    #sxIconFont-jiahao
    +
    • + +
  • + +
    关闭
    +
    #sxIconFont-guanbi
    +
    • + +
  • + +
    复制
    +
    #sxIconFont-fuzhi
    +
    • + +
  • + +
    电话
    +
    #sxIconFont-dianhua1
    +
    • + +
  • + +
    撤销
    +
    #sxIconFont-chexiao1
    +
    • + +
  • + +
    减号
    +
    #sxIconFont-jianhao
    +
    • + +
  • + +
    放大
    +
    #sxIconFont-fangda1
    +
    • + +
  • + +
    可见
    +
    #sxIconFont-kejian
    +
    • + +
  • + +
    警告
    +
    #sxIconFont-jinggao
    +
    • + +
  • + +
    减少
    +
    #sxIconFont-jianshao1
    +
    • + +
  • + +
    个人中心
    +
    #sxIconFont-gerenzhongxin
    +
    • + +
  • + +
    拍照
    +
    #sxIconFont-paizhao1
    +
    • + +
  • + +
    评论
    +
    #sxIconFont-pinglun
    +
    • + +
  • + +
    列表
    +
    #sxIconFont-liebiao
    +
    • + +
  • + +
    门店
    +
    #sxIconFont-mendian1
    +
    • + +
  • + +
    日历
    +
    #sxIconFont-rili1
    +
    • + +
  • + +
    链接
    +
    #sxIconFont-lianjie
    +
    • + +
  • + +
    删除
    +
    #sxIconFont-shanchu1
    +
    • + +
  • + +
    扫一扫
    +
    #sxIconFont-saoyisao
    +
    • + +
  • + +
    上传
    +
    #sxIconFont-shangchuan
    +
    • + +
  • + +
    刷新
    +
    #sxIconFont-shuaxin
    +
    • + +
  • + +
    清除
    +
    #sxIconFont-qingchu
    +
    • + +
  • + +
    收藏
    +
    #sxIconFont-shoucang1
    +
    • + +
  • + +
    缩小
    +
    #sxIconFont-suoxiao1
    +
    • + +
  • + +
    通知
    +
    #sxIconFont-tongzhi1
    +
    • + +
  • + +
    搜索
    +
    #sxIconFont-sousuo
    +
    • + +
  • + +
    图片
    +
    #sxIconFont-tupian1
    +
    • + +
  • + +
    退出
    +
    #sxIconFont-tuichu
    +
    • + +
  • + +
    文件夹
    +
    #sxIconFont-wenjianjia1
    +
    • + +
  • + +
    向上
    +
    #sxIconFont-xiangshang1
    +
    • + +
  • + +
    完成
    +
    #sxIconFont-wancheng
    +
    • + +
  • + +
    筛选
    +
    #sxIconFont-shaixuan
    +
    • + +
  • + +
    文件
    +
    #sxIconFont-wenjian1
    +
    • + +
  • + +
    下载
    +
    #sxIconFont-xiazai
    +
    • + +
  • + +
    向左
    +
    #sxIconFont-xiangzuo1
    +
    • + +
  • + +
    信息
    +
    #sxIconFont-xinxi1
    +
    • + +
  • + +
    向右
    +
    #sxIconFont-xiangyou1
    +
    • + +
  • + +
    向下
    +
    #sxIconFont-xiangxia1
    +
    • + +
  • + +
    新增
    +
    #sxIconFont-xinzeng
    +
    • + +
  • + +
    专题
    +
    #sxIconFont-zhuanti
    +
    • + +
  • + +
    咨询
    +
    #sxIconFont-zixun
    +
    • + +
  • + +
    消息
    +
    #sxIconFont-xiaoxi
    +
    • + +
  • + +
    数据
    +
    #sxIconFont-shuju2
    +
    • + +
  • + +
    技术服务
    +
    #sxIconFont-jishufuwu1
    +
    • + +
  • + +
    架构
    +
    #sxIconFont-jiagou1
    +
    • + +
  • + +
    票据
    +
    #sxIconFont-piaoju1
    +
    • + +
  • + +
    数据库
    +
    #sxIconFont-shujuku
    +
    • + +
  • + +
    API管理
    +
    #sxIconFont-APIguanli
    +
    • + +
  • + +
    性能
    +
    #sxIconFont-xingneng
    +
    • + +
  • + +
    提醒
    +
    #sxIconFont-tixing
    +
    • + +
  • + +
    位置
    +
    #sxIconFont-weizhi
    +
    • + +
  • + +
    通知
    +
    #sxIconFont-tongzhi
    +
    • + +
  • + +
    文件
    +
    #sxIconFont-wenjian
    +
    • + +
  • + +
    向右
    +
    #sxIconFont-xiangyou
    +
    • + +
  • + +
    向上
    +
    #sxIconFont-xiangshang
    +
    • + +
  • + +
    向左
    +
    #sxIconFont-xiangzuo
    +
    • + +
  • + +
    向下
    +
    #sxIconFont-xiangxia
    +
    • + +
  • + +
    信息
    +
    #sxIconFont-xinxi
    +
    • + +
  • + +
    人
    +
    #sxIconFont-ren
    +
    • + +
  • + +
    菜单
    +
    #sxIconFont-caidan
    +
    • + +
  • + +
    票务
    +
    #sxIconFont-piaowu
    +
    • + +
  • + +
    客房
    +
    #sxIconFont-kefang
    +
    • + +
  • + +
    数据平台
    +
    #sxIconFont-shujupingtai
    +
    • + +
  • + +
    项目
    +
    #sxIconFont-xiangmu
    +
    • + +
  • + +
    询问
    +
    #sxIconFont-xunwen
    +
    • + +
  • + +
    首页
    +
    #sxIconFont-shouye
    +
    • + +
  • + +
    技术服务
    +
    #sxIconFont-jishufuwu
    +
    • + +
  • + +
    数据源
    +
    #sxIconFont-shujuyuan
    +
    • + +
  • + +
    管理平台
    +
    #sxIconFont-guanlipingtai
    +
    • + +
  • + +
    票据
    +
    #sxIconFont-piaoju
    +
    • + +
  • + +
    架构
    +
    #sxIconFont-jiagou
    +
    • + +
  • + +
    字段
    +
    #sxIconFont-ziduan
    +
    • + +
  • + +
    表格
    +
    #sxIconFont-biaoge
    +
    • + +
  • + +
    查询备份
    +
    #sxIconFont-chaxunbeifen
    +
    • + +
  • + +
    查询
    +
    #sxIconFont-chaxun
    +
    • + +
  • + +
    过程
    +
    #sxIconFont-guocheng
    +
    • + +
  • + +
    输出
    +
    #sxIconFont-shuchu
    +
    • + +
  • + +
    血缘
    +
    #sxIconFont-xieyuan
    +
    • + +
  • + +
    输入
    +
    #sxIconFont-shuru
    +
    • + +
  • + +
    路径
    +
    #sxIconFont-lujing
    +
    • + +
  • + +
    数据源
    +
    #sxIconFont-shujuyuan1
    +
    • + +
  • + +
    数据
    +
    #sxIconFont-shuju1
    +
    • + +
  • + +
    集团企业
    +
    #sxIconFont-jituanqiye
    +
    • + +
  • + +
    数据平台
    +
    #sxIconFont-shujupingtai1
    +
    • + +
  • + +
    管理平台
    +
    #sxIconFont-guanlipingtai1
    +
    • + +
  • + +
    标签
    +
    #sxIconFont-biaoqian
    +
    • + +
  • + +
    保存
    +
    #sxIconFont-baocun
    +
    • + +
  • + +
    编辑
    +
    #sxIconFont-bianji
    +
    • + +
  • + +
    撤销
    +
    #sxIconFont-chexiao
    +
    • + +
  • + +
    发布
    +
    #sxIconFont-fabu
    +
    • + +
  • + +
    拍照
    +
    #sxIconFont-paizhao
    +
    • + +
  • + +
    放大
    +
    #sxIconFont-fangda
    +
    • + +
  • + +
    门店
    +
    #sxIconFont-mendian
    +
    • + +
  • + +
    电话
    +
    #sxIconFont-dianhua
    +
    • + +
  • + +
    减少
    +
    #sxIconFont-jianshao
    +
    • + +
  • + +
    日历
    +
    #sxIconFont-rili
    +
    • + +
  • + +
    数据
    +
    #sxIconFont-shuju
    +
    • + +
  • + +
    收藏
    +
    #sxIconFont-shoucang
    +
    • + +
  • + +
    设置
    +
    #sxIconFont-shezhi
    +
    • + +
  • + +
    删除
    +
    #sxIconFont-shanchu
    +
    • + +
  • + +
    文件夹
    +
    #sxIconFont-wenjianjia
    +
    • + +
  • + +
    缩小
    +
    #sxIconFont-suoxiao
    +
    • + +
  • + +
    图片
    +
    #sxIconFont-tupian
    +
    • + +
+
+

Symbol 引用

+
+ +

这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇文章 + 这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：

+
    +
  • 支持多色图标了，不再受单色限制。
    • +
  • 通过一些技巧，支持像字体那样，通过 font-size, color 来调整样式。
    • +
  • 兼容性较差，支持 IE9+，及现代浏览器。
    • +
  • 浏览器渲染 SVG 的性能一般，还不如 png。
    • +
+

使用步骤如下：

+

第一步：引入项目下面生成的 symbol 代码：

+
<script src="./iconfont.js"></script>
+
+

第二步：加入通用 CSS 代码（引入一次就行）：

+
<style>
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+</style>
+
+

第三步：挑选相应图标并获取类名，应用于页面：

+
<svg class="icon" aria-hidden="true">
+  <use xlink:href="#icon-xxx"></use>
+</svg>
+
+
+
+ +
+
+ + + diff --git a/assets/icon/sxIconFont/iconfont.css b/assets/icon/sxIconFont/iconfont.css new file mode 100644 index 0000000..011ea0a --- /dev/null +++ b/assets/icon/sxIconFont/iconfont.css @@ -0,0 +1,463 @@ +@font-face { + font-family: "sxIconFont"; /* Project id 4902171 */ + src: url('iconfont.woff2?t=1745318762007') format('woff2'), + url('iconfont.woff?t=1745318762007') format('woff'), + url('iconfont.ttf?t=1745318762007') format('truetype'); +} + +.sxIconFont { + font-family: "sxIconFont" !important; + font-size: 16px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.sxIconFont-caidan1:before { + content: "\e66a"; +} + +.sxIconFont-baocun1:before { + content: "\e66b"; +} + +.sxIconFont-bukejian:before { + content: "\e66c"; +} + +.sxIconFont-bianji1:before { + content: "\e66d"; +} + +.sxIconFont-dingwei:before { + content: "\e66e"; +} + +.sxIconFont-dayin:before { + content: "\e66f"; +} + +.sxIconFont-fabu1:before { + content: "\e670"; +} + +.sxIconFont-fenxiang:before { + content: "\e671"; +} + +.sxIconFont-gengduo:before { + content: "\e672"; +} + +.sxIconFont-jiahao:before { + content: "\e673"; +} + +.sxIconFont-guanbi:before { + content: "\e674"; +} + +.sxIconFont-fuzhi:before { + content: "\e675"; +} + +.sxIconFont-dianhua1:before { + content: "\e676"; +} + +.sxIconFont-chexiao1:before { + content: "\e677"; +} + +.sxIconFont-jianhao:before { + content: "\e678"; +} + +.sxIconFont-fangda1:before { + content: "\e679"; +} + +.sxIconFont-kejian:before { + content: "\e67a"; +} + +.sxIconFont-jinggao:before { + content: "\e67b"; +} + +.sxIconFont-jianshao1:before { + content: "\e67c"; +} + +.sxIconFont-gerenzhongxin:before { + content: "\e67d"; +} + +.sxIconFont-paizhao1:before { + content: "\e67e"; +} + +.sxIconFont-pinglun:before { + content: "\e67f"; +} + +.sxIconFont-liebiao:before { + content: "\e680"; +} + +.sxIconFont-mendian1:before { + content: "\e681"; +} + +.sxIconFont-rili1:before { + content: "\e682"; +} + +.sxIconFont-lianjie:before { + content: "\e683"; +} + +.sxIconFont-shanchu1:before { + content: "\e684"; +} + +.sxIconFont-saoyisao:before { + content: "\e685"; +} + +.sxIconFont-shangchuan:before { + content: "\e686"; +} + +.sxIconFont-shuaxin:before { + content: "\e687"; +} + +.sxIconFont-qingchu:before { + content: "\e688"; +} + +.sxIconFont-shoucang1:before { + content: "\e689"; +} + +.sxIconFont-suoxiao1:before { + content: "\e68a"; +} + +.sxIconFont-tongzhi1:before { + content: "\e68b"; +} + +.sxIconFont-sousuo:before { + content: "\e68c"; +} + +.sxIconFont-tupian1:before { + content: "\e68d"; +} + +.sxIconFont-tuichu:before { + content: "\e68e"; +} + +.sxIconFont-wenjianjia1:before { + content: "\e68f"; +} + +.sxIconFont-xiangshang1:before { + content: "\e690"; +} + +.sxIconFont-wancheng:before { + content: "\e691"; +} + +.sxIconFont-shaixuan:before { + content: "\e692"; +} + +.sxIconFont-wenjian1:before { + content: "\e693"; +} + +.sxIconFont-xiazai:before { + content: "\e694"; +} + +.sxIconFont-xiangzuo1:before { + content: "\e695"; +} + +.sxIconFont-xinxi1:before { + content: "\e696"; +} + +.sxIconFont-xiangyou1:before { + content: "\e697"; +} + +.sxIconFont-xiangxia1:before { + content: "\e698"; +} + +.sxIconFont-xinzeng:before { + content: "\e699"; +} + +.sxIconFont-zhuanti:before { + content: "\e69a"; +} + +.sxIconFont-zixun:before { + content: "\e69b"; +} + +.sxIconFont-xiaoxi:before { + content: "\e69c"; +} + +.sxIconFont-shuju2:before { + content: "\e69d"; +} + +.sxIconFont-jishufuwu1:before { + content: "\e69e"; +} + +.sxIconFont-jiagou1:before { + content: "\e69f"; +} + +.sxIconFont-piaoju1:before { + content: "\e6a0"; +} + +.sxIconFont-shujuku:before { + content: "\e6a1"; +} + +.sxIconFont-APIguanli:before { + content: "\e6a2"; +} + +.sxIconFont-xingneng:before { + content: "\e6a3"; +} + +.sxIconFont-tixing:before { + content: "\e646"; +} + +.sxIconFont-weizhi:before { + content: "\e647"; +} + +.sxIconFont-tongzhi:before { + content: "\e648"; +} + +.sxIconFont-wenjian:before { + content: "\e649"; +} + +.sxIconFont-xiangyou:before { + content: "\e64a"; +} + +.sxIconFont-xiangshang:before { + content: "\e64b"; +} + +.sxIconFont-xiangzuo:before { + content: "\e64c"; +} + +.sxIconFont-xiangxia:before { + content: "\e64d"; +} + +.sxIconFont-xinxi:before { + content: "\e64e"; +} + +.sxIconFont-ren:before { + content: "\e64f"; +} + +.sxIconFont-caidan:before { + content: "\e650"; +} + +.sxIconFont-piaowu:before { + content: "\e651"; +} + +.sxIconFont-kefang:before { + content: "\e652"; +} + +.sxIconFont-shujupingtai:before { + content: "\e653"; +} + +.sxIconFont-xiangmu:before { + content: "\e654"; +} + +.sxIconFont-xunwen:before { + content: "\e655"; +} + +.sxIconFont-shouye:before { + content: "\e656"; +} + +.sxIconFont-jishufuwu:before { + content: "\e657"; +} + +.sxIconFont-shujuyuan:before { + content: "\e658"; +} + +.sxIconFont-guanlipingtai:before { + content: "\e659"; +} + +.sxIconFont-piaoju:before { + content: "\e65a"; +} + +.sxIconFont-jiagou:before { + content: "\e65b"; +} + +.sxIconFont-ziduan:before { + content: "\e65c"; +} + +.sxIconFont-biaoge:before { + content: "\e65d"; +} + +.sxIconFont-chaxunbeifen:before { + content: "\e65e"; +} + +.sxIconFont-chaxun:before { + content: "\e65f"; +} + +.sxIconFont-guocheng:before { + content: "\e660"; +} + +.sxIconFont-shuchu:before { + content: "\e661"; +} + +.sxIconFont-xieyuan:before { + content: "\e662"; +} + +.sxIconFont-shuru:before { + content: "\e663"; +} + +.sxIconFont-lujing:before { + content: "\e664"; +} + +.sxIconFont-shujuyuan1:before { + content: "\e665"; +} + +.sxIconFont-shuju1:before { + content: "\e666"; +} + +.sxIconFont-jituanqiye:before { + content: "\e667"; +} + +.sxIconFont-shujupingtai1:before { + content: "\e668"; +} + +.sxIconFont-guanlipingtai1:before { + content: "\e669"; +} + +.sxIconFont-biaoqian:before { + content: "\e634"; +} + +.sxIconFont-baocun:before { + content: "\e635"; +} + +.sxIconFont-bianji:before { + content: "\e636"; +} + +.sxIconFont-chexiao:before { + content: "\e637"; +} + +.sxIconFont-fabu:before { + content: "\e638"; +} + +.sxIconFont-paizhao:before { + content: "\e639"; +} + +.sxIconFont-fangda:before { + content: "\e63a"; +} + +.sxIconFont-mendian:before { + content: "\e63b"; +} + +.sxIconFont-dianhua:before { + content: "\e63c"; +} + +.sxIconFont-jianshao:before { + content: "\e63d"; +} + +.sxIconFont-rili:before { + content: "\e63e"; +} + +.sxIconFont-shuju:before { + content: "\e63f"; +} + +.sxIconFont-shoucang:before { + content: "\e640"; +} + +.sxIconFont-shezhi:before { + content: "\e641"; +} + +.sxIconFont-shanchu:before { + content: "\e642"; +} + +.sxIconFont-wenjianjia:before { + content: "\e643"; +} + +.sxIconFont-suoxiao:before { + content: "\e644"; +} + +.sxIconFont-tupian:before { + content: "\e645"; +} + diff --git a/assets/icon/sxIconFont/iconfont.js b/assets/icon/sxIconFont/iconfont.js new file mode 100644 index 0000000..7b5cf86 --- /dev/null +++ b/assets/icon/sxIconFont/iconfont.js @@ -0,0 +1 @@ +window._iconfont_svg_string_4902171='',(o=>{var a=(l=(l=document.getElementsByTagName("script"))[l.length-1]).getAttribute("data-injectcss"),l=l.getAttribute("data-disable-injectsvg");if(!l){var h,c,i,t,v,s=function(a,l){l.parentNode.insertBefore(a,l)};if(a&&!o.__iconfont__svg__cssinject__){o.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(a){console&&console.log(a)}}h=function(){var a,l=document.createElement("div");l.innerHTML=o._iconfont_svg_string_4902171,(l=l.getElementsByTagName("svg")[0])&&(l.setAttribute("aria-hidden","true"),l.style.position="absolute",l.style.width=0,l.style.height=0,l.style.overflow="hidden",l=l,(a=document.body).firstChild?s(l,a.firstChild):a.appendChild(l))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(h,0):(c=function(){document.removeEventListener("DOMContentLoaded",c,!1),h()},document.addEventListener("DOMContentLoaded",c,!1)):document.attachEvent&&(i=h,t=o.document,v=!1,m(),t.onreadystatechange=function(){"complete"==t.readyState&&(t.onreadystatechange=null,n())})}function n(){v||(v=!0,i())}function m(){try{t.documentElement.doScroll("left")}catch(a){return void setTimeout(m,50)}n()}})(window); \ No newline at end of file diff --git a/assets/icon/sxIconFont/iconfont.json b/assets/icon/sxIconFont/iconfont.json new file mode 100644 index 0000000..819e4a6 --- /dev/null +++ b/assets/icon/sxIconFont/iconfont.json @@ -0,0 +1,793 @@ +{ + "id": "4902171", + "name": "star-sx", + "font_family": "sxIconFont", + "css_prefix_text": "sxIconFont-", + "description": "", + "glyphs": [ + { + "icon_id": "18863151", + "name": "菜单", + "font_class": "caidan1", + "unicode": "e66a", + "unicode_decimal": 58986 + }, + { + "icon_id": "18863152", + "name": "保存", + "font_class": "baocun1", + "unicode": "e66b", + "unicode_decimal": 58987 + }, + { + "icon_id": "18863153", + "name": "不可见", + "font_class": "bukejian", + "unicode": "e66c", + "unicode_decimal": 58988 + }, + { + "icon_id": "18863154", + "name": "编辑", + "font_class": "bianji1", + "unicode": "e66d", + "unicode_decimal": 58989 + }, + { + "icon_id": "18863156", + "name": "定位", + "font_class": "dingwei", + "unicode": "e66e", + "unicode_decimal": 58990 + }, + { + "icon_id": "18863157", + "name": "打印", + "font_class": "dayin", + "unicode": "e66f", + "unicode_decimal": 58991 + }, + { + "icon_id": "18863158", + "name": "发布", + "font_class": "fabu1", + "unicode": "e670", + "unicode_decimal": 58992 + }, + { + "icon_id": "18863159", + "name": "分享", + "font_class": "fenxiang", + "unicode": "e671", + "unicode_decimal": 58993 + }, + { + "icon_id": "18863160", + "name": "更多", + "font_class": "gengduo", + "unicode": "e672", + "unicode_decimal": 58994 + }, + { + "icon_id": "18863161", + "name": "加号", + "font_class": "jiahao", + "unicode": "e673", + "unicode_decimal": 58995 + }, + { + "icon_id": "18863162", + "name": "关闭", + "font_class": "guanbi", + "unicode": "e674", + "unicode_decimal": 58996 + }, + { + "icon_id": "18863163", + "name": "复制", + "font_class": "fuzhi", + "unicode": "e675", + "unicode_decimal": 58997 + }, + { + "icon_id": "18863164", + "name": "电话", + "font_class": "dianhua1", + "unicode": "e676", + "unicode_decimal": 58998 + }, + { + "icon_id": "18863165", + "name": "撤销", + "font_class": "chexiao1", + "unicode": "e677", + "unicode_decimal": 58999 + }, + { + "icon_id": "18863166", + "name": "减号", + "font_class": "jianhao", + "unicode": "e678", + "unicode_decimal": 59000 + }, + { + "icon_id": "18863167", + "name": "放大", + "font_class": "fangda1", + "unicode": "e679", + "unicode_decimal": 59001 + }, + { + "icon_id": "18863168", + "name": "可见", + "font_class": "kejian", + "unicode": "e67a", + "unicode_decimal": 59002 + }, + { + "icon_id": "18863169", + "name": "警告", + "font_class": "jinggao", + "unicode": "e67b", + "unicode_decimal": 59003 + }, + { + "icon_id": "18863170", + "name": "减少", + "font_class": "jianshao1", + "unicode": "e67c", + "unicode_decimal": 59004 + }, + { + "icon_id": "18863171", + "name": "个人中心", + "font_class": "gerenzhongxin", + "unicode": "e67d", + "unicode_decimal": 59005 + }, + { + "icon_id": "18863172", + "name": "拍照", + "font_class": "paizhao1", + "unicode": "e67e", + "unicode_decimal": 59006 + }, + { + "icon_id": "18863173", + "name": "评论", + "font_class": "pinglun", + "unicode": "e67f", + "unicode_decimal": 59007 + }, + { + "icon_id": "18863174", + "name": "列表", + "font_class": "liebiao", + "unicode": "e680", + "unicode_decimal": 59008 + }, + { + "icon_id": "18863175", + "name": "门店", + "font_class": "mendian1", + "unicode": "e681", + "unicode_decimal": 59009 + }, + { + "icon_id": "18863176", + "name": "日历", + "font_class": "rili1", + "unicode": "e682", + "unicode_decimal": 59010 + }, + { + "icon_id": "18863177", + "name": "链接", + "font_class": "lianjie", + "unicode": "e683", + "unicode_decimal": 59011 + }, + { + "icon_id": "18863178", + "name": "删除", + "font_class": "shanchu1", + "unicode": "e684", + "unicode_decimal": 59012 + }, + { + "icon_id": "18863179", + "name": "扫一扫", + "font_class": "saoyisao", + "unicode": "e685", + "unicode_decimal": 59013 + }, + { + "icon_id": "18863180", + "name": "上传", + "font_class": "shangchuan", + "unicode": "e686", + "unicode_decimal": 59014 + }, + { + "icon_id": "18863181", + "name": "刷新", + "font_class": "shuaxin", + "unicode": "e687", + "unicode_decimal": 59015 + }, + { + "icon_id": "18863182", + "name": "清除", + "font_class": "qingchu", + "unicode": "e688", + "unicode_decimal": 59016 + }, + { + "icon_id": "18863183", + "name": "收藏", + "font_class": "shoucang1", + "unicode": "e689", + "unicode_decimal": 59017 + }, + { + "icon_id": "18863184", + "name": "缩小", + "font_class": "suoxiao1", + "unicode": "e68a", + "unicode_decimal": 59018 + }, + { + "icon_id": "18863185", + "name": "通知", + "font_class": "tongzhi1", + "unicode": "e68b", + "unicode_decimal": 59019 + }, + { + "icon_id": "18863186", + "name": "搜索", + "font_class": "sousuo", + "unicode": "e68c", + "unicode_decimal": 59020 + }, + { + "icon_id": "18863187", + "name": "图片", + "font_class": "tupian1", + "unicode": "e68d", + "unicode_decimal": 59021 + }, + { + "icon_id": "18863188", + "name": "退出", + "font_class": "tuichu", + "unicode": "e68e", + "unicode_decimal": 59022 + }, + { + "icon_id": "18863189", + "name": "文件夹", + "font_class": "wenjianjia1", + "unicode": "e68f", + "unicode_decimal": 59023 + }, + { + "icon_id": "18863190", + "name": "向上", + "font_class": "xiangshang1", + "unicode": "e690", + "unicode_decimal": 59024 + }, + { + "icon_id": "18863191", + "name": "完成", + "font_class": "wancheng", + "unicode": "e691", + "unicode_decimal": 59025 + }, + { + "icon_id": "18863192", + "name": "筛选", + "font_class": "shaixuan", + "unicode": "e692", + "unicode_decimal": 59026 + }, + { + "icon_id": "18863193", + "name": "文件", + "font_class": "wenjian1", + "unicode": "e693", + "unicode_decimal": 59027 + }, + { + "icon_id": "18863194", + "name": "下载", + "font_class": "xiazai", + "unicode": "e694", + "unicode_decimal": 59028 + }, + { + "icon_id": "18863195", + "name": "向左", + "font_class": "xiangzuo1", + "unicode": "e695", + "unicode_decimal": 59029 + }, + { + "icon_id": "18863196", + "name": "信息", + "font_class": "xinxi1", + "unicode": "e696", + "unicode_decimal": 59030 + }, + { + "icon_id": "18863197", + "name": "向右", + "font_class": "xiangyou1", + "unicode": "e697", + "unicode_decimal": 59031 + }, + { + "icon_id": "18863198", + "name": "向下", + "font_class": "xiangxia1", + "unicode": "e698", + "unicode_decimal": 59032 + }, + { + "icon_id": "18863199", + "name": "新增", + "font_class": "xinzeng", + "unicode": "e699", + "unicode_decimal": 59033 + }, + { + "icon_id": "18863200", + "name": "专题", + "font_class": "zhuanti", + "unicode": "e69a", + "unicode_decimal": 59034 + }, + { + "icon_id": "18863201", + "name": "咨询", + "font_class": "zixun", + "unicode": "e69b", + "unicode_decimal": 59035 + }, + { + "icon_id": "18863202", + "name": "消息", + "font_class": "xiaoxi", + "unicode": "e69c", + "unicode_decimal": 59036 + }, + { + "icon_id": "18863203", + "name": "数据", + "font_class": "shuju2", + "unicode": "e69d", + "unicode_decimal": 59037 + }, + { + "icon_id": "18890518", + "name": "技术服务", + "font_class": "jishufuwu1", + "unicode": "e69e", + "unicode_decimal": 59038 + }, + { + "icon_id": "18890519", + "name": "架构", + "font_class": "jiagou1", + "unicode": "e69f", + "unicode_decimal": 59039 + }, + { + "icon_id": "18890522", + "name": "票据", + "font_class": "piaoju1", + "unicode": "e6a0", + "unicode_decimal": 59040 + }, + { + "icon_id": "18890523", + "name": "数据库", + "font_class": "shujuku", + "unicode": "e6a1", + "unicode_decimal": 59041 + }, + { + "icon_id": "19651515", + "name": "API管理", + "font_class": "APIguanli", + "unicode": "e6a2", + "unicode_decimal": 59042 + }, + { + "icon_id": "19651516", + "name": "性能", + "font_class": "xingneng", + "unicode": "e6a3", + "unicode_decimal": 59043 + }, + { + "icon_id": "17124319", + "name": "提醒", + "font_class": "tixing", + "unicode": "e646", + "unicode_decimal": 58950 + }, + { + "icon_id": "17124320", + "name": "位置", + "font_class": "weizhi", + "unicode": "e647", + "unicode_decimal": 58951 + }, + { + "icon_id": "17124321", + "name": "通知", + "font_class": "tongzhi", + "unicode": "e648", + "unicode_decimal": 58952 + }, + { + "icon_id": "17124322", + "name": "文件", + "font_class": "wenjian", + "unicode": "e649", + "unicode_decimal": 58953 + }, + { + "icon_id": "17124323", + "name": "向右", + "font_class": "xiangyou", + "unicode": "e64a", + "unicode_decimal": 58954 + }, + { + "icon_id": "17124324", + "name": "向上", + "font_class": "xiangshang", + "unicode": "e64b", + "unicode_decimal": 58955 + }, + { + "icon_id": "17124325", + "name": "向左", + "font_class": "xiangzuo", + "unicode": "e64c", + "unicode_decimal": 58956 + }, + { + "icon_id": "17124326", + "name": "向下", + "font_class": "xiangxia", + "unicode": "e64d", + "unicode_decimal": 58957 + }, + { + "icon_id": "17124327", + "name": "信息", + "font_class": "xinxi", + "unicode": "e64e", + "unicode_decimal": 58958 + }, + { + "icon_id": "18863066", + "name": "人", + "font_class": "ren", + "unicode": "e64f", + "unicode_decimal": 58959 + }, + { + "icon_id": "18863067", + "name": "菜单", + "font_class": "caidan", + "unicode": "e650", + "unicode_decimal": 58960 + }, + { + "icon_id": "18863068", + "name": "票务", + "font_class": "piaowu", + "unicode": "e651", + "unicode_decimal": 58961 + }, + { + "icon_id": "18863069", + "name": "客房", + "font_class": "kefang", + "unicode": "e652", + "unicode_decimal": 58962 + }, + { + "icon_id": "18863072", + "name": "数据平台", + "font_class": "shujupingtai", + "unicode": "e653", + "unicode_decimal": 58963 + }, + { + "icon_id": "18863074", + "name": "项目", + "font_class": "xiangmu", + "unicode": "e654", + "unicode_decimal": 58964 + }, + { + "icon_id": "18863075", + "name": "询问", + "font_class": "xunwen", + "unicode": "e655", + "unicode_decimal": 58965 + }, + { + "icon_id": "18863076", + "name": "首页", + "font_class": "shouye", + "unicode": "e656", + "unicode_decimal": 58966 + }, + { + "icon_id": "18890504", + "name": "技术服务", + "font_class": "jishufuwu", + "unicode": "e657", + "unicode_decimal": 58967 + }, + { + "icon_id": "18890505", + "name": "数据源", + "font_class": "shujuyuan", + "unicode": "e658", + "unicode_decimal": 58968 + }, + { + "icon_id": "18890506", + "name": "管理平台", + "font_class": "guanlipingtai", + "unicode": "e659", + "unicode_decimal": 58969 + }, + { + "icon_id": "18890507", + "name": "票据", + "font_class": "piaoju", + "unicode": "e65a", + "unicode_decimal": 58970 + }, + { + "icon_id": "18890508", + "name": "架构", + "font_class": "jiagou", + "unicode": "e65b", + "unicode_decimal": 58971 + }, + { + "icon_id": "19592907", + "name": "字段", + "font_class": "ziduan", + "unicode": "e65c", + "unicode_decimal": 58972 + }, + { + "icon_id": "19648531", + "name": "表格", + "font_class": "biaoge", + "unicode": "e65d", + "unicode_decimal": 58973 + }, + { + "icon_id": "19648532", + "name": "查询备份", + "font_class": "chaxunbeifen", + "unicode": "e65e", + "unicode_decimal": 58974 + }, + { + "icon_id": "19648533", + "name": "查询", + "font_class": "chaxun", + "unicode": "e65f", + "unicode_decimal": 58975 + }, + { + "icon_id": "19648534", + "name": "过程", + "font_class": "guocheng", + "unicode": "e660", + "unicode_decimal": 58976 + }, + { + "icon_id": "19648535", + "name": "输出", + "font_class": "shuchu", + "unicode": "e661", + "unicode_decimal": 58977 + }, + { + "icon_id": "19648536", + "name": "血缘", + "font_class": "xieyuan", + "unicode": "e662", + "unicode_decimal": 58978 + }, + { + "icon_id": "19648537", + "name": "输入", + "font_class": "shuru", + "unicode": "e663", + "unicode_decimal": 58979 + }, + { + "icon_id": "19648538", + "name": "路径", + "font_class": "lujing", + "unicode": "e664", + "unicode_decimal": 58980 + }, + { + "icon_id": "19651506", + "name": "数据源", + "font_class": "shujuyuan1", + "unicode": "e665", + "unicode_decimal": 58981 + }, + { + "icon_id": "19651507", + "name": "数据", + "font_class": "shuju1", + "unicode": "e666", + "unicode_decimal": 58982 + }, + { + "icon_id": "19651508", + "name": "集团企业", + "font_class": "jituanqiye", + "unicode": "e667", + "unicode_decimal": 58983 + }, + { + "icon_id": "19651509", + "name": "数据平台", + "font_class": "shujupingtai1", + "unicode": "e668", + "unicode_decimal": 58984 + }, + { + "icon_id": "19651510", + "name": "管理平台", + "font_class": "guanlipingtai1", + "unicode": "e669", + "unicode_decimal": 58985 + }, + { + "icon_id": "17124299", + "name": "标签", + "font_class": "biaoqian", + "unicode": "e634", + "unicode_decimal": 58932 + }, + { + "icon_id": "17124300", + "name": "保存", + "font_class": "baocun", + "unicode": "e635", + "unicode_decimal": 58933 + }, + { + "icon_id": "17124301", + "name": "编辑", + "font_class": "bianji", + "unicode": "e636", + "unicode_decimal": 58934 + }, + { + "icon_id": "17124302", + "name": "撤销", + "font_class": "chexiao", + "unicode": "e637", + "unicode_decimal": 58935 + }, + { + "icon_id": "17124303", + "name": "发布", + "font_class": "fabu", + "unicode": "e638", + "unicode_decimal": 58936 + }, + { + "icon_id": "17124304", + "name": "拍照", + "font_class": "paizhao", + "unicode": "e639", + "unicode_decimal": 58937 + }, + { + "icon_id": "17124305", + "name": "放大", + "font_class": "fangda", + "unicode": "e63a", + "unicode_decimal": 58938 + }, + { + "icon_id": "17124308", + "name": "门店", + "font_class": "mendian", + "unicode": "e63b", + "unicode_decimal": 58939 + }, + { + "icon_id": "17124309", + "name": "电话", + "font_class": "dianhua", + "unicode": "e63c", + "unicode_decimal": 58940 + }, + { + "icon_id": "17124310", + "name": "减少", + "font_class": "jianshao", + "unicode": "e63d", + "unicode_decimal": 58941 + }, + { + "icon_id": "17124311", + "name": "日历", + "font_class": "rili", + "unicode": "e63e", + "unicode_decimal": 58942 + }, + { + "icon_id": "17124312", + "name": "数据", + "font_class": "shuju", + "unicode": "e63f", + "unicode_decimal": 58943 + }, + { + "icon_id": "17124313", + "name": "收藏", + "font_class": "shoucang", + "unicode": "e640", + "unicode_decimal": 58944 + }, + { + "icon_id": "17124314", + "name": "设置", + "font_class": "shezhi", + "unicode": "e641", + "unicode_decimal": 58945 + }, + { + "icon_id": "17124315", + "name": "删除", + "font_class": "shanchu", + "unicode": "e642", + "unicode_decimal": 58946 + }, + { + "icon_id": "17124316", + "name": "文件夹", + "font_class": "wenjianjia", + "unicode": "e643", + "unicode_decimal": 58947 + }, + { + "icon_id": "17124317", + "name": "缩小", + "font_class": "suoxiao", + "unicode": "e644", + "unicode_decimal": 58948 + }, + { + "icon_id": "17124318", + "name": "图片", + "font_class": "tupian", + "unicode": "e645", + "unicode_decimal": 58949 + } + ] +} diff --git a/assets/icon/sxIconFont/iconfont.ttf b/assets/icon/sxIconFont/iconfont.ttf new file mode 100644 index 0000000..44fd04d Binary files /dev/null and b/assets/icon/sxIconFont/iconfont.ttf differ diff --git a/assets/icon/sxIconFont/iconfont.woff b/assets/icon/sxIconFont/iconfont.woff new file mode 100644 index 0000000..14d0538 Binary files /dev/null and b/assets/icon/sxIconFont/iconfont.woff differ diff --git a/assets/icon/sxIconFont/iconfont.woff2 b/assets/icon/sxIconFont/iconfont.woff2 new file mode 100644 index 0000000..feed0e6 Binary files /dev/null and b/assets/icon/sxIconFont/iconfont.woff2 differ diff --git a/components/Home/Header.vue b/components/Home/Header.vue new file mode 100644 index 0000000..d2dfa6f --- /dev/null +++ b/components/Home/Header.vue @@ -0,0 +1,107 @@ + + + + + diff --git a/components/Home/MobileMenu.vue b/components/Home/MobileMenu.vue new file mode 100644 index 0000000..ef0f3df --- /dev/null +++ b/components/Home/MobileMenu.vue @@ -0,0 +1,40 @@ + + + + + diff --git a/components/Logo.vue b/components/Logo.vue new file mode 100644 index 0000000..4624bdb --- /dev/null +++ b/components/Logo.vue @@ -0,0 +1,94 @@ + + + + + diff --git a/docs/03-关于Nuxt的一些API.md b/docs/03-关于Nuxt的一些API.md new file mode 100644 index 0000000..f765bb6 --- /dev/null +++ b/docs/03-关于Nuxt的一些API.md @@ -0,0 +1,58 @@ +# 关于Nuxt的一些API + +## Components 组件 + + +## Composables 复合函数 + + +## Utils 工具 + +### `definePageMeta(meta: PageMeta): void` + + +> 定义页面属性 + +```typescript +interface PageMeta { +validate?: (route: RouteLocationNormalized) => boolean | Promise | Partial | Promise> +redirect?: RouteRecordRedirectOption +name?: string +path?: string +props?: RouteRecordRaw['props'] +alias?: string | string[] +pageTransition?: boolean | TransitionProps +layoutTransition?: boolean | TransitionProps +viewTransition?: boolean | 'always' +key?: false | string | ((route: RouteLocationNormalizedLoaded) => string) +keepalive?: boolean | KeepAliveProps +layout?: false | LayoutKey | Ref | ComputedRef +middleware?: MiddlewareKey | NavigationGuard | Array +scrollToTop?: boolean | ((to: RouteLocationNormalizedLoaded, from: RouteLocationNormalizedLoaded) => boolean) +[key: string]: unknown +} +``` + +- layoutTransition + +> 设置要应用于当前布局的过渡的名称。您还可以将此值设置为 false 以禁用布局过渡。 +> +> Type: boolean | TransitionProps + +- pageTransition + +> 设置要应用于当前页面的过渡的名称。您还可以将此值设置为 false 以禁用布局过渡。 +> +> Type: boolean | TransitionProps + + +### `onBeforeRouteLeave(leaveGuard): void` + +eg: '/pages/index.vue' + +> 当前路由离开前的拦截 +> +> leaveGuard: Navigation Guard. 导航护卫。 +> +> (to, from, next) + diff --git a/docs/04-关于Nuxt.config的内容 b/docs/04-关于Nuxt.config的内容 new file mode 100644 index 0000000..58a4992 --- /dev/null +++ b/docs/04-关于Nuxt.config的内容 @@ -0,0 +1 @@ +1. 全局过渡效果，需要在nuxt.config.ts中设置 diff --git a/docs/05-关于字体提纯.md b/docs/05-关于字体提纯.md new file mode 100644 index 0000000..4e74045 --- /dev/null +++ b/docs/05-关于字体提纯.md @@ -0,0 +1,14 @@ + +- 安装 + +```bash +npm install fontmin -g +``` + +- 创建一个文本文件（如 text.txt），包含项目中实际使用的字符。 + +- 运行 + +```bash +fontmin path/to/source-font.ttf --text-file=path/to/text.txt --output-file=path/to/output-font.ttf +``` diff --git a/layouts/home.vue b/layouts/home.vue index 17c49be..ad7d80b 100644 --- a/layouts/home.vue +++ b/layouts/home.vue @@ -1,11 +1,35 @@ \ No newline at end of file + .homeHeader{ + flex-shrink: 0; + } + .homeMain{ + flex: 10; + width: 100%; + overflow: hidden; + & > .homeMainContent{ + position: relative; + overflow-y: auto; + } + } +} + diff --git a/layouts/start.vue b/layouts/start.vue index 3329b26..45c67d1 100644 --- a/layouts/start.vue +++ b/layouts/start.vue @@ -1,11 +1,12 @@ \ No newline at end of file + diff --git a/nuxt.config.ts b/nuxt.config.ts index c3e63cd..3e8cba6 100644 --- a/nuxt.config.ts +++ b/nuxt.config.ts @@ -12,6 +12,43 @@ export default defineNuxtConfig({ devServer: { host: '0.0.0.0', }, + css: [ + '~/assets/css/style.css', + '~/assets/css/font.css', + '~/assets/css/value.css', + '~/assets/css/iconfont.css', + '~/assets/css/transitions.css', + ], + app:{ + head:{ + link: [ + { + // LXGW WenKai 落霞孤鹜 + rel: "stylesheet", + href: 'https://chinese-fonts-cdn.deno.dev/packages/lxgwwenkai/dist/LXGWWenKai-Regular/result.css' + }, + { + // Huiwen-mincho 汇文明朝体 + rel: "stylesheet", + href: 'https://chinese-fonts-cdn.deno.dev/packages/hwmct/dist/%E6%B1%87%E6%96%87%E6%98%8E%E6%9C%9D%E4%BD%93/result.css' + // article { + // font-family:'Huiwen-mincho'; + // font-weight:'400' + // }; + }, + ] + }, + layoutTransition:{ + name: 'fade', + mode: 'out-in', + type: 'transition', // 明确指定动画类型 + duration: { + enter: 200, + leave: 500 + }, + appear: true + } + }, hooks: { 'listen': (server) => { startBroswer(server.address()) @@ -59,4 +96,4 @@ async function startBroswer(address: AddressInfo | string | null) { process.env.START = String(true) } } -} \ No newline at end of file +} diff --git a/pages/home/index.vue b/pages/home/index.vue index 0d3cf01..2500db1 100644 --- a/pages/home/index.vue +++ b/pages/home/index.vue @@ -5,9 +5,10 @@ definePageMeta({ \ No newline at end of file +.homeIndex{ +} + diff --git a/pages/index.vue b/pages/index.vue index 032707f..67b173a 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -1,189 +1,246 @@