From: Rico Hoppe <rico.hoppe@ipfire.org>
Date: Fri, 1 Dec 2023 20:54:33 +0000 (+0000)
Subject: fireinfo/profile: updated the page
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=3b27a29d28853a2d4cfb10a79e7e4eb8583b8c4d;p=ipfire.org.git

fireinfo/profile: updated the page
---

diff --git a/src/templates/fireinfo/profile.html b/src/templates/fireinfo/profile.html
index 6c0da12e..d77e044e 100644
--- a/src/templates/fireinfo/profile.html
+++ b/src/templates/fireinfo/profile.html
@@ -2,154 +2,198 @@
 
 {% block title %}{{ _("Profile %s") % profile.public_id }}{% end block %}
 
-{% block content %}
-	<section class="section">
-		<div class="container">
-			<div class="columns">
-				<div class="column is-8">
-					<h1 class="title">{{ _("Profile") }}</h1>
-					<h5 class="title is-5">{{ profile.public_id }}</h5>
-				</div>
+{% block container %}
+	<section class="hero is-primary">
+		<div class="hero-body">
+			<div class="container">
+				<nav class="breadcrumb" aria-label="breadcrumbs">
+					<ul>
+						<li>
+							<a href="https://ipfire.org/">
+								Home
+							</a>
+						</li>
+						<li>
+							<a href="/">
+								{{ _("Fireinfo") }}
+							</a>
+						</li>
+						<li>
+							<a href="../profile/random">
+								{{ _("Random Profile") }}
+							</a>
+						</li>
+						<li class="is-active">
+							<a href="../profile/random">
+								{{ profile.public_id }}
+							</a>
+						</li>
+					</ul>
+				</nav>
+
+				<h1 class="title">{{ _("Profile") }}</h1>
+				<h4 class="subtitle is-4">{{ profile.public_id }}</h4>
 			</div>
 		</div>
 	</section>
 
-	<div class="container">
-				<div class="card mb-5">
-					<div class="card-body">
-						<div class="row">
-							<div class="col-12 col-sm-8 mb-4">
-								<h5 class="card-title mb-0">
-									{{ _("Running %s") % profile.system.release }}
-								</h5>
-
-								<small class="text-muted">
-									{{ _("Last update %s") % locale.format_date(profile.last_updated_at) }}
-								</small>
-							</div>
-
-							<div class="col-12 col-sm-4 text-center text-sm-end mb-4">
-								{% for zone in profile.network %}
-									{% if zone == "red" %}
-										<span class="badge bg-danger">{{ _("RED") }}</span>
-									{% elif zone == "green" %}
-										<span class="badge bg-success">{{ _("GREEN") }}</span>
-									{% elif zone == "orange" %}
-										<span class="badge bg-warning">{{ _("ORANGE") }}</span>
-									{% elif zone == "blue" %}
-										<span class="badge bg-info">{{ _("BLUE") }}</span>
-									{% end %}
-								{% end %}
-							</div>
-						</div>
+	<section class="hero is-light">
+		<div class="hero-body">
+			<div class="container">
+				<h4 class="title is-4">
+					{{ _("Running %s") % profile.system.release }}
+				</h4>
 
-						<dl class="row mb-0">
-							{% if profile.is_virtual() %}
-								<dt class="col-sm-3">{{ _("Hypervisor") }}</dt>
-								<dd class="col-sm-9">
-									{% if profile.hypervisor == "VMWare" %}
-										{{ _("VMware") }}
-									{% elif profile.hypervisor is None %}
-										{{ _("Unknown") }}
-									{% else %}
-										{{ profile.hypervisor }}
-									{% end %}
-								</dd>
-							{% elif profile.system %}
-								<dt class="col-sm-3">{{ _("System") }}</dt>
-								<dd class="col-sm-9">
-									{% if profile.system.vendor %}
-										{{ profile.system.vendor }}
-									{% end %}
+				<h5 class="title is-5">
+						{{ _("Last update %s") % locale.format_date(profile.last_updated_at) }}
+					</h5>
+				</div>
 
-									{% if profile.system.vendor and profile.system.model %}
-										&dash;
-									{% end %}
+				{% for zone in profile.network %}
+					{% if zone == "red" %}
+					<span class="tag is-danger">{{ _("RED") }}</span>
+					{% elif zone == "green" %}
+					<span class="tag is-success">{{ _("GREEN") }}</span>
+					{% elif zone == "orange" %}
+					<span class="tag is-warning">{{ _("ORANGE") }}</span>
+					{% elif zone == "blue" %}
+					<span class="tag is-info">{{ _("BLUE") }}</span>
+					{% end %}
+				{% end %}
+			</div>
+		</div>
+	</section>
 
-									{% if profile.system.model %}
-										{{ profile.system.model }}
-									{% end %}
-								</dd>
+	<div class="container">
+		<section class="section">
+			<div class="block">
+				{% if profile.is_virtual() %}
+					<div class="columns">
+						<div class="column is-3">{{ _("Hypervisor") }}</div>
+						<div class="column is-9">
+							{% if profile.hypervisor == "VMWare" %}
+								{{ _("VMware") }}
+							{% elif profile.hypervisor is None %}
+								{{ _("Unknown") }}
+							{% else %}
+								{{ profile.hypervisor }}
 							{% end %}
-
-							{% if profile.processor %}
-								<dt class="col-sm-3">{{ _("Processor") }}</dt>
-								<dd class="col-sm-9">
-									<p class="card-text mb-0">{{ profile.processor }}</p>
-
-									<ul class="list-inline mb-0">
-										{% for cap, available in profile.processor.capabilities %}
-											<li class="list-inline-item">
-												<span class="badge {% if available %}bg-success{% else %}bg-light{% end %}">
-													{% if cap == "64bit" %}
-														{{ _("64 bit") }}
-													{% elif cap == "aes" %}
-														{{ _("AES-NI") }}
-													{% elif cap == "nx" %}
-														{{ _("NX") }}
-													{% elif cap == "pae" %}
-														{{ _("PAE") }}
-													{% elif cap == "rdrand" %}
-														{{ _("RDRAND") }}
-													{% elif cap == "virt" %}
-														{{ _("VT-x/AMD-V") }}
-													{% end %}
-												</span>
-											</li>
-										{% end %}
-									</ul>
-								</dd>
+						</div>
+					</div>
+					{% elif profile.system %}
+					<div class="columns">
+						<div class="column is-3">{{ _("System") }}</div>
+						<div class="column is-9">
+							{% if profile.system.vendor %}
+								{{ profile.system.vendor }}
 							{% end %}
 
-							{% if profile.memory %}
-								<dt class="col-md-3">{{ _("Memory") }}</dt>
-								<dd class="col-md-9">
-									{{ format_size(profile.memory) }}
-								</dd>
+							{% if profile.system.vendor and profile.system.model %}
+								&dash;
 							{% end %}
 
-							{% if profile.system.storage %}
-								<dt class="col-md-3">{{ _("Storage") }}</dt>
-								<dd class="col-md-9">
-									{{ format_size(profile.system.storage) }}
-								</dd>
+							{% if profile.system.model %}
+								{{ profile.system.model }}
 							{% end %}
+						</div>
+					</div>
+				{% end %}
+			</div>
 
-							{% if profile.location %}
-								<dt class="col-md-3">{{ _("Location") }}</dt>
-								<dd class="col-md-9">
-									{{ profile.location_string }}
-								</dd>
+			<div class="block">
+				{% if profile.processor %}
+					<div class="columns">
+						<div class="column is-3">{{ _("Processor") }}</div>
+						<div class="column is-9">
+							<p>{{ profile.processor }}</p>
+
+							{% for cap, available in profile.processor.capabilities %}
+								<span class="tag {% if available %}is-success{% else %}is-light{% end %}">
+									{% if cap == "64bit" %}
+										{{ _("64 bit") }}
+									{% elif cap == "aes" %}
+										{{ _("AES-NI") }}
+									{% elif cap == "nx" %}
+										{{ _("NX") }}
+									{% elif cap == "pae" %}
+										{{ _("PAE") }}
+									{% elif cap == "rdrand" %}
+										{{ _("RDRAND") }}
+									{% elif cap == "virt" %}
+										{{ _("VT-x/AMD-V") }}
+									{% end %}
+								</span>
 							{% end %}
+						</div>
+					</div>
+				{% end %}
+			</div>
 
-							{% if profile.system.language %}
-								<dt class="col-md-3">{{ _("Language") }}</dt>
-								<dd class="col-md-9">
-									{{ format_language_name(profile.system.language) }}
-								</dd>
-							{% end %}
-						</dl>
+			<div class="block">
+				{% if profile.memory %}
+					<div class="columns">
+						<div class="column is-3">{{ _("Memory") }}</div>
+						<div class="column is-9">
+							{{ format_size(profile.memory) }}
+						</div>
 					</div>
+				{% end %}
+			</div>
 
-					{% if profile.devices %}
-						{% module FireinfoDeviceTable([d for d in profile.devices if d.is_showable()], embedded=True) %}
-					{% end %}
-				</div>
+			<div class="block">
+				{% if profile.system.storage %}
+					<div class="columns">
+						<div class="column is-3">{{ _("Storage") }}</div>
+						<div class="column is-9">
+							{{ format_size(profile.system.storage) }}
+						</div>
+					</div>
+				{% end %}
+			</div>
 
-				<h5>{{ _("Signature images") }}</h5>
+			<div class="block">
+				{% if profile.location %}
+					<div class="columns">
+						<div class="column is-3">{{ _("Location") }}</div>
+						<div class="column is-9">
+							{{ profile.location_string }}
+						</div>
+					</div>
+				{% end %}
+			</div>
 
-				<ul class="list-unstyled">
-					{% for i in range(1) %}
-						<li class="list-inline-item">
-							<!-- XXX need some bbcode here -->
-							<a href="//i-use.ipfire.org/profile/{{ profile.public_id }}/{{ i }}.png">
-								<img class="img-fluid" src="//i-use.ipfire.org/profile/{{ profile.public_id }}/{{ i }}.png"
-									alt="{{ _("Signature image") }}" />
-							</a>
-						</li>
-					{% end %}
-				</ul>
+			<div class="block">
+				{% if profile.system.language %}
+					<div class="columns">
+						<div class="column is-3">{{ _("Language") }}</div>
+						<div class="column is-9">
+							{{ format_language_name(profile.system.language) }}
+						</div>
+					</div>
+				{% end %}
 			</div>
-		</div>
+		</section>
+
+		<section class="section">
+			{% if profile.devices %}
+				{% module FireinfoDeviceTable([d for d in profile.devices if d.is_showable()], embedded=True) %}
+			{% end %}
+		</section>
+
+		<section class="section">
+			<h5>{{ _("Signature images") }}</h5>
+
+			<ul class="list-unstyled">
+				{% for i in range(1) %}
+					<li class="list-inline-item">
+						<!-- XXX need some bbcode here -->
+						<a href="//i-use.ipfire.org/profile/{{ profile.public_id }}/{{ i }}.png">
+							<img class="img-fluid" src="//i-use.ipfire.org/profile/{{ profile.public_id }}/{{ i }}.png"
+								alt="{{ _("Signature image") }}" />
+						</a>
+					</li>
+				{% end %}
+			</ul>
+		</section>
 	</div>
 {% end block %}