Download as
Browse Code »

Commit e1708651a3931c1634909e0bd029722b014f21f8

Authored by Victor Costa
1 parent 1a988357
Exists in master and in 11 other branches build, build2, capa, captcha, contigency_plan_recaptcha, jasmine-testing, make_harder_to_vote_twice, production, refactory-sass, session_cookie, staging

Added arrow in categories menu

Showing 3 changed files with 27 additions and 0 deletions   Show diff stats
@@ -34,6 +34,7 @@ @@ -34,6 +34,7 @@
34 {{#each article.categories}} 34 {{#each article.categories}}
35 <li id='proposal-category-{{slug}}' class="proposal-category"> 35 <li id='proposal-category-{{slug}}' class="proposal-category">
36 {{#link name id}}{{/link}} 36 {{#link name id}}{{/link}}
  37 + <div class="arrow-box" style="display: none"></div>
37 </li> 38 </li>
38 {{/each}} 39 {{/each}}
39 {{#each article.categories}} 40 {{#each article.categories}}
@@ -70,6 +70,8 @@ $.getJSON(noosferoAPI) @@ -70,6 +70,8 @@ $.getJSON(noosferoAPI)
70 $('.proposal-category-items').hide(); 70 $('.proposal-category-items').hide();
71 $('#' + item).show(); 71 $('#' + item).show();
72 $(".proposal-item").dotdotdot(); 72 $(".proposal-item").dotdotdot();
  73 + $('.proposal-category .arrow-box').hide();
  74 + $(this).siblings('.arrow-box').show();
73 } 75 }
74 event.preventDefault(); 76 event.preventDefault();
75 }); 77 });
sass/_proposal_categories.scss
  Diff comments   View file @e170865
@@ -121,6 +121,10 @@ @@ -121,6 +121,10 @@
121 background-color: $color; 121 background-color: $color;
122 border-color: $color; 122 border-color: $color;
123 } 123 }
  124 + #proposal-category-#{$category} .arrow-box:after {
  125 + border-bottom-color: $color;
  126 + }
  127 +
124 .proposal-category-items-#{$category} ul.category li { 128 .proposal-category-items-#{$category} ul.category li {
125 background-color: $color; 129 background-color: $color;
126 background-image: url(./images/icons/#{$category}.png); 130 background-image: url(./images/icons/#{$category}.png);
@@ -135,3 +139,23 @@ @@ -135,3 +139,23 @@
135 content: "#{$description}"; 139 content: "#{$description}";
136 } 140 }
137 } 141 }
  142 +
  143 +.arrow-box {
  144 + position: relative;
  145 + background: #88b7d5;
  146 + top: 3px;
  147 + &:after {
  148 + bottom: 100%;
  149 + left: 50%;
  150 + border: solid transparent;
  151 + content: " ";
  152 + height: 0;
  153 + width: 0;
  154 + position: absolute;
  155 + pointer-events: none;
  156 + border-color: rgba(136, 183, 213, 0);
  157 + border-bottom-color: #88b7d5;
  158 + border-width: 8px;
  159 + margin-left: -8px;
  160 + }
  161 +}