feats

index.html

     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel="stylesheet" href="./fonts/iconfont.css">
-    <link rel="stylesheet" href="./fonts/STXINGKA.css">
     <script src="./wx/jweixin-1.6.0.js"></script>
-    <script src="./qrcode.min.js"></script>
     <script src="./config.js"></script>
     <title>和“宁好”一起，跟着诗歌游南京</title>
     <!-- <script src="./vconsole.min.js"></script>

public/fonts/STXINGKA-embed.css

-@font-face {
-    font-family: "STXINGKA";
-    src: url("STXINGKA.eot"); /* IE9 */
-    src: url("STXINGKA.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
-    
-    url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAAKAIAAAwAgT1MvMrIpA7MAAACsAAAAYGNtYXDh8sQRAAABDAAAAWJnbHlmo4f0lgAAAnAAAAT4aGVhZPPouO4AAAdoAAAANmhoZWEHMALrAAAHoAAAACRobXR4BMoAyAAAB8QAAAAMbG9jYQL6A9wAAAfQAAAADG1heHAADACjAAAH3AAAACBuYW1l2k+cyAAAB/wAAAUMcG9zdPm7vqMAAA0IAAAATAAEA+gBkAAFAAgAZABkAAAAlgBkAGQAAAKKAGQA+gAAAgEIAAQBAQEBAQAAAAEQAAAAAAAAAAAAAABTSU5PAEBRZY/bAyD/OACQAvkBIQAEAAAAAAAAAAAAAAAAACAAAAAAAAMAAAADAAAAHAABAAAAAABcAAMAAQAAABwABABAAAAADAAIAAIABFFlUftwuY/b/////wAAUWVR+3C5j9v/////rp+uB49IcCgAAQABAAAAAAAAAAAAAAAAAAABBgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMAnP+SA3QCtQBDAE8AiQAAATYyFhUUBwYVFBYVFCMiJiMiBgcGIicOASI1NDcuAScuATQzMh4CFzI3JicmNDMyNTQuAzQyHgEXNjIWFA4BBwYHPgE0Ig4BIiYiBxYHNjc2MhYzMjYzMhYyNzYyFhUUIyIuAjU0Nz4BNCMiBgcGIyInJiIGBwYjIicmIyIGBwYiJjQ2MhYCDyhARwg5CRUFCwodVikBFyYfMwdOCw0JEhkNCBAWKQwPEhsgCA9EBggYDxliGwUxOyskUSYEcGMtDRc5GxIOBAfeJjwPMRMPHVMfFSlGQiQrOhwJSicIESYTCwlZJAwPKiQFCVASCBQbDhkNCCREDBgbIQ0FAXsiOCkSCkMbChUHEwMZFhgkAh0BCi1ZOQULOB0QAhwPEBYGAgdMEFomGjcXLBsaDTMoGSwEJOgZRBILCgQFGvYGHwgRMBkXDDs4HggLBgQIBgwUIjEeCkgLQRcMFCQdPww4PCocAAIAXP9tA3AC6wBnAHoAAAEmNDIWMjYzMhYVFCInJiIPATYyFyYnJjU0Mh4BFAYjIicmIgcGIicGBw4BIyImNDcOASImNDY3JTY1NCYjIiY1NDMyFhQHFBYzMj8BNCMiBh0BFCImNDYzMhYVFAc2MzIWFAcGDwE2BwYHHgEVFDI2NzUmJyY0MhYXNgKhDw4qGyAMLTITCjSAfgYlOhcTIAYZcBshCxQkHz8iBhgLKCkgFxEfIhFBMzUhFgsBEzIGChxHEQYPCBEOKx8CBgQGDBYbFiZGBwsJGzoTLjwBTq9BKwoECS0jGRoGCx0TAwFLDgkSCVgWDAINEacHAzktCAcNP2BQW3oGDxcKBS8kET93UygjHT8RBGw6FQYDcSIQBAYHAwcUnhEPDRkUSycXSTYcMgNNHhAnQAgUhRsZMyopCxgLCicTBAoNBVMABgBG/7cDfALfAHYAfACCAIgAkACgAAAlHgEzNzIWFA4CIyInJiIHBiMiJyYnJjQ2MhYyNjQnJjU0Ny4BNTQ2MhUUFhceARQHBhQXFhcWFyY0Nz4BNQYHBhUXFCImNwYjIiY0Njc2Ny4BNDIWMjcuATU0MzIWFz4CMzIWFAcWFAcGFTYzMhYVFCMiJwYDNjQiBgcXBgcWFzYHJicGFzYnDgEUMzI3NicmJyY0MzIeARUUBiMiNTQCXg89J0k6KBQmkAtC+jRvOQUECwMHCwMPEgofHhkiAyIrCQwQEi5NEiIKKhWmhx4ECgUgNAUBFDYFHxclIhMQHFM0Nw0UKCMDCDQUDwQKLRUNGSsIND0FEQ0sL0sUGAc8BBAiBCsdEhAcAxUZExcDGlYsOg0eOQL+DxcGEDszIWktEyICAgEkDQ4NHFoTFAIPIQ0EDw0KGxUaJTERFgMzIA4bFgsIAQFAHRMkEQkpRScXMxMEDC1RDRkrJiYdOTwLNSkaBQpED1IQBBE6FgUZFiY4cxMzUS0ZNxErOQIxDxsC5gH/L0VuFnITFxINJT0bEBYtDQoOJRAXGsoYHwkNEisSIRoIDAAAAAEAbABYA8YCFAAnAAABJiMiJjU0PgEzMhceARcWFRQOASIuAScmIyIHDgEjIiY1NDMyFjMyAXIOMUppOEEoboJsmI4jCVFSOFA8cRUfND2THBAVCgUEBiIBqQsqCgUKHWhWVkYRIw4FDA08Qn1OW24eFh8RAAAAAAEAAAABAACIaK8ZXw889QADA+gAAAAAsd5GkgAAAADe6C8bAEb/bQPGAusAAAAMAAEAAAAAAAAAAQAAAyL+3wAAA+gARgAiA8YAAQAAAAAAAAAAAAAAAAAAAAED6AAAAJwAXABGAGwAAAAAALoBYAJAAnwAAQAAAAUAoQAGAAAAAAACAAAAAAAAAAAAAAAAAAAAAAAAABAAxgABAAAAAAAAARMAAAABAAAAAAABAAoBEwABAAAAAAACAAcBHQABAAAAAAADABQBJAABAAAAAAAEAAoBOAABAAAAAAAFAAwBQgABAAAAAAAGABsBTgABAAAAAAAHAFEBaQADAAEECQAAAYQBugADAAEECQABABADPgADAAEECQACAA4DTgADAAEECQADAB4DXAADAAEECQAEABADegADAAEECQAFABgDigADAAEECQAGACQDogADAAEECQAHAIADxsO/I8O/T8O/UMO/WcO/UsO/ScO/R8O/SMO/VMO/CMO/Q8O/CcO/EcO/GcO/GcO/EcO/DcO/EcO/GcO/GcO/GMO/DMO/I8O/SMO/QcO/TsO/R8O/WsO/SMO/T8O/VTDDvzPDv0nDv07Dv0/DvzTDv1nDv1DDv0Uww780w79Fw79Dw79Iw79Ow79Pw79Mw79Pw79Hw79ZMMO/I8O/T8O/DsO/DMO/LMO/VMO/RMO/DjDDvyHDv0zDv0www79Sw79Jw79Hw79Iw79Uw79TMMO/UsO/RcO/U8O/RcO/UsO/VsO/RcO/RMO/DjBeOF3DnlNOZcKHU3BSN2XCsGLCgGcvZwnCllBRbFPDuDBySGdDYkBnCTAAU05lwofCiExpd1JlZ3VsYXJTTmXCh8KITGl3MMO/NMO/NMO/JlNOZcKHwohMaXdWZXJzaW9uIDEuMDLDvzPDvzTDvzjDv0nDv07Dv0fDv0vDv0HDv0nDvzPDv0nDv07Dv0/DvzTDv1nDv1DDv0VTw4pTTmXCh1tXXsKTZi9eOF3DnlNOZcKHU3BSN2XCsGLCgGcvZwnCllBRbFPDuE5LVUZoBzACMAAA/wAjAP8ATwD/AFAA/wBZAP8AUgD/AEkA/wBHAP8ASAD/AFQA/wAIAP8AQwD/AAkA/wARAP8AGQD/ABkA/wARAP8ADQD/ABEA/wAZAP8AGQD/ABgA/wAMAP8AIwD/AEgA/wBBAP8ATgD/AEcA/wBaAP8ASAD/AE8A/wBVADAA/wAzAP8ASQD/AE4A/wBPAP8ANAD/AFkA/wBQAP8ARQAwAP8ANAD/AEUA/wBDAP8ASAD/AE4A/wBPAP8ATAD/AE8A/wBHAP8AWQAwAP8AIwD/AE8A/wAOAP8ADAD/ACwA/wBUAP8ARAD/AA4AMAD/ACEA/wBMAP8ATAAwAP8AUgD/AEkA/wBHAP8ASAD/AFQA/wBTADAA/wBSAP8ARQD/AFMA/wBFAP8AUgD/AFYA/wBFAP8ARAD/AA4AMABeADgAXQDeAFMATgBlAIcAUwBwAFIANwBlALAAYgCAAGcALwBnAAkAlgBQAFEAbABTAPgAMAByAEgAZwBDAGIAQABnAAkAMAAAAFMATgBlAIcAiABMAGkAdwBSAGUAZwB1AGwAYQByAFMATgBlAIcAiABMAGkAdwAwAP8ANAD/ADQA/wAmAFMATgBlAIcAiABMAGkAdwBWAGUAcgBzAGkAbwBuACAAMQAuADAAMgD/ADMA/wA0AP8AOAD/AEkA/wBOAP8ARwD/AEsA/wBBAP8ASQD/ADMA/wBJAP8ATgD/AE8A/wA0AP8AWQD/AFAA/wBFAFMAygBTAE4AZQCHAFsAVwBeAJMAZgAvAF4AOABdAN4AUwBOAGUAhwBTAHAAUgA3AGUAsABiAIAAZwAvAGcACQCWAFAAUQBsAFMA+ABOAEsAVQBGAGgABwAwAAIAMAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAUABQAAAQIBAwEEAQUHdW5pNzBCOQd1bmk1MUZCB3VuaThGREIHdW5pNTE2NQ==) format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+ */
-    
-    url("STXINGKA.svg#STXINGKA") format("svg"); /* iOS 4.1- */
-    font-style: normal;
-    font-weight: normal;
-}
-
-

public/fonts/STXINGKA.css

-@font-face {
-    font-family: "STXINGKA";
-    src: url("STXINGKA.eot"); /* IE9 */
-    src: url("STXINGKA.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
-    
-    url("STXINGKA.woff") format("woff"), /* chrome、firefox */
-    url("STXINGKA.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+ */
-    
-    url("STXINGKA.svg#STXINGKA") format("svg"); /* iOS 4.1- */
-    font-style: normal;
-    font-weight: normal;
-}
-
-

public/fonts/demo_index.html

       <div class="content unicode" style="display: block;">
           <ul class="icon_lists dib-box">
           
+            <li class="dib">
+              <span class="icon iconfont">&#xe60a;</span>
+                <div class="name">map</div>
+                <div class="code-name">&amp;#xe60a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe80d;</span>
+                <div class="name">pause circle</div>
+                <div class="code-name">&amp;#xe80d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe80f;</span>
+                <div class="name">play circle</div>
+                <div class="code-name">&amp;#xe80f;</div>
+              </li>
+          
             <li class="dib">
               <span class="icon iconfont">&#xe659;</span>
                 <div class="name">round_close</div>
 >@font-face {
   font-family: 'iconfont';
   src: 
-       url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAb4AAsAAAAADagAAAaqAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACDbAqNNIsLATYCJAMgCxIABCAFhGcHfhupCxEVpIuTfXFgnl90WLnSufoOmm8OlRpJ9zkfnk7r/UE6mTTlVFzUStcsjwsi2fXkziWQBZTumQmABgiYgV95hJtLzehELYAC5CcM7eKTZuhlv+Ihn6ysv/Zree/Pb6eh6TsxrJcTf4uZJU+biKaJeMN0E62E7IkhUjKUFPFN/txrJhRfynUZgLOAAODhaxpqzrwlUTDYsfbALlhjoHsSIG9IdmzdvBZcLxaMR0bARUikazIgn4EFqMuUBsCn8cuTb+AfB1BgaejtrNg0dwN6tOYTSbRSpwToxwgd62ul5qYAsABoAJ57Fk8u+VPPgE59njHy3M8yiAFgAA4UJFpzbbz2I22p9s1Ekk5XFiS21t0JDMy/eIAeCFhIwIACDRAJgPrEb/DrnUunc+Q0HtEgoB8hGixoKaIhAX0DEzDARGI0KNAkUNwjHNfcCGAJVAjiNNBCBaTvwhQWVNjEzMw2TC63ksfFRCp3n59PwTjbmxjJ14oxd41UFXtPqo6+I1VG3Y45JpJfWfarWb/K/yuKi01WlYlCVEySWKI0i45KSClVW8RGJ6rLVebHVRYsSSoS1iSkmJklgCrixRGNa0mOVeYdmdql+ZZDMiHJ5vT6YcX4vd0JwqR+ssU2sp5auY5+CHHof0Fko2h+KElVrjY7mKgs2fXsKF5ZupvNysSSeLGM0AtLS0FV2a28zot3dTVCVBbpHnNOE9F+587t0Ci5+gbblE+FsmdyqrLDJWPd6C7YFp4snheTVMmynJPfob6YFxFbnF3WNBktUbcVLa4plgkClJGlYceLJq8pKAHVxouBDRrLlEN7DSHN12zSiYxWW6xnP8WqDhQMtVXld48PtlZmdKwvHDOn48M1ZP1uMc0itt7hnv/dmDbvNKJKVidCaZUZdvzfGJXhK0QlJMSKSURlndYV3ubvy251K7U6wOiEDSdgmz7p10KKZeo7dzxTNIEFseLkgpaKzNbzXq24vTqrLXpZZJdZilEm6KbbotgQEbFBseVna42sWe9bFD/Xptb7csaW+MBof//owPjrZKWoaP8i+zpNF668fDHV2tk65fIlXc3ayebSxUs2i3e2udyYfFmd0nuSywj5SYK1nOey3mfLe3+zNTWjq/6f4tRPWMvCI/Xz3H0c/6oczp3Psba2f2XP+eb/qY63WiKLohZfzF6NLQWpc2XLvB48c1yaPefxf5Gc5/K+tY3nKEtf786l1ZVfetadYmNiE00NXaTNig3h4RsUm3+2Vky8IXyz4udaDb0vFVviAo4zKSDuOtlhLbKvD2ptrvQV2l1NFZ9Xcme5o0Pr8ClwKNjlkMvWSufjs2avUXzLL9liGbz03EzNJq3RYmHqDGGhyc5p77psXrrZJW3A2t6x9Y8IH2zNLsPgZJ7DeqHdpV2w4B8LT/j5pm250tSSf2Iqb3dpM53/BxEe8/5CuUu5sMfn7vnTC6Vf+By1ICvvbJvpeMt68c01buw3gW7Zwwibtff+7mXOH5sOZoU7WS/O/qHY+cLbZT4BzvyS7O9b7UgRM6NpyYyscGeen87dSvnzVwPj8h+bb1GeruX2nFLW7cFxfRSF+HYvW26fM7K+1q8Ld1ocG83PWmC9YEXQU4dUgdMYazjDNTfZ96fZx1jM1F+2PW6J3cwpiZO2chqpw8ajWUefGqUI0nGTdqnB2pvs/1knssWpUs3iBJ9ZLkazfP9KCrlg5Tszu36/t0mh581rhMCmjtWqIQdhTtH47H13F8yVjku/4TQmHdw30nacBgDoeuheekasekKfp1mu10rJ3fR0+B6UiW/pQ7qIdpcSOD/2c2EXt+nvraHiN072TzDsWZiBdZyi62FkiI8thdjxIafvCZnMJA/gGK5zziFWcdgLtpgCwJsuwOc608TTdYabkvOXJNw0Bwp6sAEaHJwJw7sDCxn8QQIOkcDDw9z1ZTC1BzQIIwUw1dkWEBgpBQoGaAUaRoYJw98DFuYmQAIj/wGPGCLfmgxTM+Cb0t5ogsMNGCU7G2FxoN/kT3GvTUX/pJVRAEPbVyu+KJOuYpl69qOZA6eS4LOzP4pRoKgcCa2dzcqm6xy3TIuSFm9Kewv1JzjcwjJKdmwrv71v8qe4VyH5T9ZKdhU4DG0vIF+YRe3uSfN69qOpZAfOp6o8wWfPCl/slgoUvvhIOE5t5yWKy6YzLCfFdvvh6WZG3HYd6jvjlhShCUNYIiF6hCNS8CqnPGGUSs/pVBkdx/iSlogeeCpH3/HlCfaK2BThvIY2yn62hyxGzRilDIsFAAA=') format('woff2'),
-       url('iconfont.woff?t=1662213530243') format('woff'),
-       url('iconfont.ttf?t=1662213530243') format('truetype'),
-       url('iconfont.svg?t=1662213530243#iconfont') format('svg');
+       url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
+       url('iconfont.woff?t=1662453170373') format('woff'),
+       url('iconfont.ttf?t=1662453170373') format('truetype'),
+       url('iconfont.svg?t=1662453170373#iconfont') format('svg');
 }
 </code></pre>
           <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
       <div class="content font-class">
         <ul class="icon_lists dib-box">
           
+          <li class="dib">
+            <span class="icon iconfont icon-map"></span>
+            <div class="name">
+              map
+            </div>
+            <div class="code-name">.icon-map
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-pausecircle"></span>
+            <div class="name">
+              pause circle
+            </div>
+            <div class="code-name">.icon-pausecircle
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-playcircle"></span>
+            <div class="name">
+              play circle
+            </div>
+            <div class="code-name">.icon-playcircle
+            </div>
+          </li>
+          
           <li class="dib">
             <span class="icon iconfont icon-roundclose"></span>
             <div class="name">
       <div class="content symbol">
           <ul class="icon_lists dib-box">
           
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-map"></use>
+                </svg>
+                <div class="name">map</div>
+                <div class="code-name">#icon-map</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-pausecircle"></use>
+                </svg>
+                <div class="name">pause circle</div>
+                <div class="code-name">#icon-pausecircle</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-playcircle"></use>
+                </svg>
+                <div class="name">play circle</div>
+                <div class="code-name">#icon-playcircle</div>
+            </li>
+          
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-roundclose"></use>

public/fonts/iconfont.css

 @font-face {
   font-family: "iconfont"; /* Project id 3600839 */
   src: 
-       url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
-       url('iconfont.woff?t=1662213530243') format('woff'),
-       url('iconfont.ttf?t=1662213530243') format('truetype'),
-       url('iconfont.svg?t=1662213530243#iconfont') format('svg');
+       url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAgsAAsAAAAAEDwAAAfeAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACELgqRVI54ATYCJAMsCxgABCAFhGcHgR8bBQ4RFaw5IfuiwHZ8sRiWGFiUpwUEh9bx02m6IT19XwRPtPZ7M7vnqDQxazSzhGfx/CVBghB/InRI2TW0Gx639W+EMZx6OphgRGFjJHqRhNVw3eyut//bjOAqkwBgKIMdZ9S2Zd3XImSE2SrPfvPVs9nAcpQwIXyZ/zWXb8M0NLdYKPFv/s8mppglk0tUs7TI43UTrYTsyVKFUAgdg+XmgRXQi8JJzIqfOwkChHTgB2UsbLEAqG8lbdsAONBgXQXKqrK1WpIEVBYSbE+04JOu74oWyDlwQE8pcuDMPr180SUqAMUxgG1mJj00FYw8hp/mUmUKGcBco1nD1SMzK+AABmi5MZlc9GsywOSwxWKhq7blCACK0Fx8t30NH5c8jnr8x+Pax4+eZD1FnuYqFGwDMhtnXYUijrCYZPEQi0+Ah4OLYqb/PBdQLAv+J7YQXmUGBF5ZrAMeBREW+B8Q4QOvhYgA+CNkwIO3TBGOxbOQARfeEREKXAM4Pxk9WqEEQDVAH8C8wogFCi0PMkCB2kF1jRJDVYTJpNEknypcel4Iwq66IFXEhr+sSTMx0NJE1pKXmAkkBRd58GWREsKvQLyKaKhkwktkskxmJoNBYtnYFfEExfu3LCAHZQPEED7sSshHZKOnyDPj+NjpJMKNHt6hf0ahh+IVIjKi3nCueAYFjpGt5S1NSjyRhtNI1u2223O8XsiPKFKcjdcRqECURdTImEJBRk4tiYmFmWQ9ztqLY3QoqwpNzMhhMjOAXsDEjNyqpoRdeIlBWnZfMMyGoGwWNaWzaP7Kxgy0UjkbWwOlUFYM0Qs0Eiw/ICiNYO3IwutJ5vZMWc21mwSwrPY6a9URNVFEHUQNjqoFWmKj7CxMXGalIAjH8m1PnMSn/9Kli54ChDznrAnnguSIWa5sQKrA5uw1MILHC4aJLDybUdKRG1QjynzE1cV1XWagR3CR12OVo5OBAplvrdfeKrPEihqgVzDB7ZDr5Nzbc/DoPqObDzGoJJbifBcd31Yx1ddUPjw/2dtYMJBSOWTJQEIilLKRyMPE7YZXXC6L+hzyIDybzARJdqHX43+hoMAJFWRkiIksCOfkDXn3ufSZeq1r2Xcoykh9AqUc8894VDO+28ntcuTcCjFhVtHTUNj72ktV9zcX9QljMXrMhm0yQ6HoibXg8y1iuZ5YKDPAamHwntRtXBiyJwc1IyvUk+u8kDB+nIW/eKEN38aabxvRbL/ePDYkzVMQuDhk+zMNivqz45CgxRtjcJpF7KZks22EDZ9voy5EpOAI3IRuoW4hzaalnDB2WWiZdZhNKYgT0hsD1/n5rQvcSBPA+F7ntzGQ1prwgGhNNFfs6irmRl8kgPgWu0ZzL5LSi3m7pLveSNTfSWlcEC05xycGsf9uKS/VxyeVJ30vgAEFqFK/X02s/H+ANIordHERcqPOCmCEQhdKfZZO5i07eTyXY8LJOXmCleIY6544fkIYYRPdk52qk2TO4kFOgv7//cCGit3S0TvLRj/paTOpTb/Njcchuk7lrvYwG0ejb43TpXwVup7et+KQF78tjC5MwrGqOv8FrwLSitxQv0UeTh7aq1occvOXr4rdsrHBRrObTj07n+mx4ghy4s5wjq6WrpkYKHx3S3ip3t6pPMl7AeA71VvCe98qo/w/Txrp+phK18izlAlQpT67KidpdEL7rXgJxweICWIkMY5+CLDD3XKH5epGk71BwYm8l/BiqY77kiOB8vTHmotQiwA0Qmu9X4ylZInEMm+CY2DU+8XHERvTL1DfX2aYgvZb9qMYfLPoFszX7ivjtHXgW4Ux/ZZ92vxfSNFN2AWtt6xHNzlePnowQvU/x90YtOLSmkCjC5xF5xOt6S96rIunwWA3x2Hr8FKTP7Uni7yNOYuK31SbHHu61NHVBF5c/LpXH6qiBXQtDijyNoHdk9mwZe+fTcwjb7svUKui52JIzXhxcl4NTg+n4aXLxGMGRc/V2ryNF4mFcFA4J3y5223DXFRFni9X0Ug8T4/zMxBhgWpL10Yu1g80zzRdrSIPDNN2F+2+rZmDqs4X9KuqJ52n/y7aV0xYqMrHMxyDLDWDnL5leRxjOwUWF+38NMvzKKsF5XYNrMKnDNGQqvngLZfDQ1Xngxe+vGBA5UXQDxJ3ARCPJIAzbMES6j2TpBnJqMtzK0epdNBHgVYNU/0Br9URJ8/1VFFtfBHAHhvOxFDm5LkEDd4nlegfctAdr8vFmuMSGhjejY/CNALjPnzZk9LuJDBEq0hWZHzEPqAzh4ch7wSjO0MBtwlR6M0ezRKFZaLiUQmNy78KWvg3JTpEdEEX/qOJIc2Erh5RyCZARawqgDoOI1HIozZRyeESGvhPQwv/K4kOJTyBLvx/JYYsQcjGIup4gk9CRmmF5R88craCVDvWd3ItGulyfpNUDztM/dgseqNMkmKR+uNmVQtWOMHrbHcUI0MRPhBqv6mW/TBY1yI9cto9CRnVqVdg+c/vkbOl1vrLeyfXohFP5FsllTLJ2IGJntEDecOyV6M3Urv+uBklKgsSCilMwOsCAMa5h4Hidh0It5qeLcJV9gycyvpi/eWJ9GVjfHdNstuNoCa6YVq243p+Zb0pN8W0SugFI12XaP6LnQm3vGLkSlepVY/Wx/gwdbMsfq2LTv3ny/GI2BX2eQXpxLtNzzMrdbNRT7sdAA==') format('woff2'),
+       url('iconfont.woff?t=1662453170373') format('woff'),
+       url('iconfont.ttf?t=1662453170373') format('truetype'),
+       url('iconfont.svg?t=1662453170373#iconfont') format('svg');
 }
 
 .iconfont {
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-map:before {
+  content: "\e60a";
+}
+
+.icon-pausecircle:before {
+  content: "\e80d";
+}
+
+.icon-playcircle:before {
+  content: "\e80f";
+}
+
 .icon-roundclose:before {
   content: "\e659";
 }

public/fonts/iconfont.json

   "css_prefix_text": "icon-",
   "description": "",
   "glyphs": [
+    {
+      "icon_id": "1368587",
+      "name": "map",
+      "font_class": "map",
+      "unicode": "e60a",
+      "unicode_decimal": 58890
+    },
+    {
+      "icon_id": "6151260",
+      "name": "pause circle",
+      "font_class": "pausecircle",
+      "unicode": "e80d",
+      "unicode_decimal": 59405
+    },
+    {
+      "icon_id": "6151262",
+      "name": "play circle",
+      "font_class": "playcircle",
+      "unicode": "e80f",
+      "unicode_decimal": 59407
+    },
     {
       "icon_id": "29944",
       "name": "round_close",

public/fonts/iconfont.svg

     />
       <missing-glyph />
       
+      <glyph glyph-name="map" unicode="&#58890;" d="M511.717567 768.018164c34.606169 0 68.116377-6.704702 99.598393-19.928889 30.468942-12.797467 57.817824-31.142278 81.289398-54.525847 48.328705-48.146557 74.943876-112.571868 74.943876-181.406606 0-37.119409-7.90504-79.557964-23.496134-126.136816-14.530948-43.412742-35.730783-90.39273-63.010079-139.63627-58.604746-105.791441-129.349997-194.2184-169.326477-240.706177C471.734948 52.18068500000004 400.986627 140.62504 342.395184 246.383736c-27.282367 49.244564-48.484248 96.225575-63.017242 139.63627-15.59314 46.578852-23.499204 89.017406-23.499204 126.135792 0 68.834738 26.616194 133.26005 74.9449 181.406607 23.471574 23.38357 50.821479 41.72838 81.291444 54.525847 31.483038 13.225209 64.99427 19.929912 99.602485 19.929912m0 63.956637c-176.35966 0-319.794443-141.665487-319.794443-319.817979 0-186.559976 159.91206-420.09073 276.493242-554.182728 0.435928-0.523933 19.150152-21.444405 42.284035-21.444405h2.029216c23.134907 0 41.84299 20.924565 42.289152 21.444405 116.605741 134.093021 276.489148 367.627868 276.489149 554.182728-0.001023 178.152493-143.43683 319.817979-319.790351 319.817979zM511.706311 576.1369950000001c35.270295 0 63.964824-28.694529 63.964824-63.964824s-28.694529-63.964824-63.964824-63.964824-63.964824 28.694529-63.964824 63.964824 28.694529 63.964824 63.964824 63.964824m0 63.956638c-70.64906 0-127.921461-57.272401-127.921461-127.921462s57.272401-127.921461 127.921461-127.921461 127.921461 57.272401 127.921461 127.921461-57.272401 127.921461-127.921461 127.921462z"  horiz-adv-x="1024" />
+      
+      <glyph glyph-name="pausecircle" unicode="&#59405;" d="M512-96A480 480 0 1 0 512 864a480 480 0 0 0 0-960z m2.82 87.18a390 390 0 1 1 0 780 390 390 0 0 1 0-780zM332 564h120v-360H332V564z m240 0h120v-360H572V564z"  horiz-adv-x="1024" />
+      
+      <glyph glyph-name="playcircle" unicode="&#59407;" d="M512-96A480 480 0 1 0 512 864a480 480 0 0 0 0-960z m2.82 87.18a390 390 0 1 1 0 780 390 390 0 0 1 0-780zM391.28 594.36l360-210.84-360-209.16v420z"  horiz-adv-x="1024" />
+      
       <glyph glyph-name="roundclose" unicode="&#58969;" d="M512-64C264.96-64 64 136.96000000000004 64 384S264.96 832 512 832s448-200.96 448-448S759.04-64 512-64zM512 767.712C300.416 767.712 128.288 595.5840000000001 128.288 384c0-211.552 172.128-383.712 383.712-383.712 211.552 0 383.712 172.16 383.712 383.712C895.712 595.5840000000001 723.552 767.712 512 767.712zM557.056 382.624l138.368 136.864c12.576 12.416 12.672 32.672 0.256 45.248-12.416 12.576-32.704 12.672-45.248 0.256l-138.56-137.024-136.448 136.864c-12.512 12.512-32.736 12.576-45.248 0.064-12.512-12.48-12.544-32.736-0.064-45.248l136.256-136.672-137.376-135.904c-12.576-12.448-12.672-32.672-0.256-45.248 6.272-6.336 14.496-9.504 22.752-9.504 8.128 0 16.256 3.104 22.496 9.248l137.568 136.064 138.688-139.136c6.24-6.272 14.432-9.408 22.656-9.408 8.192 0 16.352 3.136 22.592 9.344 12.512 12.48 12.544 32.704 0.064 45.248L557.056 382.624z"  horiz-adv-x="1024" />
       
       <glyph glyph-name="musicfill" unicode="&#59285;" d="M895.456 125.44000000000005C895.552 126.30399999999997 896 127.10400000000004 896 128L896 736c0 1.056-0.512 1.984-0.608 3.008-0.032 1.664 0.448 3.232 0.16 4.928-2.88 17.408-19.328 29.184-36.8 26.304l-480-80c-17.408-2.912-29.216-19.392-26.304-36.832 0.256-1.472 1.024-2.656 1.44-4.032C352.96 646.336 352 643.328 352 640l0-429.6c-20.128 9.376-43.648 14.784-69.408 14.784-21.312 0-42.816-3.456-63.968-10.336-39.616-12.8-73.536-36.224-95.584-65.984-24.064-32.512-31.68-70.24-20.864-103.648 15.648-48.288 66.656-79.456 129.92-79.456 21.248 0 42.72 3.456 63.904 10.304 58.656 19.04 100.288 59.2 115.04 103.808C413.888 84.67200000000003 416 89.98400000000004 416 96l0 5.312c1.056 8.48 1.056 16.96 0 25.472L416 631.552l416 69.344 0-490.88c-20.32 9.632-44.096 15.2-70.176 15.2-21.28 0-42.816-3.456-63.968-10.336-39.584-12.8-73.568-36.224-95.584-65.984-24.096-32.512-31.68-70.24-20.864-103.648 15.648-48.288 66.656-79.456 129.92-79.456 21.248 0 42.752 3.456 63.904 10.304C853.472 1.4400000000000546 902.176 64.32000000000005 895.456 125.44000000000005z"  horiz-adv-x="1024" />