This commit is contained in:
pika 2025-03-30 23:42:24 +02:00
parent 3b2f1db4ce
commit 5c16964b76
47 changed files with 2080 additions and 1053 deletions

View file

@ -155,6 +155,69 @@
</div>
</div>
</div>
<!-- Applications in this Subnet Section -->
<div class="row mt-3">
<div class="col-12">
<div class="card glass-card">
<div class="card-header">
<h3 class="card-title">Applications in this Subnet</h3>
</div>
<div class="card-body">
{% if subnet_apps %}
<div class="app-grid">
{% for app in subnet_apps %}
<div class="app-card">
<div class="app-card-header">
<div class="app-card-title">
<h4>{{ app.name }}</h4>
<span class="text-muted small">on {{ app.server.hostname }} ({{ app.server.ip_address }})</span>
</div>
<div class="app-card-actions">
<a href="{{ url_for('dashboard.app_view', app_id=app.id) }}" class="btn btn-sm btn-outline-primary">
View
</a>
</div>
</div>
<div class="app-card-body markdown-content">
{% if app.documentation %}
{{ app.documentation|markdown|truncate(300, true) }}
<a href="{{ url_for('dashboard.app_view', app_id=app.id) }}" class="text-primary">Read more</a>
{% else %}
<p class="text-muted">No documentation available for this application.</p>
{% endif %}
</div>
</div>
{% endfor %}
</div>
{% else %}
<div class="empty">
<div class="empty-icon">
<span class="ti ti-app-window"></span>
</div>
<p class="empty-title">No applications found</p>
<p class="empty-subtitle text-muted">
No applications are running on servers in this subnet.
</p>
</div>
{% endif %}
</div>
</div>
</div>
</div>
<!-- Update the usage progress bar section -->
<div class="mb-3">
<div class="form-label">Usage</div>
<div class="progress mb-2">
<div class="progress-bar" style="width: {{ (used_ips / total_ips * 100) if total_ips > 0 else 0 }}%"
role="progressbar"></div>
</div>
<div class="d-flex justify-content-between">
<span>{{ used_ips }} used</span>
<span>{{ total_ips }} total</span>
</div>
</div>
</div>
<!-- Delete Confirmation Modal -->
@ -185,4 +248,65 @@
</div>
</div>
</div>
<style>
.glass-card {
background-color: rgba(255, 255, 255, 0.03);
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.1);
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}
[data-bs-theme="light"] .glass-card {
background-color: rgba(255, 255, 255, 0.7);
border: 1px solid rgba(0, 0, 0, 0.08);
}
.app-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
gap: 1.5rem;
}
.app-card {
border-radius: 10px;
overflow: hidden;
transition: transform 0.2s, box-shadow 0.2s;
background-color: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
}
[data-bs-theme="light"] .app-card {
background-color: rgba(255, 255, 255, 0.9);
border: 1px solid rgba(0, 0, 0, 0.08);
}
.app-card:hover {
transform: translateY(-3px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
.app-card-header {
padding: 1rem;
display: flex;
justify-content: space-between;
align-items: flex-start;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
[data-bs-theme="light"] .app-card-header {
border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.app-card-title h4 {
margin: 0 0 0.25rem 0;
font-size: 1.25rem;
}
.app-card-body {
padding: 1rem;
max-height: 200px;
overflow: hidden;
}
</style>
{% endblock %}