ReadMe 界面焕然一新！

README.md

@@ -53,11 +53,11 @@
 # 图标预览（当前共计 283 个）
 ## 圆角矩形图标
 <!-- START BORDER-RADIUS ICONS -->
-<img src="border-radius/163music_A.png" alt="163music_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">163music_A</p> <img src="border-radius/163music_B.png" alt="163music_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">163music_B</p> <img src="border-radius/189drive_A.png" alt="189drive_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">189drive_A</p> <img src="border-radius/Adguard_A.png" alt="Adguard_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Adguard_A</p> <img src="border-radius/Adguard_B.png" alt="Adguard_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Adguard_B</p> <img src="border-radius/AliDrive.png" alt="AliDrive" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">AliDrive</p> <img src="border-radius/Alist.png" alt="Alist" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Alist</p> <img src="border-radius/Amule.png" alt="Amule" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Amule</p> <img src="border-radius/Apache_A.png" alt="Apache_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Apache_A</p> <img src="border-radius/Apache_B.png" alt="Apache_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Apache_B</p> <img src="border-radius/Apache_C.png" alt="Apache_C" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Apache_C</p> <img src="border-radius/Apache_D.png" alt="Apache_D" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Apache_D</p> <img src="border-radius/Arch_A.png" alt="Arch_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Arch_A</p> <img src="border-radius/Arch_B.png" alt="Arch_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Arch_B</p> <img src="border-radius/AriaNgNative_A.png" alt="AriaNgNative_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">AriaNgNative_A</p> <img src="border-radius/AriaNgNative_B.png" alt="AriaNgNative_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">AriaNgNative_B</p> <img src="border-radius/BaiduNetdisk.png" alt="BaiduNetdisk" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">BaiduNetdisk</p> <img src="border-radius/Bark.png" alt="Bark" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Bark</p> <img src="border-radius/Bilibili_A.png" alt="Bilibili_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Bilibili_A</p> <img src="border-radius/Bilibili_B.png" alt="Bilibili_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Bilibili_B</p> <img src="border-radius/Bilibili_C.png" alt="Bilibili_C" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Bilibili_C</p> <img src="border-radius/Bilibili_D.png" alt="Bilibili_D" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Bilibili_D</p> <img src="border-radius/Bilibili_E.png" alt="Bilibili_E" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Bilibili_E</p> <img src="border-radius/Bitwarden.png" alt="Bitwarden" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Bitwarden</p> <img src="border-radius/Calibre.png" alt="Calibre" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Calibre</p> <img src="border-radius/Casaos_A.png" alt="Casaos_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Casaos_A</p> <img src="border-radius/Centos_A.png" alt="Centos_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Centos_A</p> <img src="border-radius/Centos_B.png" alt="Centos_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Centos_B</p> <img src="border-radius/Chevereto.png" alt="Chevereto" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Chevereto</p> <img src="border-radius/Chrome.png" alt="Chrome" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Chrome</p> <img src="border-radius/Clash.png" alt="Clash" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Clash</p> <img src="border-radius/Cloudflare_A.png" alt="Cloudflare_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Cloudflare_A</p> <img src="border-radius/Cloudflare_B.png" alt="Cloudflare_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Cloudflare_B</p> <img src="Line truncated
+<img src="border-radius/163music_A.png" alt="163music_A" width="105"><br/>163music_A</img> <img src="border-radius/163music_B.png" alt="163music_B" width="105"><br/>163music_B</img> <img src="border-radius/189drive_A.png" alt="189drive_A" width="105"><br/>189drive_A</img> <img src="border-radius/Adguard_A.png" alt="Adguard_A" width="105"><br/>Adguard_A</img> <img src="border-radius/Adguard_B.png" alt="Adguard_B" width="105"><br/>Adguard_B</img> <img src="border-radius/AliDrive.png" alt="AliDrive" width="105"><br/>AliDrive</img> <img src="border-radius/Alist.png" alt="Alist" width="105"><br/>Alist</img> <img src="border-radius/Amule.png" alt="Amule" width="105"><br/>Amule</img> <img src="border-radius/Apache_A.png" alt="Apache_A" width="105"><br/>Apache_A</img> <img src="border-radius/Apache_B.png" alt="Apache_B" width="105"><br/>Apache_B</img> <img src="border-radius/Apache_C.png" alt="Apache_C" width="105"><br/>Apache_C</img> <img src="border-radius/Apache_D.png" alt="Apache_D" width="105"><br/>Apache_D</img> <img src="border-radius/Arch_A.png" alt="Arch_A" width="105"><br/>Arch_A</img> <img src="border-radius/Arch_B.png" alt="Arch_B" width="105"><br/>Arch_B</img> <img src="border-radius/AriaNgNative_A.png" alt="AriaNgNative_A" width="105"><br/>AriaNgNative_A</img> <img src="border-radius/AriaNgNative_B.png" alt="AriaNgNative_B" width="105"><br/>AriaNgNative_B</img> <img src="border-radius/BaiduNetdisk.png" alt="BaiduNetdisk" width="105"><br/>BaiduNetdisk</img> <img src="border-radius/Bark.png" alt="Bark" width="105"><br/>Bark</img> <img src="border-radius/Bilibili_A.png" alt="Bilibili_A" width="105"><br/>Bilibili_A</img> <img src="border-radius/Bilibili_B.png" alt="Bilibili_B" width="105"><br/>Bilibili_B</img> <img src="border-radius/Bilibili_C.png" alt="Bilibili_C" width="105"><br/>Bilibili_C</img> <img src="border-radius/Bilibili_D.png" alt="Bilibili_D" width="105"><br/>Bilibili_D</img> <img src="border-radius/Bilibili_E.png" alt="Bilibili_E" width="105"><br/>Bilibili_E</img> <img src="border-radius/Bitwarden.png" alt="Bitwarden" width="105"><br/>Bitwarden</img> <img src="border-radius/Calibre.png" alt="Calibre" width="105"><br/>Calibre</img> <img src="border-radius/Casaos_A.png" alt="Casaos_A" width="105"><br/>Casaos_A</img> <img src="border-radius/Centos_A.png" alt="Centos_A" width="105"><br/>Centos_A</img> <img src="border-radius/Centos_B.png" alt="Centos_B" width="105"><br/>Centos_B</img> <img src="border-radius/Chevereto.png" alt="Chevereto" width="105"><br/>Chevereto</img> <img src="border-radius/Chrome.png" alt="Chrome" width="105"><br/>Chrome</img> <img src="border-radius/Clash.png" alt="Clash" width="105"><br/>Clash</img> <img src="border-radius/Cloudflare_A.png" alt="Cloudflare_A" width="105"><br/>Cloudflare_A</img> <img src="border-radius/Cloudflare_B.png" alt="Cloudflare_B" width="105"><br/>Cloudflare_B</img> <img src="border-radius/Composerize.png" alt="Composerize" width="105"><br/>Composerize</img> <img src="border-radius/DDNS_A.png" alt="DDNS_A" width="105"><br/>DDNS_A</img> <img src="border-radius/Debian_A.png" alt="Debian_A" width="105"><br/>Debian_A</img> <img src="border-radius/Debian_B.png" alt="Debian_B" width="105"><br/>Debian_B</img> <img src="border-radius/Deepin_A.png" alt="Deepin_A" width="105"><br/>Deepin_A</img> <img src="border-radius/Dim_A.png" alt="Dim_A" width="105"><br/>Dim_A</img> <img src="border-radius/Dim_B.png" alt="Dim_B" width="105"><br/>Dim_B</img> <img src="border-radius/Docker.png" alt="Docker" width="105"><br/>Docker</img> <img src="border-radius/Drawio.png" alt="Drawio" width="105"><br/>Drawio</img> <img src="border-radius/DSvideo_A.png" alt="DSvideo_A" width="105"><br/>DSvideo_A</img> <img src="border-radius/EmbyTheater.png" alt="EmbyTheater" width="105"><br/>EmbyTheater</img> <img src="border-radius/EpicGames.png" alt="EpicGames" width="105"><br/>EpicGames</img> <img src="border-radius/Excalidraw_A.png" alt="Excalidraw_A" width="105"><br/>Excalidraw_A</img> <img src="border-radius/Excalidraw_B.png" alt="Excalidraw_B" width="105"><br/>Excalidraw_B</img> <img src="border-radius/FileBrowser.png" alt="FileBrowser" width="105"><br/>FileBrowser</img> <img src="border-radius/Flexget.png" alt="Flexget" width="105"><br/>Flexget</img> <img src="border-radius/Flood_A.png" alt="Flood_A" width="105"><br/>Flood_A</img> <img src="border-radius/Flood_B.png" alt="Flood_B" width="105"><br/>Flood_B</img> <img src="border-radius/Freenom_A.png" alt="Freenom_A" width="105"><br/>Freenom_A</img> <img src="border-radius/Freenom_B.png" alt="Freenom_B" width="105"><br/>Freenom_B</img> <img src="border-radius/FreshRSS_A.png" alt="FreshRSS_A" width="105"><br/>FreshRSS_A</img> <img src="border-radius/FreshRSS_B.png" alt="FreshRSS_B" width="105"><br/>FreshRSS_B</img> <img src="border-radius/FRP_A.png" alt="FRP_A" width="105"><br/>FRP_A</img> <img src="border-radius/HA_A.png" alt="HA_A" width="105"><br/>HA_A</img> <img src="border-radius/HA_B.png" alt="HA_B" width="105"><br/>HA_B</img> Line truncated
 <!-- END BORDER-RADIUS ICONS -->
 
 ## 圆形图标
-<img src="circle/AriaNg.png" alt="AriaNg" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">AriaNg</p> <img src="circle/Bazarr.png" alt="Bazarr" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Bazarr</p> <img src="circle/Caddy.png" alt="Caddy" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Caddy</p> <img src="circle/Cloudflare_A.png" alt="Cloudflare_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Cloudflare_A</p> <img src="circle/Cloudflare_B.png" alt="Cloudflare_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Cloudflare_B</p> <img src="circle/Compressarr.png" alt="Compressarr" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Compressarr</p> <img src="circle/DDNS.png" alt="DDNS" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">DDNS</p> <img src="circle/Docker.png" alt="Docker" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Docker</p> <img src="circle/FileBrowser.png" alt="FileBrowser" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">FileBrowser</p> <img src="circle/Flood_A.png" alt="Flood_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Flood_A</p> <img src="circle/Flood_B.png" alt="Flood_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Flood_B</p> <img src="circle/FreshRSS.png" alt="FreshRSS" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">FreshRSS</p> <img src="circle/IYUU.png" alt="IYUU" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">IYUU</p> <img src="circle/Jellyseerr.png" alt="Jellyseerr" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Jellyseerr</p> <img src="circle/Lidarr.png" alt="Lidarr" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Lidarr</p> <img src="circle/Minio.png" alt="Minio" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Minio</p> <img src="circle/Navidrome.png" alt="Navidrome" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Navidrome</p> <img src="circle/Ombi.png" alt="Ombi" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Ombi</p> <img src="circle/Overseerr.png" alt="Overseerr" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Overseerr</p> <img src="circle/Photoprism_A.png" alt="Photoprism_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Photoprism_A</p> <img src="circle/Photoprism_B.png" alt="Photoprism_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Photoprism_B</p> <img src="circle/Photoprism_C.png" alt="Photoprism_C" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Photoprism_C</p> <img src="circle/Photoprism_D.png" alt="Photoprism_D" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Photoprism_D</p> <img src="circle/Photoprism_E.png" alt="Photoprism_E" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Photoprism_E</p> <img src="circle/Photoprism_F.png" alt="Photoprism_F" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Photoprism_F</p> <img src="circle/Photostructure_A.png" alt="Photostructure_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Photostructure_A</p> <img src="circle/Prowlarr.png" alt="Prowlarr" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Prowlarr</p> <img src="circle/PTHelper.png" alt="PTHelper" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">PTHelper</p> <img src="circle/PVE_A.png" alt="PVE_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">PVE_A</p> <img src="circle/PVE_B.png" alt="PVE_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">PVE_B</p> <img src="circle/Qbittorrent_A.png" alt="Qbittorrent_A" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Qbittorrent_A</p> <img src="circle/Qbittorrent_B.png" alt="Qbittorrent_B" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Qbittorrent_B</p> <img src="circle/Qinglong.png" alt="Qinglong" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Qinglong</p> <img src="circle/Readarr.png" alt="Readarr" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">Readarr</p> <img src="circle/Sonarr.png" alt="Sonarr" width="105"><br/><p style="text-align: center;width: 1Line truncated
+<img src="circle/AriaNg.png" alt="AriaNg" width="105"><br/>AriaNg</img> <img src="circle/Bazarr.png" alt="Bazarr" width="105"><br/>Bazarr</img> <img src="circle/Caddy.png" alt="Caddy" width="105"><br/>Caddy</img> <img src="circle/Cloudflare_A.png" alt="Cloudflare_A" width="105"><br/>Cloudflare_A</img> <img src="circle/Cloudflare_B.png" alt="Cloudflare_B" width="105"><br/>Cloudflare_B</img> <img src="circle/Compressarr.png" alt="Compressarr" width="105"><br/>Compressarr</img> <img src="circle/DDNS.png" alt="DDNS" width="105"><br/>DDNS</img> <img src="circle/Docker.png" alt="Docker" width="105"><br/>Docker</img> <img src="circle/FileBrowser.png" alt="FileBrowser" width="105"><br/>FileBrowser</img> <img src="circle/Flood_A.png" alt="Flood_A" width="105"><br/>Flood_A</img> <img src="circle/Flood_B.png" alt="Flood_B" width="105"><br/>Flood_B</img> <img src="circle/FreshRSS.png" alt="FreshRSS" width="105"><br/>FreshRSS</img> <img src="circle/IYUU.png" alt="IYUU" width="105"><br/>IYUU</img> <img src="circle/Jellyseerr.png" alt="Jellyseerr" width="105"><br/>Jellyseerr</img> <img src="circle/Lidarr.png" alt="Lidarr" width="105"><br/>Lidarr</img> <img src="circle/Minio.png" alt="Minio" width="105"><br/>Minio</img> <img src="circle/Navidrome.png" alt="Navidrome" width="105"><br/>Navidrome</img> <img src="circle/Ombi.png" alt="Ombi" width="105"><br/>Ombi</img> <img src="circle/Overseerr.png" alt="Overseerr" width="105"><br/>Overseerr</img> <img src="circle/Photoprism_A.png" alt="Photoprism_A" width="105"><br/>Photoprism_A</img> <img src="circle/Photoprism_B.png" alt="Photoprism_B" width="105"><br/>Photoprism_B</img> <img src="circle/Photoprism_C.png" alt="Photoprism_C" width="105"><br/>Photoprism_C</img> <img src="circle/Photoprism_D.png" alt="Photoprism_D" width="105"><br/>Photoprism_D</img> <img src="circle/Photoprism_E.png" alt="Photoprism_E" width="105"><br/>Photoprism_E</img> <img src="circle/Photoprism_F.png" alt="Photoprism_F" width="105"><br/>Photoprism_F</img> <img src="circle/Photostructure_A.png" alt="Photostructure_A" width="105"><br/>Photostructure_A</img> <img src="circle/Prowlarr.png" alt="Prowlarr" width="105"><br/>Prowlarr</img> <img src="circle/PTHelper.png" alt="PTHelper" width="105"><br/>PTHelper</img> <img src="circle/PVE_A.png" alt="PVE_A" width="105"><br/>PVE_A</img> <img src="circle/PVE_B.png" alt="PVE_B" width="105"><br/>PVE_B</img> <img src="circle/Qbittorrent_A.png" alt="Qbittorrent_A" width="105"><br/>Qbittorrent_A</img> <img src="circle/Qbittorrent_B.png" alt="Qbittorrent_B" width="105"><br/>Qbittorrent_B</img> <img src="circle/Qinglong.png" alt="Qinglong" width="105"><br/>Qinglong</img> <img src="circle/Readarr.png" alt="Readarr" width="105"><br/>Readarr</img> <img src="circle/Sonarr.png" alt="Sonarr" width="105"><br/>Sonarr</img> <img src="circle/Speedtest.png" alt="Speedtest" width="105"><br/>Speedtest</img> <img src="circle/Syncthing.png" alt="Syncthing" width="105"><br/>Syncthing</img> <img src="circle/Tautulli.png" alt="Tautulli" width="105"><br/>Tautulli</img> <img src="circle/UnlockMusic.png" alt="UnlockMusic" width="105"><br/>UnlockMusic</img> <img src="circle/Verysync.png" alt="Verysync" width="105"><br/>Verysync</img> <img src="circle/Webdav.png" alt="Webdav" width="105"><br/>Webdav</img> <img src="circle/Whisparr.png" alt="Whisparr" width="105"><br/>Whisparr</img> <img src="circle/Wireguard.png" alt="Wireguard" width="105"><br/>Wireguard</img> <img src="circle/Youtube-dl_A.png" alt="Youtube-dl_A" width="105"><br/>Youtube-dl_A</img> <img src="circle/Youtube-dl_B.png" alt="Youtube-dl_B" width="105"><br/>Youtube-dl_B</img> <img src="circle/Youtube-dl_C.png" alt="Youtube-dl_C" width="105"><br/>Youtube-dl_C</img><!-- START CIRCLE ICONS -->
 
 <!-- END CIRCLE ICONS -->
 

_generate.py

@@ -10,7 +10,7 @@ readme_path   = root / "README.md"
     # return f'<div style="width: 105px;text-align: center;display: inline-block;font-size: 12px;margin: 5px;"><img style="border: 1.5px dashed white;border-radius: {radius};" src="{folder}/{file.name}" alt="{file.stem}" /><br/>{file.stem}</div>'
 
 def generate_img_tag(file,folder,radius):
-    return f'<img src="{folder}/{file.name}" alt="{file.stem}" width="105"><br/><p style="text-align: center;width: 105px;display: inline-block;">{file.stem}</p>'
+    return f'<img src="{folder}/{file.name}" alt="{file.stem}" width="105"><br/>{file.stem}</img>'
 
 
 imgs            = sorted(Path("./border-radius").glob("*.png"))