From 263e83e52b21638cf621262084e1e36a543172f5 Mon Sep 17 00:00:00 2001 From: ztelliot <1141480995@qq.com> Date: Wed, 2 Jun 2021 22:26:08 +0800 Subject: [PATCH] add new icons --- src/assets/MirrorDetail.json | 127 ++++++++++++++-------- src/assets/icon/demo_index.html | 183 +++++++++++++++++++++++++------- src/assets/icon/iconfont.css | 39 ++++--- src/assets/icon/iconfont.js | 2 +- src/assets/icon/iconfont.json | 44 ++++++-- src/assets/icon/iconfont.svg | 2 +- src/assets/icon/iconfont.ttf | Bin 14124 -> 17168 bytes src/assets/icon/iconfont.woff | Bin 9628 -> 11776 bytes src/assets/icon/iconfont.woff2 | Bin 8168 -> 10248 bytes 9 files changed, 290 insertions(+), 107 deletions(-) diff --git a/src/assets/MirrorDetail.json b/src/assets/MirrorDetail.json index 12f2630..eb3f5e7 100644 --- a/src/assets/MirrorDetail.json +++ b/src/assets/MirrorDetail.json @@ -1,14 +1,23 @@ { "MirrorDetail": { + "alpine": { + "icon": "icon-alpine" + }, "anaconda": { "icon": "icon-anaconda", "fill": "#3faf4b" }, + "aosp-monthly": { + "icon": "icon-aosp" + }, "archlinux": { "icon": "icon-archlinux", "help": "archlinux-mirror-howto", "fill": "#1793d1" }, + "archlinuxarm": { + "icon": "icon-archlinux" + }, "archlinuxcn": { "icon": "icon-archlinux", "help": "archlinuxcn-mirror-howto", @@ -19,31 +28,50 @@ "help": "centos-mirror-howto", "fill": "#95267c" }, + "centos-altarch": { + "icon": "icon-centos" + }, + "ceph": { + "icon": "icon-ceph" + }, "debian": { "icon": "icon-debian", "help": "debian-mirror-howto", "fill": "#d70751" }, - "debian-security": { + "debian-cd": { "icon": "icon-debian", - "help": "debian-mirror-howto", + "help": "debian-mirror-howto?id=debian-本体", "fill": "#d70751" }, - "debian-cd": { + "debian-nonfree": { + "icon": "icon-debian" + }, + "debian-security": { "icon": "icon-debian", - "help": "debian-mirror-howto?id=debian-本体", + "help": "debian-mirror-howto", "fill": "#d70751" }, - "deepin-cd": { + "deepin": { "icon": "icon-deepin", "help": "deepin-mirror-howto", "fill": "#31bff7" }, - "deepin": { + "deepin-cd": { "icon": "icon-deepin", "help": "deepin-mirror-howto", "fill": "#31bff7" }, + "docker-ce":{ + "icon": "icon-docker" + }, + "dockerhub": { + "icon": "icon-docker", + "help": "dockerhub-mirror-howto" + }, + "eclipse": { + "icon": "icon-eclipse" + }, "epel": { "icon": "icon-epel", "help": "epel-mirror-howto", @@ -52,6 +80,19 @@ "elrepo": { "help": "elrepo-mirror-howto" }, + "fedora": { + "icon": "icon-fedora" + }, + "fedora-altarch": { + "icon": "icon-fedora" + }, + "homebrew":{ + "icon": "icon-homebrew", + "help": "homebrew-mirror-howto" + }, + "homebrew-bottles": { + "icon": "icon-homebrew" + }, "kali": { "icon": "icon-kali", "help": "kali-mirror-howto", @@ -66,67 +107,59 @@ "icon": "icon-ziyuan", "fill": "#313131" }, - "ubuntu": { - "icon": "icon-ubuntu", - "help": "ubuntu-mirror-howto", - "fill": "#d64613" + "manjaro": { + "icon": "icon-manjaro" }, - "ubuntu-releases": { - "icon": "icon-ubuntu", - "help": "ubuntu-mirror-howto", - "fill": "#d64613" + "manjaro-arm": { + "icon": "icon-manjaro" }, - "raspberrypi": { - "icon": "icon-raspberrypi", - "fill": "#b61040" + "manjaro-cd": { + "icon": "icon-manjaro" }, "npm":{ "icon": "icon-npm", "help": "npm-mirror-howto", "fill": "#c00714" }, - "pypi":{ - "icon": "icon-pypi", - "help": "pypi-mirror-howto", - "fill": "#4277a6" + "openbsd": { + "icon": "icon-openbsd" }, - "alpine":{ - "icon": "icon-alpine" + "opensuse": { + "icon": "icon-opensuse" }, - "openwrt":{ + "openwrt": { "icon": "icon-openwrt" }, "proxmox":{ "icon": "icon-proxmox" }, - "homebrew":{ - "icon": "icon-homebrew", - "help": "homebrew-mirror-howto" - }, - "homebrew-bottles":{ - "icon": "icon-homebrew-bottles" - }, - "ubuntu-ports":{ - "icon": "icon-ubuntu" + "pypi":{ + "icon": "icon-pypi", + "help": "pypi-mirror-howto", + "fill": "#4277a6" }, - "ubuntukylin":{ - "icon": "icon-ubuntukylin" + "raspberrypi": { + "icon": "icon-raspberrypi", + "fill": "#b61040" }, - "centos-altarch":{ - "icon": "icon-centos" + "ubuntu": { + "icon": "icon-ubuntu", + "help": "ubuntu-mirror-howto", + "fill": "#d64613" }, - "aosp-monthly":{ - "icon": "icon-aosp" + "ubuntu-cdimage": { + "icon": "icon-ubuntu" }, - "docker-ce":{ - "icon": "icon-docker" + "ubuntu-ports":{ + "icon": "icon-ubuntu" }, - "manjaro-cd": { - "icon": "icon-manjaro" + "ubuntu-releases": { + "icon": "icon-ubuntu", + "help": "ubuntu-mirror-howto", + "fill": "#d64613" }, - "dockerhub": { - "icon": "icon-docker", - "help": "dockerhub-mirror-howto" + "ubuntukylin": { + "icon": "icon-ubuntukylin" } } -} +} \ No newline at end of file diff --git a/src/assets/icon/demo_index.html b/src/assets/icon/demo_index.html index bd185a6..764a11c 100644 --- a/src/assets/icon/demo_index.html +++ b/src/assets/icon/demo_index.html @@ -2,7 +2,7 @@ - IconFont Demo + iconfont Demo @@ -13,10 +13,33 @@ +
-

+

+ + +

-
  • - -
    homebrew
    -
    &#xedd4;
    -
  • -
  • manjaro
    @@ -236,24 +283,20 @@

    Unicode 引用

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

      -
    • 兼容性最好,支持 IE6+,及所有现代浏览器。
    • 支持按字体的方式去动态调整图标大小,颜色等等。
    • -
    • 但是因为是字体,所以不支持多色。只能使用平台里单色的图标,就算项目里有多色图标也会自动去色。
    • +
    • 默认情况下不支持多色,直接添加多色图标会自动去色。
    -

    注意:新版 iconfont 支持多色图标,这些多色图标在 Unicode 模式下将不能使用,如果有需求建议使用symbol 的引用方式

    +

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

    Unicode 使用步骤如下:

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

    @font-face {
       font-family: 'iconfont';
    -  src: url('iconfont.eot');
    -  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
    -      url('iconfont.woff2') format('woff2'),
    -      url('iconfont.woff') format('woff'),
    -      url('iconfont.ttf') format('truetype'),
    -      url('iconfont.svg#iconfont') format('svg');
    +  src: url('iconfont.woff2?t=1622119376303') format('woff2'),
    +       url('iconfont.woff?t=1622119376303') format('woff'),
    +       url('iconfont.ttf?t=1622119376303') format('truetype');
     }
     

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

    @@ -279,6 +322,51 @@

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