wip
This commit is contained in:
parent
3b2f1db4ce
commit
5c16964b76
47 changed files with 2080 additions and 1053 deletions
|
@ -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 %}
|
Loading…
Add table
Add a link
Reference in a new issue