]> 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, 2 Aug 2023 13:39:52 +0000 (13:39 +0000)
committerMichael Tremer <michael.tremer@ipfire.org>
Wed, 2 Aug 2023 13:39:52 +0000 (13:39 +0000)
src/templates/auth/register-success.html
src/templates/base.html
src/templates/downloads/thank-you.html
src/templates/users/edit.html

index e8b1b204486f988cb57407e1db85dc977316b606..7c2e47c1b84c7a351272a903fa69648d1f108245 100644 (file)
@@ -3,18 +3,25 @@
 {% block title %}{{ _("Thank You") }}{% end block %}
 
 {% block content %}
-       <div class="row justify-content-center my-5">
-               <div class="col-12 col-md-6">
-                       <div class="card bg-success text-white p-md-5">
-                               <div class="card-body text-center">
-                                       <span class="fas fa-check fa-5x my-4"></span>
+<section class="section">
+       <div class="container">
+               <div class="columns is-centered">
+                       <div class="column is-one-third">
+                               <h1 class="title is-1">
+                                       IPFire<span class="has-text-primary">_</span>
+                               </h1>
+                               <h4 class="subtitle is-4">
+                                       {{ _("Your account has been created.") }}
+                                       {{ _("Please check your email for next steps.") }}
+                               </h4>
 
-                                       <p class="lead">
-                                               {{ _("Your account has been created.") }}
-                                               {{ _("Please check your email for next steps.") }}
+                               <div class="block">
+                                       <p class="is-size-5">
+                                               <span class="fas fa-check fa-5x my-4"></span>
                                        </p>
                                </div>
                        </div>
                </div>
        </div>
+</section>
 {% end block %}
index e8f9101ca792d4c74aefc72cced9ab01f5b87252..1e69dddbb9053011f25c5b2c71bf350fd6f3dc0c 100644 (file)
@@ -20,7 +20,7 @@
                {% block head %}{% end block %}
        </head>
 
-       <body>
+       <body class="is-flex is-flex-direction-column">
                <nav class="navbar" role="navigation" aria-label="main navigation">
                        <div class="container">
                                <div class="navbar-brand">
                        </div>
                </nav>
 
-               {% block container %}
-                       <div class="container">
-                               {% block content %}{% end block %}
-                       </div>
-               {% end block %}
+               <div class="is-flex-grow-1 is-flex-shrink-0">
+                       {% block container %}
+                               <div class="container">
+                                       {% block content %}{% end block %}
+                               </div>
+                       {% end block %}
+               </div>
 
                {% block footer %}
-                       <footer class="footer">
+                       <footer class="footer is-flex-shrink-0">
                                <div class="container">
                                        <div class="columns">
                                                <div class="column is-two-fifths">
                                                                                has-text-black has-text-weight-bold" href="/register">
                                                                        JOIN NOW
                                                                </a>
+                                                               <a class="button is-primary is-outlined  is-medium
+                                                                               has-text-black has-text-weight-bold" href="/login">
+                                                                       LOG IN
+                                                               </a>
                                                        {% end %}
                                                </div>
 
                <script src="{{ static_url("js/site.js") }}"></script>
                {% block javascript %}{% end block %}
        </body>
-</html>
+</html>
\ No newline at end of file
index 1293efec28d987fd673aa63caf28218420eee5e4..e971235f25ea268cd3718228e3c5c0b846c994a5 100644 (file)
                                        <div class="block">
                                                <p class="download-path"></p>
                                        </div>
+                               </div>
+                       </div>
+               </div>
+       </section>
+
+       <section class="section">
+               <div class="container">
+                       <div class="block">
+                               <div class="columns is-centered">
+                                       <div class="column is-8 has-text-centered">
+                                               <div class="columns">
+                                                       <div class="column is-half">
+                                                               <h4 class="title is-4">Installation Guide</h4>
 
-                                       <div class="columns is-centered">
-                                               <div class="column is-4">
-                                                       <div class="block">
-                                                               <a class="button is-primary is-fullwidth is-medium has-text-weight-bold" href="https://ipfire.org/donate">
-                                                                       DONATE
-                                                               </a>
+                                                               <div class="block">
+                                                                       <p>
+                                                                               Check out our Docs to get more detailed instructions!
+                                                                       </p>
+                                                               </div>
+
+                                                               <div class="block">
+                                                                       <div class="columns is-centered">
+                                                                               <div class="column is-4">
+                                                                                       <div class="block">
+                                                                                               <a class="button is-primary is-fullwidth is-medium has-text-weight-bold" href="/docs">
+                                                                                                       DOCS
+                                                                                               </a>
+                                                                                       </div>
+                                                                               </div>
+                                                                       </div>
+                                                               </div>
                                                        </div>
-                                               </div>
-                                       </div>
+                                                       <div class="column">
+                                                               <h4 class="title is-4">Donate</h4>
 
-                                       <div class="block"> <!-- wofür? -->
-                                               <section>
-                                                       XXX
-                                               </section>
+                                                               <div class="block">
+                                                                       <p>
+                                                                               If you appreciate our work, you can donate here
+                                                                       </p>
+                                                               </div>
+
+                                                               <div class="block">
+                                                                       <div class="columns is-centered">
+                                                                               <div class="column is-4">
+                                                                                       <div class="block">
+                                                                                               <a class="button is-primary is-fullwidth is-medium has-text-weight-bold" href="https://ipfire.org/donate">
+                                                                                                       DONATE
+                                                                                               </a>
+                                                                                       </div>
+                                                                               </div>
+                                                                       </div>
+                                                               </div>
+                                                       </div>
+                                               </div>
                                        </div>
                                </div>
                        </div>
index 5c4d4e78944d21d2aee0a287455a2f4070276772..0235b6363add7982ae1efdcc2742b39cf0843c75 100644 (file)
 {% block title %}{{ account }} - {{ _("Edit") }}{% end block %}
 
 {% block container %}
-       <div class="header">
-               <div class="container">
-                       <h1>{{ _("Edit Profile") }}</h1>
-
-                       <p class="text-muted">
-                               {{ account }}
-                       </p>
+       <section class="hero is-dark">
+               <div class="hero-body">
+                       <div class="container">
+                               <nav class="breadcrumb is-medium" aria-label="breadcrumbs">
+                                       <ul>
+                                               <li>
+                                                       <a href="/">
+                                                               {{ _("Home") }}
+                                                       </a>
+                                               </li>
+                                               <li>
+                                                       <a href="/users">
+                                                               {{ _("Users") }}
+                                                       </a>
+                                               </li>
+                                               <li>
+                                                       <a href="/users/{{ account.uid }}">
+                                                               {{ account }}
+                                                       </a>
+                                               </li>
+                                               <li class="is-active">
+                                                       <a href="#" aria-current="page">
+                                                               Edit
+                                                       </a>
+                                               </li>
+                                       </ul>
+                               </nav>
+
+                               <h1 class="title is-1">{{ _("Edit Profile") }}</h1>
+                               <h6 class="subtitle is-6">{{ account }} | {{ account.uid }}</h6>
+                       </div>
                </div>
-       </div>
+       </section>
 
        <div class="container">
-               <section>
+               <section class="section">
                        <form method="POST" action="" enctype="multipart/form-data">
                                {% raw xsrf_form_html() %}
 
-                               <div class="row mb-3">
-                                       <div class="col-12 col-sm-6">
-                                               <label class="form-label">{{ _("First Name") }}</label>
+                               <div class="block">
+                                       <div class="columns is-5">
+                                               <div class="column is-4">
+                                                       <label class="label">{{ _("First Name") }}</label>
 
-                                               <input type="text" class="form-control" name="first_name"
-                                                       placeholder="{{ _("First Name") }}" value="{{ account.first_name }}" required>
-                                       </div>
+                                                       <input type="text" class="input" name="first_name"
+                                                               placeholder="{{ _("First Name") }}" value="{{ account.first_name }}" required>
+                                               </div>
 
-                                       <div class="col-12 col-sm-6">
-                                               <label class="form-label">{{ _("Last Name") }}</label>
+                                               <div class="column is-4">
+                                                       <label class="label">{{ _("Last Name") }}</label>
 
-                                               <input type="text" class="form-control" name="last_name"
-                                                       placeholder="{{ _("Last Name") }}" value="{{ account.last_name }}" required>
-                                       </div>
-                               </div>
+                                                       <input type="text" class="input" name="last_name"
+                                                               placeholder="{{ _("Last Name") }}" value="{{ account.last_name }}" required>
+                                               </div>
 
-                               <div class="mb-3">
-                                       <label class="form-label">{{ _("Nickname") }} ({{ _("optional") }})</label>
+                                               <div class="column is-4">
+                                                       <label class="label">{{ _("Nickname") }} ({{ _("optional") }})</label>
 
-                                       <input type="text" class="form-control" name="nickname"
-                                               placeholder="{{ _("Nickname") }}" value="{{ account.nickname or "" }}">
+                                                       <input type="text" class="input" name="nickname"
+                                                               placeholder="{{ _("Nickname") }}" value="{{ account.nickname or "" }}">
+                                               </div>
+                                       </div>
                                </div>
 
-                               <div class="mb-3">
-                                       <label class="form-label">{{ _("Address") }}</label>
+                               <div class="block">
+                                       <div class="columns">
+                                               <div class="column is-4">
+                                                       <label class="label">{{ _("Address") }}</label>
 
-                                       <textarea type="text" class="form-control" name="street" rows="3"
-                                               placeholder="{{ _("Address") }}">{{ account.street or "" }}</textarea>
-                               </div>
+                                                       <textarea type="text" class="textarea" name="street" rows="3"
+                                                               placeholder="{{ _("Address") }}">{{ account.street or "" }}</textarea>
+                                               </div>
+                                       </div>
 
-                               <div class="row mb-3">
-                                       <div class="col-12 col-sm-6">
-                                               <label class="form-label">{{ _("City") }}</label>
+                                       <div class="columns">
+                                               <div class="column is-4">
+                                                       <label class="label">{{ _("City") }}</label>
 
-                                               <input type="text" class="form-control" name="city"
-                                                       placeholder="{{ _("City") }}" value="{{ account.city }}">
-                                       </div>
+                                                       <input type="text" class="input" name="city"
+                                                               placeholder="{{ _("City") }}" value="{{ account.city }}">
+                                               </div>
 
-                                       <div class="col-12 col-sm-6">
-                                               <label class="form-label">{{ _("Postal Code") }}</label>
+                                               <div class="column is-4">
+                                                       <label class="label">{{ _("Postal Code") }}</label>
 
-                                               <input type="text" class="form-control" name="postal_code"
-                                                       placeholder="{{ _("Postal Code") }}" value="{{ account.postal_code }}">
+                                                       <input type="text" class="input" name="postal_code"
+                                                               placeholder="{{ _("Postal Code") }}" value="{{ account.postal_code }}">
+                                               </div>
                                        </div>
                                </div>
 
-                               <div class="mb-3">
-                                       <label class="form-label">{{ _("Country") }}</label>
+                               <div class="block">
+                                       <div class="columns">
+                                               <div class="column is-4">
+                                                       <label class="label">{{ _("Country") }}</label>
 
-                                       <select class="form-control" name="country_code">
-                                               <option value="">{{ _("- Please Select -") }}</option>
+                                                       <div class="select">
+                                                               <select name="country_code">
+                                                                       <option>{{ _("- Please Select -") }}</option>
 
-                                               {% for c in countries %}
-                                                       <option value="{{ c.alpha2 }}" {% if account.country_code == c.alpha2 %}selected{% end %}>{{ c.name }}</option>
-                                               {% end %}
-                                       </select>
+                                                                       {% for c in countries %}
+                                                                               <option value="{{ c.alpha2 }}" {% if account.country_code == c.alpha2 %}selected{% end %}>{{ c.name }}</option>
+                                                                       {% end %}
+                                                               </select>
+                                                         </div>
+                                               </div>
+                                       </div>
                                </div>
 
-                               <fieldset>
-                                       <legend>{{ _("Tell Us Who You Are") }}</legend>
+                               <div class="block">
+                                       <h4 class="title is-4">{{ _("Tell Us Who You Are") }}</h4>
 
-                                       <div class="mb-3" id="description">
-                                               <textarea type="text" class="form-control" name="description" rows="5"
+                                       <div class="columns" id="description">
+                                               <div class="column is-4">
+                                                       <textarea type="text" class="textarea" name="description" rows="5"
                                                        placeholder="{{ _("Tell Us Who You Are") }}">{{ account.description or "" }}</textarea>
 
-                                               <small class="form-text text-muted">
-                                                       {{ _("You can use Markdown syntax as you know it from the IPFire Wiki") }}
-                                               </small>
+                                                       <p class="help">
+                                                               {{ _("You can use Markdown syntax as you know it from the IPFire Wiki") }}
+                                                       </p>
+                                               </div>
                                        </div>
 
-                                       <div class="mb-3" id="avatar">
-                                               <label class="form-label">{{ _("Avatar") }}</label>
-
-                                               <input type="file" class="form-control-file" name="avatar">
-
-                                               <small class="form-text text-muted">
-                                                       {{ _("Upload a new avatar") }}
-                                               </small>
+                               <div class="block">
+                                       <div class="columns" id="avatar">
+                                               <div class="column is-4">
+                                                       <div class="file">
+                                                               <label class="file-label">
+                                                                       <input class="file-input" type="file" name="avatar">
+                                                                       <span class="file-cta">
+                                                                               <span class="file-icon">
+                                                                                       <i class="fas fa-upload"></i>
+                                                                               </span>
+                                                                               <span class="file-label">
+                                                                                       {{ _("Upload a new avatar") }}
+                                                                               </span>
+                                                                       </span>
+                                                               </label>
+                                                         </div>
+                                               </div>
                                        </div>
-                               </fieldset>
+                               </div>
 
                                {% if account.has_mail() %}
-                                       <fieldset>
-                                               <legend>{{ _("Email") }}</legend>
-
-                                               <div class="mb-3">
-                                                       <label class="form-label">{{ _("Forward Emails") }}</label>
-
-                                                       <input type="mail" class="form-control" name="mail_routing_address"
-                                                               placeholder="{{ _("Email Address") }}" value="{{ account.mail_routing_address or "" }}">
-
-                                                       <small class="form-text text-muted">
-                                                               {{ _("All emails will be forwarded to this email address") }}
-                                                       </small>
+                                       <div class="block">
+                                               <div class="columns">
+                                                       <div class="column is-4">
+                                                               <label class="label">{{ _("Email") }}</label>
+
+                                                               <div class="field-body">
+                                                                       <div class="field">
+                                                                               <p class="control">
+                                                                                       <input type="mail" class="input" name="mail_routing_address"
+                                                                                       placeholder="{{ _("Email Address") }}" value="{{ account.mail_routing_address or "" }}">
+                                                                               </p>
+                                                                       </div>
+                                                               </div>
+
+                                                               <p class="help">
+                                                                       {{ _("All emails will be forwarded to this email address") }}
+                                                               </p>
+                                                       </div>
                                                </div>
-                                       </fieldset>
+                                       </div>
                                {% end %}
 
-                               <fieldset>
-                                       <legend>{{ _("Telephone") }}</legend>
+                               <div class="block">
+                                       <div class="columns">
+                                               <div class="column is-4">
+                                                       <label class="label">{{ _("Telephone") }}</label>
 
-                                       <div class="mb-3">
-                                               <label class="form-label">{{ _("Phone Numbers") }}</label>
+                                                       <textarea type="text" class="textarea" name="phone_numbers" rows="3"
+                                                               placeholder="{{ _("Phone Numbers") }}">{{ "\n".join((format_phone_number_to_e164(n) for n in account.phone_numbers)) }}</textarea>
 
-                                               <textarea type="text" class="form-control" name="phone_numbers" rows="3"
-                                                       placeholder="{{ _("Phone Numbers") }}">{{ "\n".join((format_phone_number_to_e164(n) for n in account.phone_numbers)) }}</textarea>
 
-                                               <small class="form-text text-muted">
-                                                       {{ _("Enter your landline and mobile phone numbers") }}
-                                               </small>
-                                       </div>
+                                                       <p class="help">
+                                                               {{ _("Enter your landline and mobile phone numbers") }}
+                                                       </p>
+                                               </div>
 
-                                       {% if account.has_sip() %}
-                                               <div class="mb-3">
-                                                       <label class="form-label">{{ _("Forward Calls") }}</label>
+                                               {% if account.has_sip() %}
+                                                       <div class="column is-4">
+                                                               <label class="label">{{ _("Forward Calls") }}</label>
 
-                                                       <input type="text" class="form-control" name="sip_routing_address"
-                                                               placeholder="{{ _("SIP URI or Phone Number") }}" value="{{ account.sip_routing_address or "" }}">
+                                                               <input type="text" class="input" name="sip_routing_address"
+                                                                       placeholder="{{ _("SIP URI or Phone Number") }}" value="{{ account.sip_routing_address or "" }}">
 
-                                                       <small class="form-text text-muted">
-                                                               {{ _("All calls will be forwarded to this phone number or SIP URI") }}
-                                                       </small>
+                                                               <p class="help">
+                                                                       {{ _("All calls will be forwarded to this phone number or SIP URI") }}
+                                                               </p>
+                                                       </div>
+                                               {% end %}
+                                       </div>
+
+                               <div class="block">
+                                       <div class="columns">
+                                               <div class="column is-4">
+                                                       <input class="button is-primary is-fullwidth is-outlined is-medium has-text-weight-bold" type="submit" value="{{ _("SAVE") }}">
                                                </div>
-                                       {% end %}
-                               </fieldset>
+                                       </div>
 
-                               <div class="d-grid">
-                                       <input class="btn btn-primary" type="submit" value="{{ _("Save") }}">
                                </div>
                        </form>
                </section>