removed some tables from the user profile page

5 files changed, 242 insertions, 214 deletions

diff --git a/askbot/media/style/style.css b/askbot/media/style/style.css
index ae63fa36..b5a76686 100644
--- a/askbot/media/style/style.css
+++ b/askbot/media/style/style.css
@@ -627,9 +627,6 @@ input[type="submit"].searchBtn {
 .users-page input[type="submit"].searchBtn {
   margin-top: 1px;
 }
-table.openid td {
-  padding: 0 10px 5px 0;
-}
 .ask-page input[type="submit"].searchBtn {
   display: none;
 }
@@ -3002,6 +2999,22 @@ a:hover.medal {
   padding: 10px 0px 10px 0px;
   font-family: 'Open Sans Condensed', Arial, sans-serif;
 }
+.user-profile-page .up-votes,
+.user-profile-page .down-votes {
+  display: inline-block;
+  font-size: 18px;
+  font-weight: bold;
+  height: 30px;
+  padding-left: 27px;
+  line-height: 22px;
+  margin: 0 15px 0 2px;
+}
+.user-profile-page .up-votes {
+  background: url(../images/vote-arrow-up-on.png) no-repeat;
+}
+.user-profile-page .down-votes {
+  background: url(../images/vote-arrow-down-on.png) no-repeat;
+}
 .user-profile-page .inputs {
   margin-top: 10px;
   margin-bottom: 10px;
@@ -3422,8 +3435,29 @@ label.retag-error {
   float: left;
 }
 .user-info-table {
-  margin-bottom: 10px;
+  margin: 10px 0;
   border-spacing: 0;
+  display: table;
+}
+.user-info-table .col1,
+.user-info-table .col2,
+.user-info-table .col3 {
+  display: table-cell;
+  vertical-align: top;
+}
+.user-info-table .col1 {
+  width: 140px;
+  text-align: center;
+}
+.user-info-table .col2 {
+  padding: 0 0 0 10px;
+  width: 400px;
+}
+.user-info-table .col3 {
+  width: 460px;
+}
+.user-info-table .gravatar {
+  margin: 0;
 }
 /* todo: remove this hack? */
 .user-stats-table .narrow {
@@ -3799,9 +3833,6 @@ p.signup_p {
   text-align: right;
   padding-right: 5px;
 }
-.user-info-table .gravatar {
-  margin: 0;
-}
 #responses {
   clear: both;
   line-height: 18px;
diff --git a/askbot/media/style/style.less b/askbot/media/style/style.less
index 54753952..7472eb9a 100644
--- a/askbot/media/style/style.less
+++ b/askbot/media/style/style.less
@@ -3118,6 +3118,23 @@ a:hover.medal {
         font-family:@main-font;
     }
 
+    .up-votes,
+    .down-votes {
+        display: inline-block;
+        font-size: 18px;
+        font-weight: bold;
+        height: 30px;
+        padding-left: 27px;
+        line-height: 22px;
+        margin: 0 15px 0 2px;
+    }
+    .up-votes {
+        background: url(../images/vote-arrow-up-on.png) no-repeat;
+    }
+    .down-votes {
+        background: url(../images/vote-arrow-down-on.png) no-repeat;
+    }
+
     .inputs {
         margin-top: 10px; 
         margin-bottom: 10px; 
@@ -3574,8 +3591,30 @@ label.retag-error {
 }
 
 .user-info-table {
-    margin-bottom: 10px;
+    margin: 10px 0;
     border-spacing: 0;
+    display: table;
+
+    .col1,
+    .col2,
+    .col3 {
+        display: table-cell;
+        vertical-align: top;
+    }
+    .col1 {
+        width: 140px;
+        text-align: center;
+    }
+    .col2 {
+        padding: 0 0 0 10px;
+        width: 400px;
+    }
+    .col3 {
+        width: 460px;
+    }
+    .gravatar {
+        margin:0;
+    }
 }
 
 /* todo: remove this hack? */
@@ -4034,10 +4073,6 @@ p.signup_p {
 }
 
 
-.user-info-table .gravatar {
-    margin:0;
-}
-
 #responses {
     clear:both;
     line-height:18px;
diff --git a/askbot/templates/user_profile/macros.html b/askbot/templates/user_profile/macros.html
index ac573553..9e334e8b 100644
--- a/askbot/templates/user_profile/macros.html
+++ b/askbot/templates/user_profile/macros.html
@@ -13,12 +13,7 @@
     </h2>
     {% endspaceless %}
     <div class="user-stats-table">
-        <table class="tags">
-            <tr>
-                <td valign="top">
-                {{ macros.tag_list_widget(tag_names, deletable = False) }}
-                </td>
-            </tr>
-        </table>
+        {{ macros.tag_list_widget(tag_names, deletable = False) }}
+        <div class="clearfix"></div>
     </div>
 {% endmacro %}
diff --git a/askbot/templates/user_profile/user_info.html b/askbot/templates/user_profile/user_info.html
index 6c20f1f4..9786d4ec 100644
--- a/askbot/templates/user_profile/user_info.html
+++ b/askbot/templates/user_profile/user_info.html
@@ -1,130 +1,126 @@
 <!-- user_info.html -->
 {% import "macros.html" as macros %}
-<table class="user-info-table">
-    <tr>
-        <td style="vertical-align:top;text-align:center;">
-            <div class='avatar'>
-                {{ macros.gravatar(view_user, 128) }}
-                {% if request.user == view_user %}
-                    <p><a 
-                        {% if support_custom_avatars %}
-                            href="{% url avatar_change %}"
-                        {% else %}
-                            href="{% url faq %}#gravatar"
-                        {% endif %}
-                    >{% trans %}change picture{% endtrans %}</a></p>
+<div class="user-info-table">
+    <div class="col1">
+        <div class='avatar'>
+            {{ macros.gravatar(view_user, 128) }}
+            {% if request.user == view_user %}
+                <p><a 
                     {% if support_custom_avatars %}
-                    <p><a 
-                        href="{% url avatar_delete %}"
-                        >{% trans %}remove{% endtrans %}</a>
-                    </p>
+                        href="{% url avatar_change %}"
+                    {% else %}
+                        href="{% url faq %}#gravatar"
                     {% endif %}
+                >{% trans %}change picture{% endtrans %}</a></p>
+                {% if support_custom_avatars %}
+                <p><a 
+                    href="{% url avatar_delete %}"
+                    >{% trans %}remove{% endtrans %}</a>
+                </p>
                 {% endif %}
-            </div>
-            {% if can_show_karma %}
-                <div class="scoreNumber">{{view_user.reputation|intcomma}}</div>
-                <p><b style="color:#777;">{% trans %}karma{% endtrans %}</b></p>
             {% endif %}
-            {% if user_follow_feature_on %}
-                {{ macros.follow_user_toggle(visitor = request.user, subject = view_user) }}
-            {% endif %}
-        </td>
-        <td width="360" style="padding-left:5px;vertical-align: top;">
-            <table class="user-details">
-                {% if request.user == view_user %}
-                <tr>
-                    <td class="user-profile-tool-links" align="left" colspan="2">
-                        <a href="{% url edit_user view_user.id %}">
-                            {% trans %}update profile{% endtrans %}
+        </div>
+        {% if can_show_karma %}
+            <div class="scoreNumber">{{view_user.reputation|intcomma}}</div>
+            <p><b style="color:#777;">{% trans %}karma{% endtrans %}</b></p>
+        {% endif %}
+        {% if user_follow_feature_on %}
+            {{ macros.follow_user_toggle(visitor = request.user, subject = view_user) }}
+        {% endif %}
+    </div>
+    <div class="col2">
+        <table class="user-details">
+            {% if request.user == view_user %}
+            <tr>
+                <td class="user-profile-tool-links" align="left" colspan="2">
+                    <a href="{% url edit_user view_user.id %}">
+                        {% trans %}update profile{% endtrans %}
+                    </a>
+                    {% if settings.USE_ASKBOT_LOGIN_SYSTEM and request.user == view_user and settings.ALLOW_ADD_REMOVE_LOGIN_METHODS %}
+                        | <a href="{{ settings.LOGIN_URL }}?next={{ settings.LOGIN_URL }}">
+                            {% trans %}manage login methods{% endtrans %}
                         </a>
-                        {% if settings.USE_ASKBOT_LOGIN_SYSTEM and request.user == view_user and settings.ALLOW_ADD_REMOVE_LOGIN_METHODS %}
-                            | <a href="{{ settings.LOGIN_URL }}?next={{ settings.LOGIN_URL }}">
-                                {% trans %}manage login methods{% endtrans %}
-                            </a>
-                        {% endif %}
-                    </td>
-                </tr>  
-                {% endif %}
-                <tr>
-                    <th colspan="2" align="left">
-                    <h3>{{user_status_for_display}}</h3>
-                    </th>
-                </tr>
-                {% if view_user.real_name %}
-                <tr>
-                    <td>{% trans %}real name{% endtrans %}</td>
-                    <td><b>{{view_user.real_name}}</b></td>
-                </tr>
-                {% endif %}
-                {% if settings.GROUPS_ENABLED %}
-                <tr>
-                    <td>{% trans %}groups{% endtrans %}</td>
-                    <td>
-                        <div id="user-groups">
-                            <table id="groups-list">
-                                {% for group in user_groups %}
-                                <tr>
-                                    {{ macros.user_group(group, groups_membership_info[group.id]) }}
-                                </tr>
-                                {% endfor %}
-                            </table>
-                            <div class="clearfix"></div>
-                            <a id="add-group">{% trans %}add group{% endtrans %}</a>
-                        </div>
-                    </td>
-                </tr>
-                {% endif %}
-                <tr>
-                    <td>{% trans %}member since{% endtrans %}</td>
-                    <td><strong>{{ macros.timeago(view_user.date_joined) }}</strong></td>
-                </tr>
-                {% if view_user.last_seen %}
-                <tr>
-                    <td>{% trans %}last seen{% endtrans %}</td>
-                    <td><strong title="{{ view_user.last_seen }}">{{ macros.timeago(view_user.last_seen) }}</strong></td>
-                </tr>
-                {% endif %}
-                {% if view_user.website and (not view_user.is_blocked()) %}
-                <tr>
-                    <td>{% trans %}website{% endtrans %}</td>
-                    <td>{{ macros.user_website_link(view_user, max_display_length = 30) }}</td>
-                </tr>
-                {% endif  %}
-                {% if request.user == view_user and 
-                    settings.TWITTER_SECRET and 
-                    settings.TWITTER_KEY and 
-                    settings.ENABLE_SHARING_TWITTER 
-                %}
-                    {% include "user_profile/twitter_sharing_controls.html" %}
-                {% endif %}
-                {% if view_user.location or view_user.country %}
-                <tr>
-                    <td>{% trans %}location{% endtrans %}</td>
-                    <td>{{ macros.user_full_location(view_user) }}</td>
-                </tr>
-                {% endif %}
-                {% if view_user.date_of_birth %}
-                <tr>
-                <!--todo  - redo this with whole sentence translation -->
-                    <td>{% trans %}age{% endtrans %}</td>
-                    <td>{% trans age=view_user.date_of_birth|get_age%}{{ age }} years old{% endtrans %}</td>
-                </tr>
-                {% endif %}
-                {% if votes_today_left %}
-                <tr>
-                    <td>{% trans %}todays unused votes{% endtrans %}</td>
-                    <td><strong class="darkred">{{ votes_today_left }}</strong> {% trans %}votes left{% endtrans %}</td>
-                </tr>
-                {% endif %}
-            </table>
-        </td>
-        <td width="380">
-            <div class="user-about">
-            {% if view_user.about and (not view_user.is_blocked()) %}
-                {{view_user.about|linebreaks}}
+                    {% endif %}
+                </td>
+            </tr>  
+            {% endif %}
+            <tr>
+                <th colspan="2" align="left">
+                <h3>{{user_status_for_display}}</h3>
+                </th>
+            </tr>
+            {% if view_user.real_name %}
+            <tr>
+                <td>{% trans %}real name{% endtrans %}</td>
+                <td><b>{{view_user.real_name}}</b></td>
+            </tr>
+            {% endif %}
+            {% if settings.GROUPS_ENABLED %}
+            <tr>
+                <td>{% trans %}groups{% endtrans %}</td>
+                <td>
+                    <div id="user-groups">
+                        <table id="groups-list">
+                            {% for group in user_groups %}
+                            <tr>
+                                {{ macros.user_group(group, groups_membership_info[group.id]) }}
+                            </tr>
+                            {% endfor %}
+                        </table>
+                        <div class="clearfix"></div>
+                        <a id="add-group">{% trans %}add group{% endtrans %}</a>
+                    </div>
+                </td>
+            </tr>
+            {% endif %}
+            <tr>
+                <td>{% trans %}member since{% endtrans %}</td>
+                <td><strong>{{ macros.timeago(view_user.date_joined) }}</strong></td>
+            </tr>
+            {% if view_user.last_seen %}
+            <tr>
+                <td>{% trans %}last seen{% endtrans %}</td>
+                <td><strong title="{{ view_user.last_seen }}">{{ macros.timeago(view_user.last_seen) }}</strong></td>
+            </tr>
+            {% endif %}
+            {% if view_user.website and (not view_user.is_blocked()) %}
+            <tr>
+                <td>{% trans %}website{% endtrans %}</td>
+                <td>{{ macros.user_website_link(view_user, max_display_length = 30) }}</td>
+            </tr>
+            {% endif  %}
+            {% if request.user == view_user and 
+                settings.TWITTER_SECRET and 
+                settings.TWITTER_KEY and 
+                settings.ENABLE_SHARING_TWITTER 
+            %}
+                {% include "user_profile/twitter_sharing_controls.html" %}
+            {% endif %}
+            {% if view_user.location or view_user.country %}
+            <tr>
+                <td>{% trans %}location{% endtrans %}</td>
+                <td>{{ macros.user_full_location(view_user) }}</td>
+            </tr>
+            {% endif %}
+            {% if view_user.date_of_birth %}
+            <tr>
+            <!--todo  - redo this with whole sentence translation -->
+                <td>{% trans %}age{% endtrans %}</td>
+                <td>{% trans age=view_user.date_of_birth|get_age%}{{ age }} years old{% endtrans %}</td>
+            </tr>
+            {% endif %}
+            {% if votes_today_left %}
+            <tr>
+                <td>{% trans %}todays unused votes{% endtrans %}</td>
+                <td><strong class="darkred">{{ votes_today_left }}</strong> {% trans %}votes left{% endtrans %}</td>
+            </tr>
             {% endif %}
-            </div>
-        </td>
-    </tr>
-</table>
+        </table>
+    </div>
+    <div class="col3 user-about">
+    {% if view_user.about and (not view_user.is_blocked()) %}
+        {{view_user.about|linebreaks}}
+    {% endif %}
+    </div>
+</div>
 <!-- end user_info.html -->
diff --git a/askbot/templates/user_profile/user_stats.html b/askbot/templates/user_profile/user_stats.html
index fe446c44..648280c4 100644
--- a/askbot/templates/user_profile/user_stats.html
+++ b/askbot/templates/user_profile/user_stats.html
@@ -23,54 +23,32 @@
         <h2>{% trans cnt=total_votes %}<span class="count">{{cnt}}</span> Vote{% pluralize %}<span class="count">{{cnt}}</span> Votes {% endtrans %}</h2>
     {% endspaceless %}
     <div class="user-stats-table">
-        <table>
-            <tr>
-                <td width="60">
-                    <img style="cursor: default;" src="{{"/images/vote-arrow-up-on.png"|media}}" alt="{% trans %}thumb up{% endtrans %}" />
-                        <span title="{% trans %}user has voted up this many times{% endtrans %}" class="vote-count">{{up_votes}}</span>
-                </td>
-                <td width="60">
-                    <img style="cursor: default;" src="{{"/images/vote-arrow-down-on.png"|media}}" alt="{% trans %}thumb down{% endtrans %}" />
-                        <span title="{% trans %}user voted down this many times{% endtrans %}" class="vote-count">{{down_votes}}</span>
-
-                </td>
-            </tr>
-        </table>
+        <div class="up-votes">{{ up_votes }}</div>
+        <div class="down-votes">{{ down_votes }}</div>
     </div>
     <a name="tags"></a>
     {% spaceless %}
         <h2>{% trans counter=user_tags|length %}<span class="count">{{counter}}</span> Tag{% pluralize %}<span class="count">{{counter}}</span> Tags{% endtrans %}</h2>
     {% endspaceless %}
     <div class="user-stats-table">
-        <table class="tags">
-            <tr>
-                <td valign="top">
-                    <ul id="ab-user-tags" class="tags">
-                    {% for tag in user_tags %}
-                        <li>
-                        {{ macros.tag_widget(
-                            tag.name,
-                            html_tag = 'div',
-                            search_state = search_state,
-                            truncate_long_tag = True,
-                            extra_content =
-                                '<span class="tag-number">&#215; ' ~
-                                tag.user_tag_usage_count|intcomma ~
-                                '</span>'
-                           )
-                        }}
-                        </li>
-                        {#
-                        {% if loop.index is divisibleby 10 %}
-                            </td>
-                            <td width="180"  valign="top">
-                        {% endif %}
-                        #}
-                    {% endfor %}
-                    </ul>
-                </td>
-            </tr>
-        </table>
+        <ul id="ab-user-tags" class="tags">
+        {% for tag in user_tags %}
+            <li>
+            {{ macros.tag_widget(
+                tag.name,
+                html_tag = 'div',
+                search_state = search_state,
+                truncate_long_tag = True,
+                extra_content =
+                    '<span class="tag-number">&#215; ' ~
+                    tag.user_tag_usage_count|intcomma ~
+                    '</span>'
+               )
+            }}
+            </li>
+        {% endfor %}
+        </ul>
+        <div class="clearfix"></div>
     </div>
     {% if interesting_tag_names %}
         {{ user_profile_macros.tag_selection(interesting_tag_names, 'interesting') }}
@@ -87,39 +65,32 @@
     <h2>{% trans counter=total_badges %}<span class="count">{{counter}}</span> Badge{% pluralize %}<span class="count">{{counter}}</span> Badges{% endtrans %}</h2>
     {% endspaceless %}
     <div class="user-stats-table badges">
-        <table>
-            <tr>
-                <td style="line-height:35px">
-                    {% for badge, badge_user_awards in badges %}
+        {% for badge, badge_user_awards in badges %}
+            <a
+                href="{{badge.get_absolute_url()}}"
+                title="{% trans description=badge.get_description() %}{{description}}{% endtrans %}"
+                class="medal"
+            ><span class="{{ badge.get_css_class() }}">&#9679;</span>&nbsp;{% trans name=badge.get_name() %}{{name}}{% endtrans %}
+            </a>&nbsp;
+            <span class="tag-number">&#215;
+                <span class="badge-context-toggle">{{ badge_user_awards|length|intcomma }}</span>
+            </span>
+            <ul id="badge-context-{{ badge.id }}" class="badge-context-list" style="display:none">
+                {% for award in badge_user_awards %}
+                    {% if award.content_object and award.content_object_is_post %}
+                    <li>
                         <a
-                            href="{{badge.get_absolute_url()}}"
-                            title="{% trans description=badge.get_description() %}{{description}}{% endtrans %}"
-                            class="medal"
-                        ><span class="{{ badge.get_css_class() }}">&#9679;</span>&nbsp;{% trans name=badge.get_name() %}{{name}}{% endtrans %}
-                        </a>&nbsp;
-                        <span class="tag-number">&#215;
-                            <span class="badge-context-toggle">{{ badge_user_awards|length|intcomma }}</span>
-                        </span>
-                        <ul id="badge-context-{{ badge.id }}" class="badge-context-list" style="display:none">
-                            {% for award in badge_user_awards %}
-                                {% if award.content_object and award.content_object_is_post %}
-                                <li>
-                                    <a
-                                        title="{{ award.content_object.get_snippet()|collapse }}"
-                                        href="{{ award.content_object.get_absolute_url() }}"
-                                    >{% if award.content_type.post_type == 'answer' %}{% trans %}Answer to:{% endtrans %}{% endif %} {{ award.content_object.thread.title|escape }}</a>
-                                </li>
-                                {% endif %}
-                            {% endfor %}
-                        </ul>
-                        {% if loop.index is divisibleby 3 %}
-                            </td></tr>
-                            <tr><td style="line-height:35px">
-                        {% endif %}
-                    {% endfor %}
-                </td>
-            </tr>
-        </table>
+                            title="{{ award.content_object.get_snippet()|collapse }}"
+                            href="{{ award.content_object.get_absolute_url() }}"
+                        >{% if award.content_type.post_type == 'answer' %}{% trans %}Answer to:{% endtrans %}{% endif %} {{ award.content_object.thread.title|escape }}</a>
+                    </li>
+                    {% endif %}
+                {% endfor %}
+            </ul>
+            {% if loop.index is divisibleby 3 %}
+                <br/>
+            {% endif %}
+        {% endfor %}
     </div>
     {% endif %}
 {% endblock %}