ayrisdev/crawl4ai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(app-detail): enhance tab functionality, hide documentation and support tabs in marketplace

Browse Source
This commit is contained in:
ntohidi
2025-10-26 11:21:29 +01:00
parent 4df83893ac
commit 46ef1116c4
3 changed files with 21 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docs/md_v2/marketplace/app-detail.css
View File

@@ -278,12 +278,12 @@
} }
.tab-content { .tab-content {
display: none; display: none !important;
padding: 2rem; padding: 2rem;
} }
.tab-content.active { .tab-content.active {
display: block; display: block !important;
} }
/* Overview Layout */ /* Overview Layout */

14
docs/md_v2/marketplace/app-detail.html
View File

@@ -73,8 +73,8 @@
<div class="tabs"> <div class="tabs">
<button class="tab-btn active" data-tab="overview">Overview</button> <button class="tab-btn active" data-tab="overview">Overview</button>
<button class="tab-btn" data-tab="integration">Integration</button> <button class="tab-btn" data-tab="integration">Integration</button>
<button class="tab-btn" data-tab="docs">Documentation</button> <!-- <button class="tab-btn" data-tab="docs">Documentation</button>
<button class="tab-btn" data-tab="support">Support</button> <button class="tab-btn" data-tab="support">Support</button> -->
</div> </div>
<section id="overview-tab" class="tab-content active"> <section id="overview-tab" class="tab-content active">
@@ -130,17 +130,15 @@
<section id="integration-tab" class="tab-content"> <section id="integration-tab" class="tab-content">
<div class="integration-content" id="app-integration"> <div class="integration-content" id="app-integration">
<!-- Integration guide markdown content will be rendered here -->
</div> </div>
</section> </section>
<section id="docs-tab" class="tab-content"> <!-- <section id="docs-tab" class="tab-content">
<div class="docs-content" id="app-docs"> <div class="docs-content" id="app-docs">
<!-- Documentation markdown content will be rendered here -->
</div> </div>
</section> </section> -->
<section id="support-tab" class="tab-content"> <!-- <section id="support-tab" class="tab-content">
<div class="docs-content"> <div class="docs-content">
<h2>Support</h2> <h2>Support</h2>
<div class="support-grid"> <div class="support-grid">
@@ -158,7 +156,7 @@
</div> </div>
</div> </div>
</div> </div>
</section> </section> -->
</div> </div>
</main> </main>

17
docs/md_v2/marketplace/app-detail.js
View File

@@ -112,7 +112,7 @@ class AppDetailPage {
} }
// Contact // Contact
document.getElementById('app-contact').textContent = this.appData.contact_email || 'Not available'; document.getElementById('app-contact') && (document.getElementById('app-contact').textContent = this.appData.contact_email || 'Not available');
// Sidebar info // Sidebar info
document.getElementById('sidebar-downloads').textContent = this.formatNumber(this.appData.downloads || 0); document.getElementById('sidebar-downloads').textContent = this.formatNumber(this.appData.downloads || 0);
@@ -263,18 +263,27 @@ class AppDetailPage {
setupEventListeners() { setupEventListeners() {
// Tab switching // Tab switching
const tabs = document.querySelectorAll('.tab-btn'); const tabs = document.querySelectorAll('.tab-btn');
tabs.forEach(tab => { tabs.forEach(tab => {
tab.addEventListener('click', () => { tab.addEventListener('click', () => {
// Update active tab // Update active tab button
tabs.forEach(t => t.classList.remove('active')); tabs.forEach(t => t.classList.remove('active'));
tab.classList.add('active'); tab.classList.add('active');
// Show corresponding content // Show corresponding content
const tabName = tab.dataset.tab; const tabName = tab.dataset.tab;
document.querySelectorAll('.tab-content').forEach(content => {
// Hide all tab contents
const allTabContents = document.querySelectorAll('.tab-content');
allTabContents.forEach(content => {
content.classList.remove('active'); content.classList.remove('active');
}); });
document.getElementById(`${tabName}-tab`).classList.add('active');
// Show the selected tab content
const targetTab = document.getElementById(`${tabName}-tab`);
if (targetTab) {
targetTab.classList.add('active');
}
}); });
}); });
} }