rocky/OSGKeyboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(site): unify platform download badges

Browse Source 
Give App Store and macOS downloads matching dimensions and two-line typography so platform choice stays clear without extra labels.
This commit is contained in:
Rocky
2026-07-30 13:12:55 +08:00
parent 8b0ac61f4a
commit 9e689164cd
8 changed files with 54 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/assets/badges/ios-en.svg
+11
View File
@@ -0,0 +1,11 @@
<svg xmlns="http://www.w3.org/2000/svg" width="144" height="40" viewBox="0 0 144 40" role="img" aria-labelledby="title">
<title id="title">Download now - App Store</title>
<rect width="144" height="40" rx="7" fill="#000"/>
<rect x=".75" y=".75" width="142.5" height="38.5" rx="6.25" fill="none" stroke="#a6a6a6" stroke-width="1.5"/>
<g fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.7">
<rect x="15" y="6.5" width="13" height="26.5" rx="3"/>
<path d="M19 9.5h5M19.5 29.5h4"/>
</g>
<text x="40" y="14" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="7.2">DOWNLOAD NOW</text>
<text x="40" y="29" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="15.5" font-weight="600">App Store</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 824 B

docs/assets/badges/ios-zh.svg
+11
View File
@@ -0,0 +1,11 @@
<svg xmlns="http://www.w3.org/2000/svg" width="144" height="40" viewBox="0 0 144 40" role="img" aria-labelledby="title">
<title id="title">&#31435;&#21363;&#19979;&#36733; App Store</title>
<rect width="144" height="40" rx="7" fill="#000"/>
<rect x=".75" y=".75" width="142.5" height="38.5" rx="6.25" fill="none" stroke="#a6a6a6" stroke-width="1.5"/>
<g fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.7">
<rect x="15" y="6.5" width="13" height="26.5" rx="3"/>
<path d="M19 9.5h5M19.5 29.5h4"/>
</g>
<text x="40" y="14" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="7.2">&#31435;&#21363;&#19979;&#36733;</text>
<text x="40" y="29" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="15.5" font-weight="600">App Store</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 862 B

docs/assets/badges/macos-en.svg
+6 -6
View File
@@ -1,11 +1,11 @@
<svg xmlns="http://www.w3.org/2000/svg" width="128" height="40" viewBox="0 0 128 40" role="img" aria-labelledby="title">
<title id="title">Download for macOS</title>
<rect width="128" height="40" rx="7" fill="#000"/>
<rect x=".75" y=".75" width="126.5" height="38.5" rx="6.25" fill="none" stroke="#a6a6a6" stroke-width="1.5"/>
<svg xmlns="http://www.w3.org/2000/svg" width="144" height="40" viewBox="0 0 144 40" role="img" aria-labelledby="title">
<title id="title">Download now — macOS version</title>
<rect width="144" height="40" rx="7" fill="#000"/>
<rect x=".75" y=".75" width="142.5" height="38.5" rx="6.25" fill="none" stroke="#a6a6a6" stroke-width="1.5"/>
<g fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.7">
<rect x="10.5" y="8.5" width="22" height="15.5" rx="2"/>
<path d="M17.5 29.5h8M21.5 24v5.5M17.5 20.5h8"/>
</g>
<text x="40" y="14" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="6.6">DIRECT DOWNLOAD</text>
<text x="40" y="29" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="16" font-weight="600">macOS</text>
<text x="40" y="14" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="7.2">DOWNLOAD NOW</text>
<text x="40" y="29" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="15.5" font-weight="600">macOS version</text>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 832 B

After

Width:  |  Height:  |  Size: 851 B

docs/assets/badges/macos-zh.svg
+6 -6
View File
@@ -1,11 +1,11 @@
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="40" viewBox="0 0 120 40" role="img" aria-labelledby="title">
<title id="title">&#30452;&#25509;&#19979;&#36733; macOS &#29256;</title>
<rect width="120" height="40" rx="7" fill="#000"/>
<rect x=".75" y=".75" width="118.5" height="38.5" rx="6.25" fill="none" stroke="#a6a6a6" stroke-width="1.5"/>
<svg xmlns="http://www.w3.org/2000/svg" width="144" height="40" viewBox="0 0 144 40" role="img" aria-labelledby="title">
<title id="title">&#31435;&#21363;&#19979;&#36733; macOS &#29256;&#26412;</title>
<rect width="144" height="40" rx="7" fill="#000"/>
<rect x=".75" y=".75" width="142.5" height="38.5" rx="6.25" fill="none" stroke="#a6a6a6" stroke-width="1.5"/>
<g fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.7">
<rect x="10.5" y="8.5" width="22" height="15.5" rx="2"/>
<path d="M17.5 29.5h8M21.5 24v5.5M17.5 20.5h8"/>
</g>
<text x="40" y="14" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="7.2">&#30452;&#25509;&#19979;&#36733;</text>
<text x="40" y="29" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="15.5" font-weight="600">macOS &#29256;</text>
<text x="40" y="14" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="7.2">&#31435;&#21363;&#19979;&#36733;</text>
<text x="40" y="29" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, sans-serif" font-size="15.5" font-weight="600">macOS &#29256;&#26412;</text>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 889 B

After

Width:  |  Height:  |  Size: 905 B