Commit 743f20faea8f40102a75f621dfb5dfa89ac1f137

Authored by Victor Costa
1 parent ef444feb

Improve proposal detail

@@ -78,11 +78,15 @@ @@ -78,11 +78,15 @@
78 <div class='make-proposal'> 78 <div class='make-proposal'>
79 <div class='title'>Faça Uma Proposta</div> 79 <div class='title'>Faça Uma Proposta</div>
80 <form class='make-proposal-form' id='make-proposal-form-{{id}}'> 80 <form class='make-proposal-form' id='make-proposal-form-{{id}}'>
81 - <input id="article_name" name="article[name]" type="text">  
82 - <textarea id="article_abstract" name="article[abstract]"></textarea>  
83 - <label>Título</label> 81 + <div class="name">
  82 + <div><label>Título</label></div>
  83 + <input id="article_name" name="article[name]" type="text" placeholder="Título">
  84 + </div>
  85 + <div>
  86 + <div><label>Descrição</label></div>
  87 + <textarea id="article_abstract" name="article[abstract]" placeholder="Descrição"></textarea>
  88 + </div>
84 <input id='private_token' name='private_token' value='{{../private_token}}' type='hidden'> 89 <input id='private_token' name='private_token' value='{{../private_token}}' type='hidden'>
85 - <label>Descrição</label>  
86 <input id='content_type' name='content_type' value='ProposalsDiscussionPlugin::Proposal' type='hidden'> 90 <input id='content_type' name='content_type' value='ProposalsDiscussionPlugin::Proposal' type='hidden'>
87 <input type='submit' id='make-proposal-button' class='make-proposal-button' name='make-proposal-button' value='Nova Proposta'> 91 <input type='submit' id='make-proposal-button' class='make-proposal-button' name='make-proposal-button' value='Nova Proposta'>
88 </form> 92 </form>
@@ -109,18 +113,18 @@ @@ -109,18 +113,18 @@
109 <div class='support-proposal'> 113 <div class='support-proposal'>
110 <div class='title'> Apoie outras propostas</div> 114 <div class='title'> Apoie outras propostas</div>
111 <div class='subtitle'> Propostas da sociedade</div> 115 <div class='subtitle'> Propostas da sociedade</div>
112 - <div class='author'>{{author.name}}</div>  
113 - <div class='abstract'><p>{{abstract}}</p></div> 116 + <div class='abstract'><p>"{{abstract}}"</p></div>
114 <div class="vote-actions"> 117 <div class="vote-actions">
115 - <a href="#" class="like" data-vote-value="1">Gostei</a>  
116 - <a href="#" class="like" data-vote-value="-1">Não Gostei</a> 118 + <a href="#" class="like dislike" data-vote-value="-1"></a>
  119 + <a href="#" class="like" data-vote-value="1"></a>
  120 + <a href="#" class="skip">Pular</a>
117 </div> 121 </div>
118 </div> 122 </div>
119 </script> 123 </script>
120 124
121 <div id='proposal-result'></div> 125 <div id='proposal-result'></div>
122 126
123 - <div id="login"> 127 + <div id="login" style="display: none">
124 <a href="/plugin/oauth_client/google_oauth2?oauth_client_popup=true&id=2" target="_blank" class="google">Google</a> 128 <a href="/plugin/oauth_client/google_oauth2?oauth_client_popup=true&id=2" target="_blank" class="google">Google</a>
125 <a href="/plugin/oauth_client/facebook?oauth_client_popup=true&id=1" target="_blank" class="facebook">Facebook</a> 129 <a href="/plugin/oauth_client/facebook?oauth_client_popup=true&id=1" target="_blank" class="facebook">Facebook</a>
126 <a href="/plugin/oauth_client/noosfero_oauth2?oauth_client_popup=true&id=3" target="_blank" class="participa">Participa</a> 130 <a href="/plugin/oauth_client/noosfero_oauth2?oauth_client_popup=true&id=3" target="_blank" class="participa">Participa</a>
@@ -112,6 +112,11 @@ function loadRandomProposal(topic_id, private_token) { @@ -112,6 +112,11 @@ function loadRandomProposal(topic_id, private_token) {
112 var article = data.articles[0]; 112 var article = data.articles[0];
113 $('.support-proposal-container').html(supportProposalTemplate(article)); 113 $('.support-proposal-container').html(supportProposalTemplate(article));
114 $(".abstract").dotdotdot(); 114 $(".abstract").dotdotdot();
  115 + $(document.body).off('click', '.vote-actions .skip');
  116 + $(document.body).on('click', '.vote-actions .skip', function(e) {
  117 + loadRandomProposal(topic_id, private_token);
  118 + e.preventDefault();
  119 + });
115 $(document.body).off('click', '.vote-actions .like'); 120 $(document.body).off('click', '.vote-actions .like');
116 $(document.body).on('click', '.vote-actions .like', function(e) { 121 $(document.body).on('click', '.vote-actions .like', function(e) {
117 $.ajax({ 122 $.ajax({
sass/_proposal_detail.scss
@@ -6,7 +6,10 @@ @@ -6,7 +6,10 @@
6 } 6 }
7 .abstract{ 7 .abstract{
8 text-align: center; 8 text-align: center;
9 - margin-top: 50px; 9 + color: #083e87;
  10 + font-weight: bold;
  11 + font-style: italic;
  12 + margin: 50px 40px 30px 40px;
10 } 13 }
11 .body{ 14 .body{
12 margin-bottom: 20px; 15 margin-bottom: 20px;
@@ -28,6 +31,9 @@ @@ -28,6 +31,9 @@
28 font-size: x-large; 31 font-size: x-large;
29 margin: 10px; 32 margin: 10px;
30 } 33 }
  34 + .name {
  35 + margin-bottom: 15px;
  36 + }
31 width: 50%; 37 width: 50%;
32 height: 90%; 38 height: 90%;
33 float: left; 39 float: left;
@@ -46,6 +52,14 @@ @@ -46,6 +52,14 @@
46 height: 15%; 52 height: 15%;
47 border: none; 53 border: none;
48 margin-top: 8%; 54 margin-top: 8%;
  55 + border-radius: 6px;
  56 + }
  57 + #article_abstract {
  58 + width: 65%;
  59 + height: 15%;
  60 + }
  61 + label {
  62 + color: gray;
49 } 63 }
50 } 64 }
51 .support-proposal-container{ 65 .support-proposal-container{
@@ -61,8 +75,40 @@ @@ -61,8 +75,40 @@
61 text-align: center; 75 text-align: center;
62 .support-proposal{ 76 .support-proposal{
63 border: 1px solid $color; 77 border: 1px solid $color;
64 - height: 100%; 78 + height: 96%;
65 margin: 2% 2% 2% 2%; 79 margin: 2% 2% 2% 2%;
  80 + padding: 10px;
  81 + }
  82 + .subtitle {
  83 + color: rgb(163, 163, 163);
  84 + }
  85 + .vote-actions {
  86 + .like {
  87 + background-image: url(./images/like.png);
  88 + background-repeat: no-repeat;
  89 + display: inline-block;
  90 + height: 72px;
  91 + width: 76px;
  92 + margin: 0 6%;
  93 + }
  94 + .dislike {
  95 + background-image: url(./images/dislike.png);
  96 + }
  97 + .skip {
  98 + display: block;
  99 + font-weight: bolder;
  100 + font-size: x-large;
  101 + background-color: #00a9bd;
  102 + color: white;
  103 + width: 15%;
  104 + margin-top: 4%;
  105 + text-decoration: none;
  106 + border-radius: 6px;
  107 + text-align: center;
  108 + margin-left: auto;
  109 + padding: 10px;
  110 + margin-right: auto;
  111 + }
66 } 112 }
67 } 113 }
68 .experience-proposal-container{ 114 .experience-proposal-container{