BlackSnufkin
432 lines
28 KiB
HTML
432 lines
28 KiB
HTML
<!-- app/templates/upload.html -->
|
|
|
|
{% extends "base.html" %}
|
|
|
|
{% block page_title %}Upload Payload{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="max-w-5xl mx-auto px-4 py-6">
|
|
<!-- Progress Steps - Enhanced with better spacing and visual hierarchy -->
|
|
<div class="flex items-center space-x-6 mb-10">
|
|
<!-- Upload Step - Improved visibility and interaction states -->
|
|
<div class="flex items-center space-x-4">
|
|
<div id="step1Circle" class="w-12 h-12 rounded-full bg-red-500/10 border-2 border-red-500 flex items-center justify-center transition-all duration-300 shadow-lg">
|
|
<span id="step1Text" class="text-red-500 font-medium text-xl">1</span>
|
|
</div>
|
|
<div class="flex flex-col">
|
|
<span id="step1Label" class="text-gray-200 font-medium text-lg tracking-wide">Upload</span>
|
|
<span class="text-base text-gray-400">Select payload</span>
|
|
</div>
|
|
</div>
|
|
<!-- Progress Line - Enhanced visibility -->
|
|
<div id="progressLine" class="flex-1 h-1 bg-gradient-to-r from-red-500/30 via-red-500/10 to-gray-800 transition-all duration-300"></div>
|
|
<!-- Analysis Step - Improved consistency -->
|
|
<div class="flex items-center space-x-4">
|
|
<div id="step2Circle" class="w-12 h-12 rounded-full bg-black/50 border-2 border-gray-700 flex items-center justify-center transition-all duration-300 shadow-lg">
|
|
<span id="step2Text" class="text-gray-500 font-medium text-xl">2</span>
|
|
</div>
|
|
<div class="flex flex-col">
|
|
<span class="text-lg text-gray-400 font-medium tracking-wide">Analysis</span>
|
|
<span class="text-base text-gray-400">Choose type</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Upload Area - Enhanced visual feedback and interactions -->
|
|
<div id="uploadArea" class="transition-all duration-300">
|
|
<div class="bg-black/60 backdrop-blur-lg rounded-xl border border-gray-800 shadow-xl">
|
|
<!-- Drop Zone - Improved drag and drop feedback -->
|
|
<div id="dropZone" class="relative group">
|
|
<input type="file" id="fileInput" class="hidden" accept=".exe,.dll,.bin,.docx,.xlsx,.lnk,.sys">
|
|
<label for="fileInput" class="cursor-pointer block p-14 border-2 border-dashed border-gray-700 hover:border-red-500/50 m-8 rounded-xl transition-all duration-300">
|
|
<!-- Enhanced hover gradient -->
|
|
<div class="absolute inset-0 bg-gradient-to-b from-red-500/10 via-transparent to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 rounded-xl"></div>
|
|
|
|
<!-- Upload Content - Improved layout and spacing -->
|
|
<div class="relative space-y-8 text-center">
|
|
<!-- Upload Icon - Enhanced visual feedback -->
|
|
<div class="upload-icon w-28 h-28 mx-auto bg-gradient-to-b from-red-500/15 to-red-500/5 rounded-full flex items-center justify-center transform transition-all duration-300 group-hover:scale-110">
|
|
<svg class="w-14 h-14 text-red-500 transition-colors duration-300" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"/>
|
|
</svg>
|
|
</div>
|
|
|
|
<!-- Text Content - Enhanced typography and spacing -->
|
|
<div class="space-y-4">
|
|
<h3 class="text-xl font-medium text-gray-200 group-hover:text-white transition-colors">
|
|
Drop payload here or click to browse
|
|
</h3>
|
|
<div class="flex flex-wrap justify-center gap-3">
|
|
<span class="text-base text-gray-400">Supported formats:</span>
|
|
{% for ext in config.upload.allowed_extensions %}
|
|
<span class="px-3 py-1.5 text-base bg-red-500/5 rounded-lg text-red-400 font-mono border border-red-900/20">
|
|
.{{ ext }}
|
|
</span>
|
|
{% endfor %}
|
|
</div>
|
|
<div class="text-base text-gray-400 pt-2">
|
|
Maximum file size: {{ (config.upload.max_file_size / 1024 / 1024) | round(1) }} MB
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<!-- Upload Status - Enhanced visibility -->
|
|
<div id="uploadStatus" class="hidden px-8 pb-8"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- File Info & Analysis View - Improved layout and spacing -->
|
|
<div id="fileAnalysisArea" class="hidden opacity-0 transform scale-95 transition-all duration-300 space-y-8 z-[40]">
|
|
<!-- Analysis Options -->
|
|
<div class="bg-black/60 backdrop-blur-lg rounded-xl border border-gray-800 shadow-xl">
|
|
<div class="p-8">
|
|
<h4 class="text-xl font-medium text-gray-200 mb-8">Choose Analysis Type</h4>
|
|
<div class="grid grid-cols-2 gap-8">
|
|
|
|
<!-- Static Analysis - Enhanced card design -->
|
|
<button onclick="selectAnalysisType('static')" class="group text-left">
|
|
<div class="p-6 rounded-xl border border-gray-800 hover:border-red-500/50 bg-gradient-to-br from-gray-900/50 to-black/30 transition-all duration-300 hover:shadow-lg">
|
|
<div class="flex items-center space-x-4 mb-4">
|
|
<div class="p-3 bg-red-500/10 rounded-lg group-hover:bg-red-500/20 transition-colors">
|
|
<svg class="w-7 h-7 text-red-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"/>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<h5 class="text-lg font-medium text-gray-200 group-hover:text-white">Static Analysis</h5>
|
|
<p class="text-base text-gray-400">No execution required</p>
|
|
</div>
|
|
</div>
|
|
|
|
<p class="text-base text-gray-400 group-hover:text-gray-300 mb-4">
|
|
Analyze payload content and structure without execution. Identify signature-based patterns and static IOCs.
|
|
</p>
|
|
|
|
<div class="space-y-3">
|
|
<div class="flex items-center space-x-3 text-base text-gray-400">
|
|
<svg class="w-5 h-5 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
|
|
</svg>
|
|
<span>YARA Pattern Matching</span>
|
|
</div>
|
|
<div class="flex items-center space-x-3 text-base text-gray-400">
|
|
<svg class="w-5 h-5 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
|
|
</svg>
|
|
<span>CheckPlz</span>
|
|
</div>
|
|
<div class="flex items-center space-x-3 text-base text-gray-400">
|
|
<svg class="w-5 h-5 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
|
|
</svg>
|
|
<span>Stringnalyzer</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</button>
|
|
|
|
<!-- Dynamic Analysis - Enhanced warning states -->
|
|
<button onclick="selectAnalysisType('dynamic')" class="group text-left w-full">
|
|
<div class="p-6 rounded-xl border border-gray-800 hover:border-red-500/50 bg-gradient-to-br from-gray-900/50 to-black/30 transition-all duration-300 hover:shadow-lg">
|
|
<!-- Header Section -->
|
|
<div class="flex items-center space-x-4 mb-4">
|
|
<div class="p-3 bg-red-500/10 rounded-lg group-hover:bg-red-500/20 transition-colors">
|
|
<svg class="w-7 h-7 text-red-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"/>
|
|
<path d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
|
|
</svg>
|
|
</div>
|
|
|
|
<div class="flex items-center space-x-2">
|
|
<div>
|
|
<h5 class="text-lg font-medium text-gray-200 group-hover:text-white">Dynamic Analysis</h5>
|
|
<p class="text-base text-gray-400">Runtime behavior analysis</p>
|
|
</div>
|
|
|
|
<!-- Warning Icon with Tooltip -->
|
|
<div class="relative inline-block"
|
|
onmouseover="document.getElementById('dynamicTooltip').classList.remove('hidden')"
|
|
onmouseout="document.getElementById('dynamicTooltip').classList.add('hidden')">
|
|
<svg class="w-6 h-6 text-yellow-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/>
|
|
</svg>
|
|
<div id="dynamicTooltip" class="absolute bottom-full left-1/2 transform -translate-x-1/2 mb-3 hidden">
|
|
<div class="bg-yellow-500/10 border border-yellow-900/20 text-yellow-500 text-sm rounded-lg p-3 whitespace-nowrap shadow-xl">
|
|
Dynamic analysis will execute the payload
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<p class="text-base text-gray-400 group-hover:text-gray-300 mb-4">
|
|
Execute and monitor payload behavior in real-time with memory analysis.
|
|
</p>
|
|
|
|
<!-- Tools Section - Two Columns -->
|
|
<div class="grid grid-cols-2 gap-x-6">
|
|
<!-- Left Column -->
|
|
<div class="space-y-3">
|
|
<div class="flex items-center space-x-3 text-base text-gray-400">
|
|
<svg class="w-5 h-5 text-green-500 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
|
|
</svg>
|
|
<span>Yara Rules</span>
|
|
</div>
|
|
<div class="flex items-center space-x-3 text-base text-gray-400">
|
|
<svg class="w-5 h-5 text-green-500 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
|
|
</svg>
|
|
<span>Moneta</span>
|
|
</div>
|
|
<div class="flex items-center space-x-3 text-base text-gray-400">
|
|
<svg class="w-5 h-5 text-green-500 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
|
|
</svg>
|
|
<span>Hunt-Sleeping-Beacons</span>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Right Column -->
|
|
<div class="space-y-3">
|
|
<div class="flex items-center space-x-3 text-base text-gray-400">
|
|
<svg class="w-5 h-5 text-green-500 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
|
|
</svg>
|
|
<span>RedEdr</span>
|
|
</div>
|
|
<div class="flex items-center space-x-3 text-base text-gray-400">
|
|
<svg class="w-5 h-5 text-green-500 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
|
|
</svg>
|
|
<span>PE-Sieve</span>
|
|
</div>
|
|
<div class="flex items-center space-x-3 text-base text-gray-400">
|
|
<svg class="w-5 h-5 text-green-500 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
|
|
</svg>
|
|
<span>Patriot</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</button>
|
|
</div>
|
|
<!-- Add the command-line arguments input field -->
|
|
<div id="argsInputContainer" class="mt-6">
|
|
<label for="analysisArgs" class="block mb-2 text-gray-200 font-medium">
|
|
Command-line Arguments:
|
|
</label>
|
|
<input
|
|
type="text"
|
|
id="analysisArgs"
|
|
placeholder="Enter arguments separated by spaces"
|
|
class="w-full p-3 rounded-lg border border-gray-700 bg-gray-800 text-gray-300
|
|
focus:outline-none focus:ring-2 focus:ring-red-500
|
|
transition-colors duration-200"
|
|
/>
|
|
<p class="mt-2 text-sm text-gray-400">
|
|
Provide arguments for the payload (Dynamic Analysis).
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- File Information Card -->
|
|
<div class="bg-black/60 backdrop-blur-sm rounded-xl border border-gray-800 shadow-lg">
|
|
<div class="p-6">
|
|
<!-- Basic File Info -->
|
|
<div class="flex items-center justify-between mb-6 pb-6 border-b border-gray-800">
|
|
<div class="flex items-center space-x-4">
|
|
<div class="p-3 bg-red-500/10 rounded-lg">
|
|
<svg class="w-8 h-8 text-red-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<h3 id="fileName" class="text-lg font-medium text-gray-300"></h3>
|
|
<div class="flex items-center mt-1 space-x-3">
|
|
<span id="fileSize" class="text-base text-gray-400"></span>
|
|
<span class="text-gray-600">•</span>
|
|
<span id="fileType" class="text-base text-gray-400"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<button onclick="location.reload()" class="px-4 py-2 text-base text-red-500 border border-red-900/20 rounded-lg hover:bg-red-500/10 transition-colors">
|
|
Upload Another File
|
|
</button>
|
|
</div>
|
|
|
|
<!-- File Analysis Data -->
|
|
<div class="space-y-6">
|
|
<!-- Hash Information -->
|
|
<div class="grid grid-cols-2 gap-4">
|
|
<div class="bg-gray-900/30 rounded-lg p-4">
|
|
<div class="flex items-center justify-between mb-2">
|
|
<span class="text-base text-gray-300">MD5</span>
|
|
<button onclick="copyHash('md5Hash')" class="px-2 py-1 text-sm text-gray-400 hover:text-red-500 flex items-center space-x-1 hover:bg-red-500/10 rounded transition-colors">
|
|
<span>Copy</span>
|
|
<svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 5H6a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2v-1M8 5a2 2 0 002 2h2a2 2 0 002-2M8 5a2 2 0 012-2h2a2 2 0 012 2"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<div class="relative group">
|
|
<code id="md5Hash" class="text-base text-gray-300 font-mono block truncate"></code>
|
|
<div class="absolute hidden group-hover:block bg-gray-900 text-base text-gray-300 font-mono p-2 rounded-lg border border-gray-700 shadow-lg mt-1 left-0 z-10 break-all">
|
|
<span id="md5HashFull"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="bg-gray-900/30 rounded-lg p-4">
|
|
<div class="flex items-center justify-between mb-2">
|
|
<span class="text-base text-gray-300">SHA256</span>
|
|
<button onclick="copyHash('sha256Hash')" class="px-2 py-1 text-sm text-gray-400 hover:text-red-500 flex items-center space-x-1 hover:bg-red-500/10 rounded transition-colors">
|
|
<span>Copy</span>
|
|
<svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 5H6a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2v-1M8 5a2 2 0 002 2h2a2 2 0 002-2M8 5a2 2 0 012-2h2a2 2 0 012 2"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<div class="relative group">
|
|
<code id="sha256Hash" class="text-base text-gray-300 font-mono block truncate"></code>
|
|
<div class="absolute hidden group-hover:block bg-gray-900 text-base text-gray-300 font-mono p-2 rounded-lg border border-gray-700 shadow-lg mt-1 left-0 z-10 break-all">
|
|
<span id="sha256HashFull"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Enhanced Entropy Analysis -->
|
|
<div class="bg-gray-900/30 rounded-lg p-4">
|
|
<div class="flex items-center justify-between mb-4">
|
|
<span class="text-base text-gray-300">Entropy Analysis</span>
|
|
<span id="detectionRisk" class="px-3 py-1 text-sm rounded-full"></span>
|
|
</div>
|
|
<div class="space-y-4">
|
|
<div class="flex items-center justify-between">
|
|
<span class="text-sm text-gray-400">Overall Entropy</span>
|
|
<div id="fileEntropy" class="text-lg font-semibold text-gray-300"></div>
|
|
</div>
|
|
<div class="relative h-2 bg-gray-800 rounded-full overflow-hidden">
|
|
<div id="entropyBar" class="absolute h-full transition-all duration-300"></div>
|
|
</div>
|
|
<div id="entropyNotes" class="text-sm text-gray-400 space-y-1">
|
|
<!-- Populated by JS -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- File Basic Info -->
|
|
<div class="grid grid-cols-3 gap-4">
|
|
<div class="bg-gray-900/30 rounded-lg p-4">
|
|
<div class="text-base text-gray-300 mb-1">Type</div>
|
|
<div id="fileCategory" class="text-lg font-semibold text-gray-300"></div>
|
|
</div>
|
|
<div class="bg-gray-900/30 rounded-lg p-4">
|
|
<div class="text-base text-gray-300 mb-1">Upload Time</div>
|
|
<div id="uploadTime" class="text-lg font-semibold text-gray-300"></div>
|
|
</div>
|
|
<div class="bg-gray-900/30 rounded-lg p-4">
|
|
<div class="text-base text-gray-300 mb-1">Format</div>
|
|
<div id="fileFormat" class="text-lg font-semibold text-gray-300"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- PE Checksum Info -->
|
|
<div id="checksumInfo" class="bg-gray-900/30 rounded-lg p-4 mb-4">
|
|
<div class="flex items-center justify-between mb-4">
|
|
<span class="text-base text-gray-300">PE Checksum Analysis</span>
|
|
<span id="checksumStatus" class="px-3 py-1 text-sm rounded-full"></span>
|
|
</div>
|
|
<div class="grid grid-cols-2 gap-4">
|
|
<div>
|
|
<div class="text-sm text-gray-400 mb-1">Stored Checksum</div>
|
|
<div id="storedChecksum" class="text-base font-mono text-gray-300"></div>
|
|
</div>
|
|
<div>
|
|
<div class="text-sm text-gray-400 mb-1">Calculated Checksum</div>
|
|
<div id="calculatedChecksum" class="text-base font-mono text-gray-300"></div>
|
|
</div>
|
|
</div>
|
|
<div id="checksumNotes" class="mt-4 text-sm text-gray-400 space-y-1">
|
|
<!-- Populated by JS -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Suspicious Imports Analysis -->
|
|
<div id="suspiciousImports" class="bg-gray-900/30 rounded-lg p-4 mb-4 hidden">
|
|
<div class="flex items-center justify-between mb-4">
|
|
<span class="text-base text-gray-300">Suspicious Imports Analysis</span>
|
|
<span id="suspiciousImportsCount" class="px-3 py-1 text-sm bg-red-500/10 text-red-500 rounded-full">
|
|
<!-- Count populated by JS -->
|
|
</span>
|
|
</div>
|
|
<div id="suspiciousImportsList" class="space-y-4">
|
|
<!-- List populated by JS -->
|
|
</div>
|
|
<div class="border-t border-gray-800 pt-4 mt-4">
|
|
<div class="text-sm text-gray-400">
|
|
<div class="flex items-center space-x-2">
|
|
<svg class="w-4 h-4 text-yellow-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/>
|
|
</svg>
|
|
<span id="suspiciousImportsSummary"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- PE File Specific Info -->
|
|
<div id="peInfo" class="bg-gray-900/30 rounded-lg p-4 hidden">
|
|
<div class="space-y-6">
|
|
<div class="text-base text-gray-300 mb-2">Section Analysis</div>
|
|
<div id="sectionsList" class="space-y-4">
|
|
<!-- Populated by JS -->
|
|
</div>
|
|
<div class="border-t border-gray-800 pt-4">
|
|
<div class="text-base text-gray-300 mb-2">Detection Notes</div>
|
|
<div id="detectionNotes" class="space-y-2 text-sm text-gray-400">
|
|
<!-- Populated by JS -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Office File Specific Info -->
|
|
<div id="officeInfo" class="bg-gray-900/30 rounded-lg p-4 hidden">
|
|
<div class="space-y-4">
|
|
<div class="flex items-center justify-between">
|
|
<span class="text-base text-gray-300">Macro Analysis</span>
|
|
<span id="macroStatus" class="px-3 py-1 text-sm rounded-full"></span>
|
|
</div>
|
|
<div id="macroDetectionNotes" class="space-y-2 text-sm text-gray-400">
|
|
<!-- Populated by JS -->
|
|
</div>
|
|
<div id="macroInfo" class="text-sm text-gray-400">
|
|
<!-- Populated by JS -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Generic File Info -->
|
|
<div id="fileSpecificInfo" class="bg-gray-900/30 rounded-lg p-4 text-base text-gray-300">
|
|
<!-- Dynamically populated based on file type -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Toast Notifications -->
|
|
<div id="toastContainer" class="fixed bottom-4 right-4 space-y-2"></div>
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
<script src="{{ url_for('static', filename='js/upload.js') }}"></script>
|
|
{% endblock %}
|