Commit f683bce9918a0b56490651b5ff6f1bc822a07c8b
1 parent
a64414cc
Exists in
master
and in
1 other branch
Improve ranking
Showing
3 changed files
with
81 additions
and
13 deletions
Show diff stats
public/style.css
| ... | ... | @@ -6,7 +6,7 @@ |
| 6 | 6 | #user .gamification-plugin.user-info-template:hover { |
| 7 | 7 | background-color: rgb(228, 228, 228); |
| 8 | 8 | } |
| 9 | -.gamification-plugin.user-info-template .icon { | |
| 9 | +.gamification-plugin.user-info-template .icon, .gamification-icon { | |
| 10 | 10 | background-size: 14px; |
| 11 | 11 | background-repeat: no-repeat; |
| 12 | 12 | width: 17px; |
| ... | ... | @@ -17,13 +17,13 @@ |
| 17 | 17 | .gamification-plugin.user-info-template .icon:hover { |
| 18 | 18 | background-color: transparent; |
| 19 | 19 | } |
| 20 | -.gamification-plugin.user-info-template .level .icon { | |
| 20 | +.gamification-plugin.user-info-template .level .icon, .gamification-icon.level { | |
| 21 | 21 | background-image: url(/plugins/gamification/images/level-icon.png); |
| 22 | 22 | } |
| 23 | 23 | .gamification-plugin.user-info-template .badges .icon { |
| 24 | 24 | background-image: url(/plugins/gamification/images/badge-icon.png); |
| 25 | 25 | } |
| 26 | -.gamification-plugin.user-info-template .points .icon { | |
| 26 | +.gamification-plugin.user-info-template .points .icon, .gamification-icon.points { | |
| 27 | 27 | background-image: url(/plugins/gamification/images/points-icon.png); |
| 28 | 28 | } |
| 29 | 29 | |
| ... | ... | @@ -109,3 +109,65 @@ |
| 109 | 109 | .gamification-dashboard .scores .date { |
| 110 | 110 | color: gray; |
| 111 | 111 | } |
| 112 | + | |
| 113 | +.gamification-rankings .ranking-item .target .image img { | |
| 114 | + width: 20px; | |
| 115 | + height: 20px; | |
| 116 | +} | |
| 117 | + | |
| 118 | +.gamification-rankings ul.ranking { | |
| 119 | + list-style-type: none; | |
| 120 | + padding: 0; | |
| 121 | +} | |
| 122 | + | |
| 123 | +.gamification-rankings .ranking-item .target .label { | |
| 124 | + text-overflow: ellipsis; | |
| 125 | + white-space: nowrap; | |
| 126 | + overflow: hidden; | |
| 127 | + width: 120px; | |
| 128 | + display: inline-block; | |
| 129 | + color: rgb(68, 68, 68); | |
| 130 | +} | |
| 131 | + | |
| 132 | +.gamification-rankings .ranking.all-time, | |
| 133 | +.gamification-rankings .ranking.month { | |
| 134 | + display: inline-block; | |
| 135 | + width: 45%; | |
| 136 | + margin: 5px 0; | |
| 137 | +} | |
| 138 | + | |
| 139 | +.gamification-rankings .ranking.all-time { | |
| 140 | + margin-left: 4%; | |
| 141 | +} | |
| 142 | + | |
| 143 | +.gamification-rankings .ranking.month { | |
| 144 | + margin-right: 4%; | |
| 145 | +} | |
| 146 | + | |
| 147 | +.gamification-rankings .ranking.week .ranking-item .target .label { | |
| 148 | + width: 300px; | |
| 149 | +} | |
| 150 | + | |
| 151 | +.gamification-rankings .ranking-item .target a { | |
| 152 | + text-decoration: none; | |
| 153 | +} | |
| 154 | + | |
| 155 | +.gamification-rankings .target-position { | |
| 156 | + text-align: right; | |
| 157 | + color: rgb(160, 160, 160); | |
| 158 | +} | |
| 159 | + | |
| 160 | +.gamification-rankings .ranking-item .score, | |
| 161 | +.gamification-rankings .ranking-item .level { | |
| 162 | + float: right; | |
| 163 | +} | |
| 164 | + | |
| 165 | +.gamification-rankings h4 { | |
| 166 | + text-align: center; | |
| 167 | +} | |
| 168 | + | |
| 169 | +.gamification-rankings .ranking-item .position { | |
| 170 | + font-weight: bold; | |
| 171 | + font-size: 16px; | |
| 172 | + color: rgb(97, 97, 97); | |
| 173 | +} | ... | ... |
views/gamification/_ranking.html.erb
| 1 | 1 | <ul class="ranking"> |
| 2 | - <% if target_ranking.present? %> | |
| 3 | - <span><%= _('Your position: ') %></span> | |
| 4 | - <span><%= target_ranking.gamification_position %></span> | |
| 5 | - <% else %> | |
| 6 | - <%= _('Not scored yet') %> | |
| 7 | - <% end %> | |
| 2 | + <div class="target-position"> | |
| 3 | + <% if target_ranking.present? %> | |
| 4 | + <span><%= _('Your position: ') %></span> | |
| 5 | + <span><%= target_ranking.gamification_position %></span> | |
| 6 | + <% else %> | |
| 7 | + <%= _('Not scored yet') %> | |
| 8 | + <% end %> | |
| 9 | + </div> | |
| 8 | 10 | <% ranking.each_with_index do |person, i| %> |
| 9 | 11 | <li class="ranking-item"> |
| 10 | 12 | <span class="position"> |
| 11 | 13 | <%= i+1 %> |
| 12 | 14 | </span> |
| 13 | - <span class="name"> | |
| 14 | - <%= person.name %> | |
| 15 | + <span class="target"> | |
| 16 | + <%= link_to person.url do %> | |
| 17 | + <span class="image"><%= profile_image(person, :icon) %></span> | |
| 18 | + <span class="label"><%= person.name %></span> | |
| 19 | + <% end %> | |
| 15 | 20 | </span> |
| 16 | 21 | <span class="score"> |
| 22 | + <span class="gamification-icon points"> </span> | |
| 17 | 23 | <%= person.gamification_points %> |
| 18 | 24 | </span> |
| 19 | 25 | </li> | ... | ... |
views/gamification/dashboard.html.erb
| ... | ... | @@ -51,11 +51,11 @@ |
| 51 | 51 | </div> |
| 52 | 52 | |
| 53 | 53 | <% if @target.kind_of?(Profile) %> |
| 54 | -<div class="rankings"> | |
| 54 | +<div class="gamification-rankings"> | |
| 55 | 55 | <h3><%= _('Ranking') %></h3> |
| 56 | 56 | <div class="ranking week"> |
| 57 | 57 | <h4><%= _('Week') %></h4> |
| 58 | - <%= ranking(@target, Time.zone.now.at_beginning_of_week) %> | |
| 58 | + <%= ranking(@target, Time.zone.now.at_beginning_of_week, 5) %> | |
| 59 | 59 | </div> |
| 60 | 60 | <div class="ranking month"> |
| 61 | 61 | <h4><%= _('Month') %></h4> | ... | ... |