[FIX] [IMP] website_forum: usability fix: moved answers / votes column below the text on mobile displays, because it takes too much place and restrict the place left for the text. By the way some custom css has been removed, replaced by bootstrap css.

This commit is contained in:
Thibault Delavallée 2014-06-12 15:01:41 +02:00
parent 907862655a
commit 88205e292a
1 changed files with 32 additions and 7 deletions

View File

@ -156,14 +156,14 @@
<!-- Display a post -->
<template id="display_post">
<div class="question clearfix">
<div class="pull-left text-center">
<div class="col-md-2 hidden-xs text-center">
<div t-attf-class="box #{question.is_correct and 'oe_green' or 'oe_grey'} #{(question.child_count == 0) and 'text-muted' or ''}">
<span t-esc="question.child_count"/>
<div t-if="question.child_count&gt;1" class="subtitle">Answers</div>
<div t-if="question.child_count&lt;=1" class="subtitle">Answer</div>
</div>
</div>
<div style="margin-left: 95px; margin-top:-8px;">
<div class="col-md-10">
<div class="question-name">
<a t-attf-href="/forum/#{ slug(forum) }/question/#{ slug(question) }" t-field="question.name"/>
<span t-if="not question.active"><b> [Deleted]</b></span>
@ -180,6 +180,11 @@
t-field="question.create_uid" t-field-options='{"widget": "contact", "country_image": true, "fields": ["name", "country_id"]}'
style="display: inline-block;"/>
on <span t-field="question.write_date" t-field-options='{"format":"short"}'/>
<span class="visible-xs">
<b t-esc="question.child_count or 0"/>
<t t-if="question.child_count&gt;1">answers</t>
<t t-if="question.child_count==1">answers</t>
</span>
with <b t-field="question.views"/> views
<span t-if="question.vote_count&gt;0"> and
<b t-esc="question.vote_count or 0"/>
@ -432,7 +437,7 @@
<template id="post_description_full" name="Question Navigation">
<t t-call="website_forum.header">
<div t-attf-class="question #{not question.active and 'alert alert-danger' or ''}">
<div class="text-center pull-left">
<div class="col-md-2 hidden-xs text-center">
<t t-call="website_forum.vote">
<t t-set="post" t-value="question"/>
</t>
@ -444,7 +449,7 @@
t-attf-class="favourite_question no-decoration fa fa-2x fa-star #{question.user_favourite and 'forum_favourite_question' or ''}"/>
</div>
</div>
<div style="margin-left: 95px;">
<div style="col-md-10">
<h1 class="mt0">
<a t-attf-href="/forum/#{ slug(forum) }/question/#{ slug(question) }" t-field="question.name"/>
<span t-if="not question.active"><b> [Deleted]</b></span>
@ -470,7 +475,6 @@
</div>
</div>
<t t-raw="question.content"/>
<div class="mt16 clearfix">
<div class="pull-right">
<div class="text-right">
@ -533,6 +537,18 @@
<span class="text-muted">Asked on <span t-field="question.create_date" t-field-options='{"format":"short"}'/></span>
</div>
</div>
<div class="visible-xs text-center">
<t t-call="website_forum.vote">
<t t-set="post" t-value="question"/>
</t>
<div class="text-muted text-center">
<span t-field="question.views"/> Views
</div>
<div class="mt4">
<a t-attf-data-href="/forum/#{slug(question.forum_id)}/question/#{slug(question)}/toggle_favourite"
t-attf-class="favourite_question no-decoration fa fa-2x fa-star #{question.user_favourite and 'forum_favourite_question' or ''}"/>
</div>
</div>
</div>
<t t-call="website_forum.post_comment">
<t t-set="object" t-value="question"/>
@ -544,7 +560,7 @@
<div t-foreach="question.child_ids" t-as="answer" class="mt16 mb32">
<a t-attf-id="answer-#{str(answer.id)}"/>
<div t-attf-class="forum_answer" t-attf-id="answer_#{answer.id}" >
<div class="text-center pull-left">
<div class="col-md-2 hidden-xs text-center">
<t t-call="website_forum.vote">
<t t-set="post" t-value="answer"/>
</t>
@ -553,7 +569,7 @@
t-attf-data-href="/forum/#{slug(question.forum_id)}/post/#{slug(answer)}/toggle_correct"/>
</div>
</div>
<div style="margin-left: 95px;" class="clearfix">
<div class="col-md-10 clearfix">
<t t-raw="answer.content"/>
<div class="mt16">
<ul class="list-inline pull-right">
@ -589,6 +605,15 @@
<div t-field="answer.create_uid" t-field-options='{"widget": "contact", "badges": true, "fields": ["karma"]}'/>
<span class="text-muted">Answered on <span t-field="answer.create_date" t-field-options='{"format":"short"}'/></span>
</div>
<div class="visible-xs text-center">
<t t-call="website_forum.vote">
<t t-set="post" t-value="answer"/>
</t>
<div class="text-muted mt8">
<a t-attf-class="accept_answer fa fa-2x fa-check-circle no-decoration #{answer.is_correct and 'oe_answer_true' or 'oe_answer_false'}"
t-attf-data-href="/forum/#{slug(question.forum_id)}/post/#{slug(answer)}/toggle_correct"/>
</div>
</div>
</div>
<t t-call="website_forum.post_comment">
<t t-set="object" t-value="answer"/>