]> git.ipfire.org Git - ipfire.org.git/commitdiff
Merge remote-tracking branch 'rico/new-design' into new-design
authorMichael Tremer <michael.tremer@ipfire.org>
Wed, 20 Dec 2023 15:41:38 +0000 (15:41 +0000)
committerMichael Tremer <michael.tremer@ipfire.org>
Wed, 20 Dec 2023 15:41:38 +0000 (15:41 +0000)
12 files changed:
src/templates/auth/modules/password.html
src/templates/auth/modules/password.js
src/templates/base.html
src/templates/fireinfo/admin.html
src/templates/fireinfo/driver.html
src/templates/fireinfo/modules/table-devices-and-groups.html
src/templates/fireinfo/modules/table-devices.html
src/templates/fireinfo/processors.html
src/templates/fireinfo/profile.html
src/templates/fireinfo/vendor.html
src/templates/fireinfo/vendors.html
src/templates/static/sitemap.html

index ca921b23f1249e65ffa8fa2c71f0418376de2812..53978e308dd9e666b00829d9368b4e0ca1d98004 100644 (file)
@@ -1,32 +1,38 @@
-<fieldset>
-       <div class="mb-3">
-               <label class="form-label">{{ _("New Password") }}</label>
+<div class="field">
+       <div class="block">
+               <label class="label">{{ _("New Password") }}</label>
 
-               <input type="password" class="form-control" name="password1"
-                       id="password1" placeholder="{{ _("New Password") }}" required
-                       data-user-input="{% if account %}{{ " ".join((account.first_name, account.last_name)) }}{% end %}">
+               <div class="control">
+                       <input type="password" class="input" name="password1"
+                               id="password1" placeholder="{{ _("New Password") }}" required
+                               data-user-input="{% if account %}{{ " ".join((account.first_name, account.last_name)) }}{% end %}">
+               </div>
        </div>
+</div>
 
-       <div class="mb-3">
-               <input type="password" class="form-control" name="password2"
-                       id="password2" placeholder="{{ _("Repeat Password") }}" required>
+<div class="field">
+       <div class="block">
+               <div class="control">
+                       <input type="password" class="input" name="password2"
+                               id="password2" placeholder="{{ _("Repeat Password") }}" required>
+               </div>
 
                <div id="password-mismatch" class="invalid-feedback">
                        {{ _("Passwords do not match") }}
                </div>
        </div>
+</div>
 
-       <div class="mb-3">
-               <div class="progress">
-                       <div class="progress-bar" id="password-strength" role="progressbar"></div>
-               </div>
+<div class="block">
+       <div class="progress">
+               <div class="progress" id="password-strength" role="progressbar"></div>
        </div>
+</div>
 
-       <div class="mb-3 text-muted">
-               <p class="mb-0" id="password-warning"></p>
+<div class="block">
+       <p class="help" id="password-warning"></p>
 
-               <small class="form-text">
-                       <ul id="password-feedback"></ul>
-               </small>
-       </div>
-</fieldset>
+       <small>
+               <ul id="password-feedback"></ul>
+       </small>
+</div>
index 8235fc733ebbfdd4b0d1e66decfb11ed3523a903..43cadf79b464fe1d1311cf287c0f5ab285610234 100644 (file)
@@ -29,7 +29,7 @@ $(function() {
 
                        // Clear all previous backgrounds
                        progress.removeClass([
-                               "bg-success", "bg-warning", "bg-danger"
+                               "is-success", "is-warning", "is-danger"
                        ]);
 
                        // Make progress bar show in the right colour
@@ -37,15 +37,15 @@ $(function() {
                                case 0:
                                case 1:
                                case 2:
-                                       progress.addClass("bg-danger");
+                                       progress.addClass("is-danger");
                                        break;
 
                                case 3:
-                                       progress.addClass("bg-warning");
+                                       progress.addClass("is-warning");
                                        break;
 
                                case 4:
-                                       progress.addClass("bg-success");
+                                       progress.addClass("is-success");
                                        break;
                        }
 
index 3174959e403c7bb26bc1c75fedce2ed5208ea12a..e4cb85768d71f42b985491fdf378dcbc5863bf99 100644 (file)
                                                                {% end %}
                                                        </div>
                                                {% elif hostname.startswith("fireinfo.") %}
-                                                       <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar"
-                                                                       aria-controls="navbar" aria-expanded="false" aria-label="Toggle navigation">
-                                                               <span class="fas fa-bars"></span>
-                                                       </button>
-
-                                                       <div class="collapse navbar-collapse" id="navbar">
-                                                               <ul class="navbar-nav ml-auto">
-                                                                       {% if current_user and current_user.is_staff() %}
-                                                                               <li class="nav-item">
-                                                                                       <a class="nav-link {% if request.path.startswith("/admin") %}is-active{% end %}" href="/admin">
-                                                                                               {{ _("Admin") }}
-                                                                                       </a>
-                                                                               </li>
-                                                                       {% end %}
+                                                       <div class="navbar-end">
+                                                               {% if current_user and current_user.is_staff() %}
+                                                                       <a class="navbar-item is-tab {% if request.path.startswith("/admin") %}is-active{% end %}" href="/admin">
+                                                                               {{ _("Admin") }}
+                                                                       </a>
+                                                               {% end %}
 
-                                                                       <li class="nav-item">
-                                                                               <a class="nav-link {% if request.path.startswith("/vendors") %}is-active{% end %}" href="/vendors">
-                                                                                       {{ _("Vendors") }}
-                                                                               </a>
-                                                                       </li>
-                                                               </ul>
+                                                               <a class="navbar-item is-tab {% if request.path.startswith("/vendors") %}is-active{% end %}" href="/vendors">
+                                                                       {{ _("Vendors") }}
+                                                               </a>
                                                        </div>
                                                {% elif hostname.startswith("nopaste.") %}
                                                        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar"
index dc095e7e367de7b3e77b235ffc1614693bfed3ab..bc2676c011044355f7e24fa254cdf10bcb70da41 100644 (file)
@@ -3,6 +3,32 @@
 {% block title %}{{ _("Admin") }}{% end block %}
 
 {% block container %}
+       <section class="hero is-primary is-fullheight-with-navbar">
+               <div class="hero-body">
+                       <div class="container">
+                               <nav class="breadcrumb is-medium" aria-label="breadcrumbs">
+                                       <ul>
+                                               <li>
+                                                       <a href="https://ipfire.org/">
+                                                               Home
+                                                       </a>
+                                               </li>
+                                               <li>
+                                                       <a href="/">
+                                                               {{ _("Fireinfo") }}
+                                                       </a>
+                                               </li>
+                                               <li class="is-active">
+                                                       <a href="#">
+                                                               Admin
+                                                       </a>
+                                               </li>
+                                       </ul>
+                               </nav>
+                       </div>
+               </div>
+       </section>
+
        <section class="section">
                <div class="container">
                        <div class="columns">
index f24c8fab455b74732e0d8164f576826fe6df527f..9013a8207bdbcd62f282228f1cc29b54e091f78e 100644 (file)
@@ -3,17 +3,48 @@
 {% block title %}{{ driver }}{% end block %}
 
 {% block container %}
+       <section class="hero is-primary">
+               <div class="hero-body">
+                       <div class="container">
+                               <nav class="breadcrumb is-medium" aria-label="breadcrumbs">
+                                       <ul>
+                                               <li>
+                                                       <a href="https://ipfire.org/">
+                                                               Home
+                                                       </a>
+                                               </li>
+                                               <li>
+                                                       <a href="/">
+                                                               {{ _("Fireinfo") }}
+                                                       </a>
+                                               </li>
+                                               <li>
+                                                       <a href="#">
+                                                               {{ _("Drivers") }}
+                                                       </a>
+                                               </li>
+                                               <li class="is-active">
+                                                       <a href="#">
+                                                               {{ driver }}
+                                                       </a>
+                                               </li>
+                                       </ul>
+                               </nav>
+                       </div>
+               </div>
+       </section>
+
        <section class="section">
                <div class="container">
                        <h1 class="title">{{ driver }}</h1>
-
-                       <p>
-                               {{ _("All known devices run by %s") % driver }}
-                       </p>
+                               <h2 class="title is-2">{{ _("All known devices run by %s") % driver }}</h2>
+                       </div>
                </div>
        </section>
 
-       <div class="container">
-               {% module FireinfoDeviceTable(devices) %}
-       </div>
+       <section class="section">
+               <div class="container">
+                       {% module FireinfoDeviceTable(devices) %}
+               </div>
+       </section>
 {% end block %}
index 868cedeb8a5f240c0a0e45384097d4ad3f7b6b0a..5325984bd2a971db598ef43a07e3f49dcf5a9c41 100644 (file)
@@ -1,7 +1,9 @@
 {% for group, devices in groups %}
        <section class="section">
-               <h4 class="title is-4">{{ group }}</h4>
+               <div class="container">
+                       <h4 class="title is-4">{{ group }}</h4>
 
-               {% module FireinfoDeviceTable(devices, show_group=False) %}
-       </div>
+                       {% module FireinfoDeviceTable(devices, show_group=False) %}
+               </div>
+       </section>
 {% end %}
index 6f054310cb29255740ac9b03e312f5817b5a60d4..28deefb41ce9070bfa131e5c66c127f6c0f2b28c 100644 (file)
@@ -1,22 +1,33 @@
-<ul class="list-group {% if embedded %}list-group-flush{% end %}">
-       {% for d in sorted(devices) %}
-               <div class="list-group-item flex-column align-items-start">
-                       <p class="small text-muted mb-0">
-                               {% if show_group %}{{ d.cls }}{% end %}
+{% for d in sorted(devices) %}
+       <div class="level">
+               <div class="level-left">
+                       <div class="level-item">
+                               <p>
+                                       {% if show_group %}{{ d.cls }}{% end %}
 
-                               {% if d.subsystem == "usb" %}
-                                       <span class="fab fa-usb"></span>
-                               {% end %}
-                       </p>
-
-                       <p class="mb-0">
-                               <a href="/vendors/{{ d.subsystem }}/{{ d.vendor }}">{{ d.vendor_string }}</a>
-                               &dash; {{ d.model_string or "N/A (%s)" % d.model }}
+                                       {% if d.subsystem == "usb" %}
+                                               <span class="fab fa-usb"></span>
+                                       {% end %}
+                               </p>
+                       </div>
+                       <div class="level-item">
+                               <p>
+                                       {% if d.vendor_string %}
+                                               <a href="/vendors/{{ d.subsystem }}/{{ d.vendor }}">{{ d.vendor_string }}</a>
+                                       {% else %}
+                                               <p>N/A</p>
+                                       {% end %}
 
+                                       &dash; {{ d.model_string or "N/A (%s)" % d.model }}
+                               </p>
+                       </div>
+                       <div class="level-item">
                                {% if d.driver %}
-                                       (<a href="/drivers/{{ d.driver }}">{{ d.driver }}</a>)
+                                       <span class="tag">
+                                               <a href="/drivers/{{ d.driver }}">{{ d.driver }}</a>
+                                       </span>
                                {% end %}
-                       </p>
+                       </div>
                </div>
-       {% end %}
-</ul>
+       </div>
+{% end %}
index 5e8db319f9649ad93db89374ff69460cb3554606..e8528f3ec1f61aa7d4d284628972bea9dba9d1e4 100644 (file)
                        {% for arch in sorted(map) %}
                                <h2 class="title is-2">{{ arch }}</h2>
 
-                               <dl class="row">
-                                       {% for flag in sorted(map[arch], key=lambda f: map[arch][f], reverse=True) %}
-                                               {% set p = map[arch][flag] %}
-
-                                               <dt class="col-sm-4">
+                               {% for flag, percentage in flags[platform] %}
+                                       <div class="columns">
+                                               <div class="column is-2">
                                                        {% if flag == "aes" %}
                                                                {{ _("AES Instruction Set") }}
                                                        {% elif flag == "avx" %}
                                                        {% else %}
                                                                {{ flag }}
                                                        {% end %}
-                                               </dt>
+                                               </div>
 
-                                               <dd class="col-sm-8">
+                                               <div class="column">
                                                        {% if p >= 0.95 %}
                                                                {% module ProgressBar(p, "success") %}
                                                        {% elif p >= 0.5 %}
                                                        {% else %}
                                                                {% module ProgressBar(p, "danger") %}
                                                        {% end %}
-                                               </dd>
-                                       {% end %}
-                               </dl>
+                                               </div>
+                                       </div>
+                               {% end %}
                        {% end %}
                </div>
        </section>
index 6c0da12ecef72780d31942c68da36d9966312c84..d77e044e4e8fb2be0b52f88ea031108e786996d3 100644 (file)
 
 {% 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 %}
index 1862bc806906e45d2f02314fb4fa421dd6c71c5f..5ae32ee2650d8bebb218ed0f5bfbca2d0db82632 100644 (file)
@@ -2,17 +2,36 @@
 
 {% block title %}{{ vendor_name }}{% end block %}
 
-{% block content %}
-       <section>
-               <div class="container">
-                       <div class="row">
-                               <div class="col-12">
-                                       <h1>{{ vendor_name }}</h1>
+{% block container %}
+       <section class="hero is-primary">
+               <div class="hero-body">
+                       <div class="container">
+                               <nav class="breadcrumb is-medium" aria-label="breadcrumbs">
+                                       <ul>
+                                               <li>
+                                                       <a href="https://ipfire.org/">
+                                                               Home
+                                                       </a>
+                                               </li>
+                                               <li>
+                                                       <a href="/">
+                                                               {{ _("Fireinfo") }}
+                                                       </a>
+                                               </li>
+                                               <li>
+                                                       <a href="/vendors">
+                                                               {{ _("Vendors") }}
+                                                       </a>
+                                               </li>
+                                               <li class="is-active">
+                                                       <a href="#">
+                                                               {{ vendor_name }}
+                                                       </a>
+                                               </li>
+                                       </ul>
+                               </nav>
 
-                                       <p>
-                                               {{ _("All known devices by %s") % vendor_name }}
-                                       </p>
-                               </div>
+                               <h2 class="title is-2">{{ _("All known devices by %s") % vendor_name }}</h2>
                        </div>
                </div>
        </section>
index 77b6bd4ee0ff58f5054102a1b1e44740e1bb67ce..491b1d2a0cbabaa5f0ddc9414cfef7370eb99ccc 100644 (file)
@@ -3,30 +3,46 @@
 {% block title %}{{ _("Vendors") }}{% end block %}
 
 {% block container %}
-       <section>
-               <div class="container">
-                       <div class="row">
-                               <div class="col-12">
-                                       <h1>{{ _("Vendors") }}</h1>
-                               </div>
+       <section class="hero is-primary">
+               <div class="hero-body">
+                       <div class="container">
+                               <nav class="breadcrumb is-medium" aria-label="breadcrumbs">
+                                       <ul>
+                                               <li>
+                                                       <a href="https://ipfire.org/">
+                                                               Home
+                                                       </a>
+                                               </li>
+                                               <li>
+                                                       <a href="/">
+                                                               {{ _("Fireinfo") }}
+                                                       </a>
+                                               </li>
+                                               <li class="is-active">
+                                                       <a href="#">
+                                                               {{ _("Vendors") }}
+                                                       </a>
+                                               </li>
+                                       </ul>
+                               </nav>
+
+                               <h1 class="title is-1">{{ _("Vendors") }}</h1>
                        </div>
                </div>
        </section>
 
-       <div class="container">
-               <div class="row justify-content-center">
-                       <div class="col-12 col-md-6">
-                               <dl class="row">
-                                       {% for vendor in sorted(vendors) %}
-                                               <dt class="col-sm-9">{{ vendor }}</dt>
-                                               <dd class="col-sm-3">
-                                                       {% for subsystem, vendor_id in sorted(vendors[vendor]) %}
-                                                               <a href="/vendors/{{ subsystem }}/{{ vendor_id }}">{{ subsystem.upper() }}</a>
-                                                       {% end %}
-                                               </dd>
-                                       {% end %}
-                               </dl>
-                       </div>
+       <section class="section">
+               <div class="container">
+                       {% for vendor in sorted(vendors) %}
+                               <div class="columns">
+                                       <div class="column is-4">{{ vendor }}</div>
+                                       <div class="column is-3">
+                                               {% for subsystem, vendor_id in sorted(vendors[vendor]) %}
+                                                       <a href="/vendors/{{ subsystem }}/{{ vendor_id }}">{{ subsystem.upper() }}</a>
+                                               {% end %}
+                                       </div>
+                               </div>
+                       {% end %}
                </div>
-       </div>
+       </section>
 {% end block %}
index 5bf4ca4dd7776c7ef78890a434abaeae35f9dc0b..e836629b93ff0bab0dab0453771d007a8c5c1844 100644 (file)
                                        <div>
                                                <p class="heading">social.ipfire.org</p>
                                                <p class="title">
-                                                       <a href="https://mail.ipfire.org">
+                                                       <a href="https://social.ipfire.org">
                                                                {{ _("Mastodon") }}
                                                        </a>
                                                </p>