Changeset ffd6bb5 in OpenWorkouts-current for ow/templates


Ignore:
Timestamp:
Feb 4, 2019, 5:48:44 PM (5 years ago)
Author:
Segundo Fdez <segun.2@…>
Branches:
current, feature/docs, master
Children:
d24a64a
Parents:
d52ba50
Message:

update profile header ui

File:
1 edited

Legend:

Unmodified
Added
Removed

  • ow/templates/profile.pt

    rd52ba50 rffd6bb5  
    1616    <div class="user-profile">
    1717      <div class="user-profile-account">
    18         <tal:c tal:condition="getattr(context, 'picture', None)">
    19           <img tal:attributes="src request.resource_path(context, 'picture')"
    20                width="450" />
    21         </tal:c>
    22         <h2>
    23             <tal:fullname tal:content="context.fullname"></tal:fullname>
    24         </h2>
    25         <p>
    26           <tal:has-nickname tal:condition="context.nickname">
    27               <tal:nickname tal:content="context.nickname"></tal:nickname>
    28           </tal:has-nickname> |
    29           <span><tal:email tal:content="context.email"></tal:email></span>
    30         </p>
    31 
    32         <div class="profile-bio" tal:content="getattr(context, 'bio', '')"></div>
    33 
     18        <div>
     19          <tal:c tal:condition="getattr(context, 'picture', None)">
     20            <img tal:attributes="src request.resource_path(context, 'picture')"
     21                 width="450" />
     22          </tal:c>
     23          <div>
     24            <h2>
     25                <tal:fullname tal:content="context.fullname"></tal:fullname>
     26            </h2>
     27            <p>
     28              <tal:has-nickname tal:condition="context.nickname">
     29                  <tal:nickname tal:content="context.nickname"></tal:nickname>
     30              </tal:has-nickname> |
     31              <span><tal:email tal:content="context.email"></tal:email></span>
     32            </p>
     33            <div class="profile-bio" tal:content="getattr(context, 'bio', '')"></div>
     34            <ul class="workout-options">
     35              <li><a href=""
     36                 tal:attributes="href request.resource_url(context, 'edit')"
     37                 i18n:translate="">edit profile</a></li>
     38              <li><a href=""
     39                 tal:attributes="href request.resource_url(context, 'passwd')"
     40                 i18n:translate="">change password</a></li>
     41            </ul>
     42          </div>
     43        </div>
    3444        <ul class="profile-data">
    3545          <li>
    36             <tal:t i18n:translate="">Gender:</tal:t>
     46            <span><tal:t i18n:translate="">Gender:</tal:t></span>
    3747            <tal:c tal:content="getattr(context, 'gender', '-')"></tal:c>
    3848          </li>
    3949          <li tal:define="birth_date getattr(context, 'birth_date', None)">
    40             <tal:t i18n:translate="">Birth date:</tal:t>
     50            <span><tal:t i18n:translate="">Birth date:</tal:t></span>
    4151            <tal:c tal:condition="birth_date"
    4252                   tal:content="birth_date.strftime('%d/%m/%Y')"></tal:c>
    … …  
    4454          </li>
    4555          <li>
    46             <tal:t i18n:translate="">Height:</tal:t>
     56            <span><tal:t i18n:translate="">Height:</tal:t></span>
    4757            <tal:c tal:content="getattr(context, 'height', '-')"></tal:c> meters
    4858          </li>
    4959          <li>
    50             <tal:t i18n:translate="">Weight:</tal:t>
     60            <span><tal:t i18n:translate="">Weight:</tal:t></span>
    5161            <tal:c tal:content="getattr(context, 'weight', '-')"></tal:c> kg
    5262          </li>
    5363        </ul>
    54         <ul class="workout-options">
    55           <li><a href=""
    56              tal:attributes="href request.resource_url(context, 'edit')"
    57              i18n:translate="">edit profile</a></li>
    58           <li><a href=""
    59              tal:attributes="href request.resource_url(context, 'passwd')"
    60              i18n:translate="">change password</a></li>
    61         </ul>
     64
    6265      </div>
    6366
    64       <div class="total-workouts">
    65         <tal:w tal:replace="context.num_workouts"></tal:w>
    66         <tal:t i18n:translate="">workouts</tal:t>
    67       </div>
     67      <div class="workout-content">
     68        <div class="workout-list">
     69          <div class="total-workouts">
     70            <tal:w tal:replace="context.num_workouts"></tal:w>
     71            <tal:t i18n:translate="">workouts</tal:t>
     72          </div>
    6873
    69       <div class="month-stats js-month-stats">
    70         <div class="svg-cotent">
    71           <svg width="800" height="180" viewBox="0 0 800 180"></svg>
    72         </div>
    73         <ul class="workout-options filters js-filters">
    74           <li><a href="#" class="js-distance is-active" i18n:translate="">distance</a></li>
    75           <li><a href="#" class="js-time" i18n:translate="">time</a></li>
    76           <li><a href="#" class="js-elevation" i18n:translate="">elevation</a></li>
    77         </ul>
     74          <div class="month-stats js-month-stats">
     75            <div class="svg-cotent">
     76              <svg width="900" height="180" viewBox="0 0 900 180"></svg>
     77            </div>
     78            <ul class="workout-options filters js-filters">
     79              <li><a href="#" class="js-distance is-active" i18n:translate="">distance</a></li>
     80              <li><a href="#" class="js-time" i18n:translate="">time</a></li>
     81              <li><a href="#" class="js-elevation" i18n:translate="">elevation</a></li>
     82            </ul>
    7883
    79         <ul class="workout-options switcher js-switcher">
    80           <li><a href="#" class="js-weekly" i18n:translate="">weekly</a></li>
    81           <li><a href="#" class="js-monthly is-active" i18n:translate="">monthly</a></li>
    82         </ul>
    83       </div>
     84            <ul class="workout-options switcher js-switcher">
     85              <li><a href="#" class="js-weekly" i18n:translate="">weekly</a></li>
     86              <li><a href="#" class="js-monthly is-active" i18n:translate="">monthly</a></li>
     87            </ul>
     88          </div>
    8489
    8590
    86       <tal:r tal:repeat="workout workouts">
     91          <tal:r tal:repeat="workout workouts">
    8792
    88         <a name="workouts"></a>
     93            <article class="workout-resume">
    8994
     95              <h2 class="workout-title">
     96                <a href="" tal:content="workout.title"
     97                   tal:attributes="href request.resource_url(workout)"></a>
     98              </h2>
    9099
    91         <article class="workout-resume">
     100              <ul class="workout-info">
     101                <li>
     102                  <tal:c tal:content="workout.start_in_timezone(context.timezone)"></tal:c>
     103                </li>
     104                <li>
     105                  <!--! use the properly formatted duration instead of the timedelta object -->
     106                  <tal:c tal:content="workout._duration"></tal:c>
     107                </li>
     108                <li tal:condition="workout.distance">
     109                  <tal:c tal:content="workout.rounded_distance"></tal:c> km
     110                </li>
     111              </ul>
    92112
    93           <h2 class="workout-title">
    94             <a href="" tal:content="workout.title"
    95                tal:attributes="href request.resource_url(workout)"></a>
    96           </h2>
     113              <ul class="workout-info" tal:define="hr workout.hr; cad workout.cad">
     114                <li tal:condition="hr">
     115                  <span i18n:translate="">HR (bpm)</span>:
     116                  <tal:c tal:content="hr['min']"></tal:c>
     117                  <tal:t i18n:translate="">Min.</tal:t>,
     118                  <tal:c tal:content="hr['avg']"></tal:c>
     119                  <tal:t i18n:translate="">Avg.</tal:t>,
     120                  <tal:c tal:content="hr['max']"></tal:c>
     121                  <tal:t i18n:translate="">Max.</tal:t>
     122                </li>
     123                <li tal:condition="cad">
     124                  <span i18n:translate="">Cad</span>:
     125                  <tal:c tal:content="cad['min']"></tal:c>
     126                  <tal:t i18n:translate="">Min.</tal:t>,
     127                  <tal:c tal:content="cad['avg']"></tal:c>
     128                  <tal:t i18n:translate="">Avg.</tal:t>,
     129                  <tal:c tal:content="cad['max']"></tal:c>
     130                  <tal:t i18n:translate="">Max.</tal:t>
     131                </li>
     132              </ul>
    97133
    98           <ul class="workout-info">
    99             <li>
    100               <tal:c tal:content="workout.start_in_timezone(context.timezone)"></tal:c>
    101             </li>
    102             <li>
    103               <!--! use the properly formatted duration instead of the timedelta object -->
    104               <tal:c tal:content="workout._duration"></tal:c>
    105             </li>
    106             <li tal:condition="workout.distance">
    107               <tal:c tal:content="workout.rounded_distance"></tal:c> km
    108             </li>
    109           </ul>
     134              <div class="workout-intro" tal:content="workout.notes"></div>
    110135
    111           <ul class="workout-info" tal:define="hr workout.hr; cad workout.cad">
    112             <li tal:condition="hr">
    113               <span i18n:translate="">HR (bpm)</span>:
    114               <tal:c tal:content="hr['min']"></tal:c>
    115               <tal:t i18n:translate="">Min.</tal:t>,
    116               <tal:c tal:content="hr['avg']"></tal:c>
    117               <tal:t i18n:translate="">Avg.</tal:t>,
    118               <tal:c tal:content="hr['max']"></tal:c>
    119               <tal:t i18n:translate="">Max.</tal:t>
    120             </li>
    121             <li tal:condition="cad">
    122               <span i18n:translate="">Cad</span>:
    123               <tal:c tal:content="cad['min']"></tal:c>
    124               <tal:t i18n:translate="">Min.</tal:t>,
    125               <tal:c tal:content="cad['avg']"></tal:c>
    126               <tal:t i18n:translate="">Avg.</tal:t>,
    127               <tal:c tal:content="cad['max']"></tal:c>
    128               <tal:t i18n:translate="">Max.</tal:t>
    129             </li>
    130           </ul>
     136              <div class="workout-map" tal:condition="workout.has_gpx">
     137                <a href="" tal:attributes="href request.resource_url(workout)">
     138                  <img src="" tal:attributes="src request.static_url(workout.map_screenshot);
     139                            alt workout.title; title workout.title">
     140                </a>
     141              </div>
    131142
    132           <div class="workout-intro" tal:content="workout.notes"></div>
     143            </article>
    133144
    134           <div class="workout-map" tal:condition="workout.has_gpx">
    135             <a href="" tal:attributes="href request.resource_url(workout)">
    136               <img src="" tal:attributes="src request.static_url(workout.map_screenshot);
    137                         alt workout.title; title workout.title">
    138             </a>
    139           </div>
    140 
    141         </article>
    142 
    143       </tal:r>
     145          </tal:r>
     146        </div>
     147      </div>
    144148    </div>
    145149
Note: See TracChangeset for help on using the changeset viewer.