C3L/C3L-Membership-Online-Form Changeset - eac8ab19899c · Chaos Computer Club Lëtzebuerg Projects

Changeset - eac8ab19899c

Parent rev.

Child rev.

[Not reviewed]

default

0 2 0

Dennis Fink - 3 years ago 2022-05-11 11:37:47
dennis.fink@c3l.lu

Use flex for the menu

2 files changed with 15 insertions and 11 deletions:

c3l_membership/static/style.css

c3l_membership/templates/index.html

0 comments (0 inline, 0 general)

c3l_membership/static/style.css

➞

Show inline comments

@@ @@ -6,48 +6,54 @@ body { @@
+}
 .pure-img {
   max-width: 50%;
   margin-left: auto;
   margin-right: auto;
+}
 p {
   text-align: justify;
+}
 .pure-menu-horizontal {
   text-align: right;
   padding-bottom: 1rem;
+}
 .form-error {
   background: #f98691;
   border: 1px solid #dc3545;
   border-radius: 4px;
   padding: 0.5em 0.6em;
   font-weight: 550;
   color: #3d0309;
+}
 .field-error {
   background: #f98691;
   border: 1px solid #dc3545;
   color: #3d0309;
+}
 .text-xlarge {
   font-size: 125%;
+}
 .text-justify {
   text-align: justify;
+}
 legend {
   font-weight: bold;
   font-size: 1.25em;
+}
 h4 {
   margin-bottom: 0.5em;
+}
 .menu {
   display: flex;
   justify-content: space-between;
   margin-bottom: 1.5em;
+}

c3l_membership/templates/index.html

➞

Show inline comments

 <!DOCTYPE html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>{% trans %}C3L Membership Application{% endtrans %}</title>
     <link rel="stylesheet" href="{{ url_for('static', filename='pure-min.css') }}" />
     <link rel="stylesheet" href="{{ url_for('static', filename='grids-responsive-min.css') }}" />
     <link rel="stylesheet" href="{{ url_for('static', filename='flag-icons.css') }}" />
     <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}" />
   </head>
   <body>
     <div class="pure-g">
       <div class="pure-u-md-1-3"></div>
       <div class="pure-u-1-1 pure-u-md-1-3">
         <div class="pure-menu pure-menu-horizontal">
           <ul class="pure-menu-list">
             <li class="pure-menu-item">
         <div class="menu">
           <div>
               <a href="{{ url_for("root.index", lang_code="en") }}" class="pure-menu-link"><span class="fi fi-gb"></span> English</a>
             </li>
             <li class="pure-menu-item">
           </div>
           <div>
               <a href="{{ url_for("root.index", lang_code="lb") }}" class="pure-menu-link"><span class="fi fi-lu"></span> Lëtzebuergesch</a>
             </li>
             <li class="pure-menu-item">
           </div>
           <div>
               <a href="{{ url_for("root.index", lang_code="de") }}" class="pure-menu-link"><span class="fi fi-de"></span> Deutsch</a>
             </li>
             <li class="pure-menu-item">
           </div>
           <div>
               <a href="{{ url_for("root.index", lang_code="fr") }}" class="pure-menu-link"><span class="fi fi-fr"></span> Français</a>
             </li>
           </ul>
           </div>
         </div>
       </div>
       <div class="pure-u-md-1-3"></div>
     </div>
     <div class="pure-g">
       <div class="pure-u-md-1-3"></div>
       <div class="pure-u-1-1 pure-u-md-1-3">
         <img src="{{ url_for('static', filename='images/logo.png') }}" class="pure-img" />
         <h1>{% trans %}Membership Application{% endtrans %}</h1>
         <h2>{% trans %}How to use this form?{% endtrans %}</h2>
         <p>{% trans %}Fill out this form and click on "Become a member". Afterwards you will be presented with a PDF, which you have to sign and send to info@c3l.lu or bring it to one of our next events. Print it or save it to your local hardware, because we don't save a copy on our servers for data protection reasons!{% endtrans %}</p>
         {% if form.errors %}
           {% for fieldname, errors in form.errors.items() %}
             {% for error in errors %}
               <p class="form-error">{{ fieldname }} - {{ error }}</p>
             {% endfor %}
           {% endfor %}
         {% endif %}
         {% if crypto_error %}
           <p class="form-error">{% trans %}Couldn't fetch conversion rate for cryptocurrencies. Please try again later or use another payment option!{% endtrans %}</p>
         {% endif %}
         <form class="pure-form pure-form-stacked" method="POST" action="{{ url_for('root.index', lang_code=g.lang_code) }}">
           <fieldset>
             {{ form.hidden_tag() }}
             <legend>{% trans %}Required information{% endtrans %}</legend>
             <div class="pure-g">
               <div class="pure-u-1-1">
                 <b>{{ form.username.label }}</b>
                 {{ form.username(required=True, class="pure-input-1 field-error" if form.username.errors else "pure-input-1") }}
               </div>
             </div>
             <div class="pure-g">
               <div class="pure-u-1-1">
                 <b>{{ form.email.label }}</b>
                 {{ form.email(required=True, class="pure-input-1 field-error" if form.email.errors else "pure-input-1") }}
               </div>
             </div>
             <div class="pure-g">
               <div class="pure-u-1-1">
                 <b>{{ form.fullname.label }}</b>
                 {{ form.fullname(required=True, class="pure-input-1 field-error" if form.fullname.errors else "pure-input-1") }}
               </div>
             </div>
             <div class="pure-g">
               <div class="pure-u-1-1">
                 <h3>{{ form.membership.label }}</h3>
                 {% for option in form.membership %}
                   <label for="{{ option.id }}" class="pure-radio pure-u-1-1">

0 comments (0 inline, 0 general)