fix visual inconsistency
This commit is contained in:
parent
c280640dc1
commit
8cccb0f4a9
@ -458,7 +458,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
};
|
||||
|
||||
return `
|
||||
<div class="tool-recommendation ${hasValidProjectUrl ? 'hosted' : (tool.license !== 'Proprietary' ? 'oss' : '')}"
|
||||
<div class="tool-recommendation ${tool.type === 'method' ? 'method' : hasValidProjectUrl ? 'hosted' : (tool.license !== 'Proprietary' ? 'oss' : '')}"
|
||||
onclick="window.showToolDetails('${tool.name}')">
|
||||
<div class="tool-rec-header">
|
||||
<h4 class="tool-rec-name">${tool.name}</h4>
|
||||
@ -474,12 +474,13 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
|
||||
<div class="tool-rec-metadata">
|
||||
<div style="display: flex; flex-wrap: wrap; gap: 0.25rem; margin-bottom: 0.5rem;">
|
||||
${hasValidProjectUrl ? '<span class="badge badge-primary">CC24-Server</span>' : ''}
|
||||
${tool.license !== 'Proprietary' ? '<span class="badge badge-success">Open Source</span>' : ''}
|
||||
${tool.type === 'method' ? '<span class="badge" style="background-color: var(--color-method); color: white;">Methode</span>' : ''}
|
||||
${tool.type !== 'method' && hasValidProjectUrl ? '<span class="badge badge-primary">CC24-Server</span>' : ''}
|
||||
${tool.type !== 'method' && tool.license !== 'Proprietary' ? '<span class="badge badge-success">Open Source</span>' : ''}
|
||||
<span class="badge" style="background-color: var(--color-bg-tertiary); color: var(--color-text);">${tool.skillLevel}</span>
|
||||
</div>
|
||||
<div style="font-size: 0.8125rem; color: var(--color-text-secondary);">
|
||||
${tool.platforms.join(', ')} • ${tool.license}
|
||||
${tool.type === 'method' ? 'Methode' : tool.platforms.join(', ') + ' • ' + tool.license}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -603,7 +604,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
fullTool.projectUrl !== null &&
|
||||
fullTool.projectUrl !== "" &&
|
||||
fullTool.projectUrl.trim() !== "";
|
||||
|
||||
const isMethod = fullTool.type === 'method';
|
||||
const suitabilityColors = {
|
||||
high: 'var(--color-accent)',
|
||||
medium: 'var(--color-warning)',
|
||||
@ -617,7 +618,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
};
|
||||
|
||||
return `
|
||||
<div class="tool-detailed-recommendation card ${hasValidProjectUrl ? 'card-hosted' : (fullTool.license !== 'Proprietary' ? 'card-oss' : '')}"
|
||||
<div class="tool-detailed-recommendation card ${isMethod ? 'card-method' : hasValidProjectUrl ? 'card-hosted' : (fullTool.license !== 'Proprietary' ? 'card-oss' : '')}"
|
||||
style="cursor: pointer; position: relative;"
|
||||
onclick="window.showToolDetails('${fullTool.name}')">
|
||||
|
||||
@ -631,8 +632,9 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
<span class="badge" style="background-color: ${suitabilityColors[toolRec.suitability_score]}; color: white; font-size: 0.8125rem;">
|
||||
${getSuitabilityText(toolRec.suitability_score)}
|
||||
</span>
|
||||
${hasValidProjectUrl ? '<span class="badge badge-primary">CC24-Server</span>' : ''}
|
||||
${fullTool.license !== 'Proprietary' ? '<span class="badge badge-success">Open Source</span>' : ''}
|
||||
${isMethod ? '<span class="badge" style="background-color: var(--color-method); color: white;">Methode</span>' : ''}
|
||||
${!isMethod && hasValidProjectUrl ? '<span class="badge badge-primary">CC24-Server</span>' : ''}
|
||||
${!isMethod && fullTool.license !== 'Proprietary' ? '<span class="badge badge-success">Open Source</span>' : ''}
|
||||
${fullTool.knowledgebase === true ? '<span class="badge badge-error">📖</span>' : ''}
|
||||
</div>
|
||||
</div>
|
||||
@ -706,10 +708,10 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
` : ''}
|
||||
|
||||
<div class="tool-metadata" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.75rem; font-size: 0.8125rem; color: var(--color-text-secondary); margin-bottom: 1rem;">
|
||||
<div><strong>Plattformen:</strong> ${fullTool.platforms.join(', ')}</div>
|
||||
${!isMethod ? '<div><strong>Plattformen:</strong> ' + fullTool.platforms.join(', ') + '</div>' : ''}
|
||||
<div><strong>Skill Level:</strong> ${fullTool.skillLevel}</div>
|
||||
<div><strong>Lizenz:</strong> ${fullTool.license}</div>
|
||||
<div><strong>Typ:</strong> ${fullTool.accessType}</div>
|
||||
${!isMethod ? '<div><strong>Lizenz:</strong> ' + fullTool.license + '</div>' : ''}
|
||||
<div><strong>Typ:</strong> ${isMethod ? 'Methode' : fullTool.accessType}</div>
|
||||
</div>
|
||||
|
||||
${toolRec.alternatives ? `
|
||||
|
@ -44,7 +44,7 @@ const cardClass = isMethod ? 'card card-method tool-card' :
|
||||
<h3>{tool.name}</h3>
|
||||
<div class="tool-card-badges">
|
||||
{isMethod && <span class="badge" style="background-color: var(--color-method); color: white;">Methode</span>}
|
||||
{!isMethod && hasValidProjectUrl && <span class="badge badge-primary">Self-Hosted</span>}
|
||||
{!isMethod && hasValidProjectUrl && <span class="badge badge-primary">CC24-Server</span>}
|
||||
{!isMethod && tool.license !== 'Proprietary' && <span class="badge badge-success">OSS</span>}
|
||||
{hasKnowledgebase && <span class="badge badge-error">📖</span>}
|
||||
</div>
|
||||
|
@ -246,6 +246,8 @@ domains.forEach((domain: any) => {
|
||||
const tool = toolsData.find(t => t.name === toolName);
|
||||
if (!tool) return;
|
||||
|
||||
const isMethod = tool.type === 'method';
|
||||
|
||||
// Update modal content
|
||||
document.getElementById('tool-name').textContent = tool.name;
|
||||
document.getElementById('tool-description').textContent = tool.description;
|
||||
@ -258,12 +260,16 @@ domains.forEach((domain: any) => {
|
||||
tool.projectUrl.trim() !== "";
|
||||
|
||||
badgesContainer.innerHTML = '';
|
||||
if (isMethod) {
|
||||
badgesContainer.innerHTML += '<span class="badge" style="background-color: var(--color-method); color: white;">Methode</span>';
|
||||
} else {
|
||||
if (hasValidProjectUrl) {
|
||||
badgesContainer.innerHTML += '<span class="badge badge-primary">CC24-Server</span>';
|
||||
}
|
||||
if (tool.license !== 'Proprietary') {
|
||||
badgesContainer.innerHTML += '<span class="badge badge-success">Open Source</span>';
|
||||
}
|
||||
}
|
||||
if (tool.knowledgebase === true) {
|
||||
badgesContainer.innerHTML += '<span class="badge badge-error">Infos 📖</span>';
|
||||
}
|
||||
@ -299,7 +305,14 @@ domains.forEach((domain: any) => {
|
||||
|
||||
let linksHTML = '';
|
||||
|
||||
if (hasValidProjectUrl) {
|
||||
if (isMethod) {
|
||||
// For methods, show link to the method description/documentation
|
||||
linksHTML += `
|
||||
<a href="${tool.projectUrl || tool.url}" target="_blank" rel="noopener noreferrer" class="btn btn-primary" style="width: 100%; background-color: var(--color-method); border-color: var(--color-method);">
|
||||
Zur Methode
|
||||
</a>
|
||||
`;
|
||||
} else if (hasValidProjectUrl) {
|
||||
linksHTML += `
|
||||
<div style="display: flex; gap: 0.5rem;">
|
||||
<a href="${tool.url}" target="_blank" rel="noopener noreferrer" class="btn btn-secondary" style="flex: 1;">
|
||||
|
@ -905,7 +905,7 @@ tools:
|
||||
integrierter Hash-Verifizierung für die Beweiskette. Die kostenlose
|
||||
Version reicht für die meisten Aufgaben, unterstützt alle gängigen
|
||||
Image-Formate. Etwas angestaubt in der Oberfläche, aber bewährt in
|
||||
tausenden Gerichtsverfahren.
|
||||
tausenden Gerichtsverfahren. Freeware, aber nicht open source.
|
||||
domains:
|
||||
- law-enforcement
|
||||
- incident-response
|
||||
@ -918,7 +918,7 @@ tools:
|
||||
accessType: download
|
||||
url: https://www.exterro.com/digital-forensics-software/ftk-imager
|
||||
projectUrl: ''
|
||||
license: Freeware
|
||||
license: Proprietary
|
||||
knowledgebase: false
|
||||
tags:
|
||||
- gui
|
||||
@ -1276,7 +1276,7 @@ tools:
|
||||
Analyse. Unterstützt alle gängigen Formate von RAW über E01 bis zu
|
||||
VM-Images. Der schreibgeschützte Modus garantiert forensische Integrität
|
||||
der Beweise. Besonders praktisch für schnelle Triage ohne vollständige
|
||||
Forensik-Suite.
|
||||
Forensik-Suite. Freeware, aber nicht open source.
|
||||
domains:
|
||||
- incident-response
|
||||
- law-enforcement
|
||||
@ -1289,7 +1289,7 @@ tools:
|
||||
accessType: download
|
||||
url: https://www.osforensics.com/tools/mount-disk-images.html
|
||||
projectUrl: ''
|
||||
license: Freeware
|
||||
license: Proprietary
|
||||
knowledgebase: false
|
||||
tags:
|
||||
- gui
|
||||
@ -1298,6 +1298,7 @@ tools:
|
||||
- read-only
|
||||
- virtual-drive
|
||||
- format-support
|
||||
- freeware
|
||||
- name: Thumbcache Viewer
|
||||
type: software
|
||||
description: >-
|
||||
|
@ -358,7 +358,7 @@ function createToolCard(tool) {
|
||||
<h3>${tool.name}</h3>
|
||||
<div class="tool-card-badges">
|
||||
${isMethod ? '<span class="badge" style="background-color: var(--color-method); color: white;">Methode</span>' : ''}
|
||||
${!isMethod && hasValidProjectUrl ? '<span class="badge badge-primary">Self-Hosted</span>' : ''}
|
||||
${!isMethod && hasValidProjectUrl ? '<span class="badge badge-primary">CC24-Server</span>' : ''}
|
||||
${!isMethod && tool.license !== 'Proprietary' ? '<span class="badge badge-success">OSS</span>' : ''}
|
||||
${hasKnowledgebase ? '<span class="badge badge-error">📖</span>' : ''}
|
||||
</div>
|
||||
|
@ -1034,6 +1034,21 @@ Collaboration Section Collapse */
|
||||
border-color: var(--color-oss);
|
||||
}
|
||||
|
||||
.tool-recommendation.method {
|
||||
background-color: var(--color-method-bg);
|
||||
border-color: var(--color-method);
|
||||
}
|
||||
|
||||
.tool-detailed-recommendation.card-method {
|
||||
background-color: var(--color-method-bg);
|
||||
border-color: var(--color-method);
|
||||
}
|
||||
|
||||
.tool-detailed-recommendation.card-method:hover {
|
||||
border-color: var(--color-method);
|
||||
box-shadow: 0 0 0 1px var(--color-method), var(--shadow-lg);
|
||||
}
|
||||
|
||||
.tool-rec-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
@ -5,6 +5,7 @@ import { z } from 'zod';
|
||||
|
||||
const ToolSchema = z.object({
|
||||
name: z.string(),
|
||||
icon: z.string().optional(),
|
||||
type: z.string(),
|
||||
description: z.string(),
|
||||
domains: z.array(z.string()).optional().nullable().default([]),
|
||||
|
Loading…
x
Reference in New Issue
Block a user