mirror of
https://github.com/kunkunsh/kunkun-ext-neohtop.git
synced 2025-04-04 09:46:43 +00:00
adds new download buttons for windows and linux
This commit is contained in:
Abdenasser
parent
98b53cad3f
commit
747ff31518
48
.github/workflows/build-check.yml
vendored
Normal file
48
.github/workflows/build-check.yml
vendored
Normal file
@ -0,0 +1,48 @@
|
||||
name: Build Check
|
||||
|
||||
on:
|
||||
pull_request:
|
||||
branches: [ main ]
|
||||
|
||||
env:
|
||||
CARGO_TERM_COLOR: always
|
||||
|
||||
jobs:
|
||||
build:
|
||||
name: Build Check
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
|
||||
- name: Setup Node.js
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: 'lts/*'
|
||||
cache: 'npm'
|
||||
|
||||
- name: Install Rust
|
||||
uses: dtolnay/rust-toolchain@stable
|
||||
|
||||
- name: Install Linux Dependencies
|
||||
run: |
|
||||
sudo apt-get update
|
||||
sudo apt-get install -y \
|
||||
build-essential \
|
||||
pkg-config \
|
||||
libgtk-3-dev \
|
||||
libayatana-appindicator3-dev \
|
||||
librsvg2-dev \
|
||||
libglib2.0-dev \
|
||||
libjavascriptcoregtk-4.0-dev \
|
||||
libsoup-3.0-dev \
|
||||
libwebkit2gtk-4.1-dev
|
||||
|
||||
- name: Install Dependencies
|
||||
run: npm install
|
||||
|
||||
- name: Build Frontend
|
||||
run: npm run build
|
||||
|
||||
- name: Build Application
|
||||
run: npm run tauri build
|
||||
179
docs/index.html
179
docs/index.html
@ -127,39 +127,98 @@
|
||||
|
||||
<section id="download" class="downloads">
|
||||
<div class="download-container glass-card">
|
||||
<h2>Download</h2>
|
||||
<p class="download-subtitle">Choose the version that matches your system</p>
|
||||
<div class="download-options">
|
||||
<a href="https://github.com/Abdenasser/neohtop/releases/download/v1.0.5/NeoHtop-intel.dmg"
|
||||
class="download-button intel">
|
||||
<span class="icon">💻</span>
|
||||
<div class="button-text">
|
||||
<span class="primary">Intel Mac</span>
|
||||
<span class="secondary">For Intel-based Macs</span>
|
||||
</div>
|
||||
</a>
|
||||
<a href="https://github.com/Abdenasser/neohtop/releases/download/v1.0.5/NeoHtop-silicon.dmg"
|
||||
class="download-button silicon">
|
||||
<span class="icon">🍎</span>
|
||||
<div class="button-text">
|
||||
<span class="primary">Apple Silicon</span>
|
||||
<span class="secondary">For M1/M2/M3 Macs</span>
|
||||
</div>
|
||||
</a>
|
||||
<a href="https://github.com/Abdenasser/neohtop/releases/download/v1.0.5/NeoHtop-linux-arm64.deb"
|
||||
class="download-button linux">
|
||||
<span class="icon">🐧</span>
|
||||
<div class="button-text">
|
||||
<span class="primary">Linux ARM64</span>
|
||||
<span class="secondary">For ARM64-based Linux (.deb)</span>
|
||||
</div>
|
||||
</a>
|
||||
<h2>Download NeoHtop</h2>
|
||||
<p class="download-subtitle">Choose your platform to get started</p>
|
||||
<div class="version-info">
|
||||
Current Version: <span id="current-version">Loading...</span>
|
||||
</div>
|
||||
<div class="trust-badge">
|
||||
<span class="verified-icon">✓</span>
|
||||
<span class="verified-text">Notarized by Apple for enhanced security</span>
|
||||
<a href="https://developer.apple.com/documentation/security/notarizing-macos-software-before-distribution"
|
||||
target="_blank" rel="noopener" class="learn-more">Learn more</a>
|
||||
<div class="download-options">
|
||||
<!-- macOS Downloads -->
|
||||
<div class="download-group">
|
||||
<h3 class="platform-title">macOS</h3>
|
||||
<!-- notarized by apple badge -->
|
||||
<div class="notarized-badge">
|
||||
<img
|
||||
src="https://img.shields.io/badge/Notarized%20by%20Apple-000000?style=for-the-badge&logo=apple&logoColor=white"
|
||||
alt="Notarized by Apple">
|
||||
</div>
|
||||
<div class="platform-options">
|
||||
<a href="" class="download-button macos" data-type="macos-intel" data-version="latest">
|
||||
<span class="icon">💻</span>
|
||||
<div class="button-text">
|
||||
<span class="primary">Intel Chip</span>
|
||||
<span class="secondary">macOS 10.15 or later</span>
|
||||
</div>
|
||||
</a>
|
||||
<a href="" class="download-button macos" data-type="macos-silicon" data-version="latest">
|
||||
<span class="icon">🍎</span>
|
||||
<div class="button-text">
|
||||
<span class="primary">Apple Silicon</span>
|
||||
<span class="secondary">macOS 11.0 or later</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Windows Download -->
|
||||
<div class="download-group">
|
||||
<h3 class="platform-title">Windows</h3>
|
||||
<div class="platform-options">
|
||||
<a href="" class="download-button windows" data-type="windows" data-version="latest">
|
||||
<span class="icon">🪟</span>
|
||||
<div class="button-text">
|
||||
<span class="primary">Windows</span>
|
||||
<span class="secondary">Windows 10 or later</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Linux Downloads -->
|
||||
<div class="download-group">
|
||||
<h3 class="platform-title">Linux</h3>
|
||||
<div class="platform-options">
|
||||
<!-- x86_64 Downloads -->
|
||||
<div class="linux-downloads">
|
||||
<h4>x86_64</h4>
|
||||
<a href="" class="download-button linux" data-type="linux-deb-x64" data-version="latest">
|
||||
<span class="icon">📦</span>
|
||||
<div class="button-text">
|
||||
<span class="primary">.deb Package</span>
|
||||
<span class="secondary">Debian/Ubuntu</span>
|
||||
</div>
|
||||
</a>
|
||||
<a href="" class="download-button linux" data-type="linux-appimage-x64" data-version="latest"
|
||||
style="margin-top: 10px;">
|
||||
<span class="icon">🐧</span>
|
||||
<div class="button-text">
|
||||
<span class="primary">AppImage</span>
|
||||
<span class="secondary">Universal Linux</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- ARM64 Downloads -->
|
||||
<div class="linux-downloads">
|
||||
<h4>ARM64</h4>
|
||||
<a href="" class="download-button linux" data-type="linux-deb-arm64" data-version="latest">
|
||||
<span class="icon">📦</span>
|
||||
<div class="button-text">
|
||||
<span class="primary">.deb Package</span>
|
||||
<span class="secondary">Debian/Ubuntu ARM64</span>
|
||||
</div>
|
||||
</a>
|
||||
<a href="" class="download-button linux" data-type="linux-appimage-arm64" data-version="latest"
|
||||
style="margin-top: 10px;">
|
||||
<span class="icon">🐧</span>
|
||||
<div class="button-text">
|
||||
<span class="primary">AppImage</span>
|
||||
<span class="secondary">Universal Linux ARM64</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@ -327,6 +386,62 @@
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
<script>
|
||||
async function updateVersion() {
|
||||
try {
|
||||
const response = await fetch('https://api.github.com/repos/Abdenasser/neohtop/releases/latest');
|
||||
const data = await response.json();
|
||||
const version = data.tag_name;
|
||||
|
||||
// Extract just the version number (e.g., "1.0.6" from "macos-nightly-1.0.6")
|
||||
const versionNumber = version.match(/\d+\.\d+\.\d+/)?.[0];
|
||||
document.getElementById('current-version').textContent = versionNumber;
|
||||
|
||||
if (versionNumber) {
|
||||
// Update all download URLs with the latest version
|
||||
const downloadLinks = document.querySelectorAll('.download-button');
|
||||
downloadLinks.forEach(link => {
|
||||
const platform = link.getAttribute('data-type');
|
||||
let newHref;
|
||||
|
||||
switch (platform) {
|
||||
case 'macos-intel':
|
||||
newHref = `https://github.com/Abdenasser/neohtop/releases/download/macos-nightly-${versionNumber}/intel-NeoHtop_${versionNumber}_x64.dmg`;
|
||||
break;
|
||||
case 'macos-silicon':
|
||||
newHref = `https://github.com/Abdenasser/neohtop/releases/download/macos-nightly-${versionNumber}/silicon-NeoHtop_${versionNumber}_aarch64.dmg`;
|
||||
break;
|
||||
case 'windows':
|
||||
newHref = `https://github.com/Abdenasser/neohtop/releases/download/windows-nightly-${versionNumber}/NeoHtop.exe`;
|
||||
break;
|
||||
case 'linux-deb-x64':
|
||||
newHref = `https://github.com/Abdenasser/neohtop/releases/download/linux-x86_64-nightly-${versionNumber}/NeoHtop_${versionNumber}_amd64.deb`;
|
||||
break;
|
||||
case 'linux-appimage-x64':
|
||||
newHref = `https://github.com/Abdenasser/neohtop/releases/download/linux-x86_64-nightly-${versionNumber}/NeoHtop_${versionNumber}_amd64.AppImage`;
|
||||
break;
|
||||
case 'linux-deb-arm64':
|
||||
newHref = `https://github.com/Abdenasser/neohtop/releases/download/linux-arm64-nightly-${versionNumber}/NeoHtop_${versionNumber}_arm64.deb`;
|
||||
break;
|
||||
case 'linux-appimage-arm64':
|
||||
newHref = `https://github.com/Abdenasser/neohtop/releases/download/linux-arm64-nightly-${versionNumber}/NeoHtop_${versionNumber}_aarch64.AppImage`;
|
||||
break;
|
||||
}
|
||||
|
||||
if (newHref) {
|
||||
link.href = newHref;
|
||||
}
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Failed to fetch version:', error);
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
updateVersion();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
262
docs/styles.css
262
docs/styles.css
@ -348,28 +348,60 @@ section {
|
||||
/* Download Section */
|
||||
.download-options {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
gap: 1.5rem;
|
||||
justify-content: center;
|
||||
margin: 2rem 0;
|
||||
flex-wrap: wrap;
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
.download-button {
|
||||
background: var(--primary-color);
|
||||
color: white;
|
||||
padding: 1rem 2rem;
|
||||
padding: 1rem 1.5rem;
|
||||
border-radius: 8px;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
gap: 1rem;
|
||||
transition: all 0.2s;
|
||||
position: relative;
|
||||
min-width: 250px;
|
||||
}
|
||||
|
||||
.download-button .button-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.25rem;
|
||||
}
|
||||
|
||||
.download-button .primary {
|
||||
font-weight: 600;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.download-button .secondary {
|
||||
font-size: 0.85rem;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
/* New styles for nested links */
|
||||
.download-button .secondary a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
transition: all 0.2s;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.download-button .secondary a:hover {
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.download-button:hover {
|
||||
transform: translateY(-2px);
|
||||
background: var(--secondary-color);
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.download-button .icon {
|
||||
@ -1104,4 +1136,224 @@ footer {
|
||||
.hero-background {
|
||||
flex: 0 0 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.download-button.windows {
|
||||
background: #00a4ef;
|
||||
}
|
||||
|
||||
.download-button.windows:hover {
|
||||
background: #0090d5;
|
||||
}
|
||||
|
||||
.download-button.linux {
|
||||
background: var(--primary-color);
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
padding: 1rem 1.5rem;
|
||||
}
|
||||
|
||||
.download-button.linux:hover {
|
||||
background: var(--secondary-color);
|
||||
}
|
||||
|
||||
.download-options-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.25rem;
|
||||
}
|
||||
|
||||
.download-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.download-option .format {
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
min-width: 65px;
|
||||
}
|
||||
|
||||
.download-option .separator {
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
|
||||
.download-option a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.download-option a:hover {
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.download-button.linux .secondary {
|
||||
line-height: 1.6;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.download-button.linux .secondary a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
transition: all 0.2s;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.download-button.linux .secondary a:hover {
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.download-button.linux .secondary .separator {
|
||||
opacity: 0.7;
|
||||
margin: 0 2px;
|
||||
}
|
||||
|
||||
.downloads {
|
||||
padding: 2rem 0;
|
||||
}
|
||||
|
||||
.download-container {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 2rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.download-container h2 {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 1rem;
|
||||
background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
.download-subtitle {
|
||||
color: var(--text-secondary);
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.download-options {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2.5rem;
|
||||
}
|
||||
|
||||
.download-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.platform-title {
|
||||
font-size: 1.2rem;
|
||||
color: var(--text-secondary);
|
||||
text-align: left;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.platform-options {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.download-button {
|
||||
background: var(--card-background);
|
||||
color: var(--text-primary);
|
||||
padding: 1rem 1.5rem;
|
||||
border-radius: 12px;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
transition: all 0.2s;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
min-width: 250px;
|
||||
}
|
||||
|
||||
.download-button:hover {
|
||||
transform: translateY(-2px);
|
||||
border-color: var(--primary-color);
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.download-button .icon {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.button-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.25rem;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.button-text .primary {
|
||||
font-weight: 600;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.button-text .secondary {
|
||||
font-size: 0.85rem;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.linux-options {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.format-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.format-label {
|
||||
font-size: 0.9rem;
|
||||
color: var(--text-secondary);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.format-buttons {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.format-buttons .download-button {
|
||||
min-width: 150px;
|
||||
}
|
||||
|
||||
/* Dark mode adjustments */
|
||||
[data-theme="dark"] .download-button {
|
||||
background: rgba(30, 41, 59, 0.8);
|
||||
border-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
[data-theme="dark"] .download-button:hover {
|
||||
border-color: var(--primary-color);
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.version-info {
|
||||
text-align: center;
|
||||
margin: 1rem 0;
|
||||
font-size: 0.9rem;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
#current-version {
|
||||
font-weight: 600;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
@ -32,16 +32,43 @@
|
||||
"https://api.github.com/repos/abdenasser/neohtop/releases/latest",
|
||||
);
|
||||
const data = await response.json();
|
||||
latestVersion = data.tag_name.replace("v", "");
|
||||
hasUpdate = version && latestVersion && version !== latestVersion;
|
||||
|
||||
// Extract version number from tag (e.g., "1.0.6" from "macos-nightly-1.0.6")
|
||||
const versionMatch = data.tag_name.match(/\d+\.\d+\.\d+/);
|
||||
if (!versionMatch) {
|
||||
console.warn(
|
||||
"Unexpected version format in latest release:",
|
||||
data.tag_name,
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
latestVersion = versionMatch[0];
|
||||
|
||||
// Extract version number from current version
|
||||
const currentVersionMatch = version.match(/\d+\.\d+\.\d+/);
|
||||
if (!currentVersionMatch) {
|
||||
console.warn("Unexpected current version format:", version);
|
||||
return;
|
||||
}
|
||||
|
||||
// Compare only the version numbers
|
||||
hasUpdate = currentVersionMatch[0] !== latestVersion;
|
||||
} catch (error) {
|
||||
console.error("Failed to check latest version:", error);
|
||||
latestVersion = "";
|
||||
hasUpdate = false;
|
||||
}
|
||||
}
|
||||
|
||||
onMount(async () => {
|
||||
version = await getVersion();
|
||||
await checkLatestVersion();
|
||||
try {
|
||||
version = await getVersion();
|
||||
await checkLatestVersion();
|
||||
} catch (error) {
|
||||
console.error("Failed to initialize version info:", error);
|
||||
version = "";
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -85,14 +112,13 @@
|
||||
<span class="label">source</span>
|
||||
<span class="separator">::</span>
|
||||
<a
|
||||
href={APP_INFO.github}
|
||||
class="value"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
href={APP_INFO.github}
|
||||
class="value"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
{APP_INFO.github}
|
||||
</a>
|
||||
|
||||
</a>
|
||||
</div>
|
||||
<div class="detail-row">
|
||||
<span class="label">stack</span>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user