Code style of domain details card.
This commit is contained in:
parent
d6a3a8f559
commit
381c6f656e
|
@ -32,22 +32,56 @@
|
||||||
<p class="service-description">Little description of what to be expected...</p>
|
<p class="service-description">Little description of what to be expected...</p>
|
||||||
|
|
||||||
{% for domain in domains %}
|
{% for domain in domains %}
|
||||||
<div class="row border mt-4">
|
<div class="card service-card">
|
||||||
<div class="col-12 bg-light">
|
<div class="card-header">
|
||||||
<h3>{{ domain.name }}</h3>
|
<div class="row">
|
||||||
</div>
|
<div class="col-md">
|
||||||
{% for service in "123"|make_list %}
|
<strong>{{ domain.name }}</strong>
|
||||||
<div class="card" style="width: 18rem;">
|
</div>
|
||||||
<div class="card-body">
|
<div class="col-md-8">
|
||||||
<h5 class="card-title">{% cycle 'Mail' 'Mailing list' 'Databases' %}</h5>
|
{% trans "view configuration" %} <strong class="fas fa-tools"></strong>
|
||||||
</div>
|
</div>
|
||||||
<img class="card-img-bottom" src="..." alt="Card image cap">
|
<div class="col-md text-right">
|
||||||
<div class="card-body">
|
{% trans "Expiration date" %}: <strong>{{ domain.expiration_date|date:"SHORT_DATE_FORMAT" }}</strong>
|
||||||
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's
|
</div>
|
||||||
content.</p>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div><!-- /card-header-->
|
||||||
|
<div class="card-body row text-center">
|
||||||
|
<div class="col-md-2 border-right">
|
||||||
|
<h4>{% trans "Mail" %}</h4>
|
||||||
|
<p class="card-text"><i class="fas fa-envelope fa-3x"></i></p>
|
||||||
|
<p class="card-text text-dark">
|
||||||
|
3 mail addresses created<br/>
|
||||||
|
<span class="text-warning">1 mail address left</span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-2 border-right">
|
||||||
|
<h4>{% trans "Mail list" %}</h4>
|
||||||
|
<p class="card-text"><i class="fas fa-mail-bulk fa-3x"></i></p>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-2 border-right">
|
||||||
|
<h4>{% trans "Databases" %}</h4>
|
||||||
|
<p class="card-text"><i class="fas fa-database fa-3x"></i></p>
|
||||||
|
<p class="card-text text-dark">
|
||||||
|
1 database created<br/>
|
||||||
|
20 MB of 45MB
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-2 border-right">
|
||||||
|
<h4>{% trans "Software as a Service" %}</h4>
|
||||||
|
<p class="card-text"><i class="fas fa-fire fa-3x"></i></p>
|
||||||
|
<p class="card-text text-dark">Nothing installed</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-4">
|
||||||
|
<h4>{% trans "Disk usage" %}</h4>
|
||||||
|
<p class="card-text"><i class="fas fa-hdd fa-3x"></i></p>
|
||||||
|
<div class="w-75 m-auto">
|
||||||
|
{% include "musician/components/usage_progress_bar.html" with detail=domain.usage %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% endfor card %}
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -55,6 +55,15 @@ class DashboardView(CustomContextMixin, UserTokenRequiredMixin, TemplateView):
|
||||||
'percent': 50,
|
'percent': 50,
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
|
for domain in raw_domains:
|
||||||
|
domain['usage'] = {
|
||||||
|
'usage': 300,
|
||||||
|
'total': 650,
|
||||||
|
'unit': 'MB',
|
||||||
|
'percent': 50,
|
||||||
|
}
|
||||||
|
|
||||||
# TODO(@slamora) update when backend supports notifications
|
# TODO(@slamora) update when backend supports notifications
|
||||||
notifications = []
|
notifications = []
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue