Commit fe7b8339327c9a6eca07afc5381b4a9abc66a025
1 parent
5e6af8eb
Exists in
master
and in
1 other branch
On apps/edit page: Replaced IssueTracker radio buttons with nicer active/inactiv…
…e icons. Added desaturated 'inactive' icons.
Showing
10 changed files
with
75 additions
and
13 deletions
Show diff stats
app/views/apps/_fields.html.haml
| ... | ... | @@ -50,18 +50,26 @@ |
| 50 | 50 | = f.fields_for :issue_tracker do |w| |
| 51 | 51 | %div.issue_tracker.nested |
| 52 | 52 | %div.choose |
| 53 | - = w.radio_button :type, "IssueTracker", 'data-section' => 'none' | |
| 54 | - = label_tag :type_none, '(None)', :for => label_for_attr(w, 'type_issuetracker') | |
| 55 | - = w.radio_button :type, "LighthouseTracker", 'data-section' => 'lighthouse' | |
| 56 | - = label_tag :type_lighthouseapp, 'Lighthouse', :for => label_for_attr(w, 'type_lighthousetracker') | |
| 57 | - = w.radio_button :type, "RedmineTracker", 'data-section' => 'redmine' | |
| 58 | - = label_tag :type_redmine, 'Redmine', :for => label_for_attr(w, 'type_redminetracker') | |
| 59 | - = w.radio_button :type, "PivotalTracker", 'data-section' => 'pivotal' | |
| 60 | - = label_tag :type_pivotal, 'Pivotal Tracker', :for => label_for_attr(w, 'type_pivotaltracker') | |
| 61 | - = w.radio_button :type, "FogbugzTracker", 'data-section' => 'fogbugz' | |
| 62 | - = label_tag :type_fogbugz, 'FogBugz', :for => label_for_attr(w, 'type_fogbugztracker') | |
| 63 | - = w.radio_button :type, "MingleTracker", 'data-section' => 'mingle' | |
| 64 | - = label_tag :type_fogbugz, 'Mingle', :for => label_for_attr(w, 'type_mingletracker') | |
| 53 | + = label_tag :type_none, :for => label_for_attr(w, 'type_issuetracker'), :class => "label_radio none" do | |
| 54 | + = w.radio_button :type, "IssueTracker", 'data-section' => 'none' | |
| 55 | + (None) | |
| 56 | + = label_tag :type_lighthouseapp, :for => label_for_attr(w, 'type_lighthousetracker'), :class => "label_radio lighthouseapp" do | |
| 57 | + = w.radio_button :type, "LighthouseTracker", 'data-section' => 'lighthouse' | |
| 58 | + Lighthouse | |
| 59 | + = label_tag :type_redmine, :for => label_for_attr(w, 'type_redminetracker'), :class => "label_radio redmine" do | |
| 60 | + = w.radio_button :type, "RedmineTracker", 'data-section' => 'redmine' | |
| 61 | + Redmine | |
| 62 | + = label_tag :type_pivotal, :for => label_for_attr(w, 'type_pivotallabstracker'), :class => "label_radio pivotal" do | |
| 63 | + = w.radio_button :type, "PivotalLabsTracker", 'data-section' => 'pivotal' | |
| 64 | + Pivotal Tracker | |
| 65 | + %br | |
| 66 | + = label_tag :type_fogbugz, :for => label_for_attr(w, 'type_fogbugztracker'), :class => "label_radio fogbugz" do | |
| 67 | + = w.radio_button :type, "FogbugzTracker", 'data-section' => 'fogbugz' | |
| 68 | + FogBugz | |
| 69 | + = label_tag :type_fogbugz, :for => label_for_attr(w, 'type_mingletracker'), :class => "label_radio mingle" do | |
| 70 | + = w.radio_button :type, "MingleTracker", 'data-section' => 'mingle' | |
| 71 | + Mingle | |
| 72 | + | |
| 65 | 73 | %div.tracker_params.none{:class => (w.object && !(w.object.class < IssueTracker)) ? 'chosen' : nil} |
| 66 | 74 | %p When no issue tracker has been configured, you will be able to leave comments on errors. |
| 67 | 75 | %div.tracker_params.lighthouse{:class => w.object.is_a?(LighthouseTracker) ? 'chosen' : nil} | ... | ... |
4.58 KB
1.57 KB
1.96 KB
799 Bytes
818 Bytes
1.56 KB
1.52 KB
public/javascripts/form.js
| ... | ... | @@ -7,6 +7,12 @@ $(function(){ |
| 7 | 7 | |
| 8 | 8 | if($('div.issue_tracker.nested').length) |
| 9 | 9 | activateTypeSelector('issue_tracker', 'tracker_params'); |
| 10 | + | |
| 11 | + $('body').addClass('has-js'); | |
| 12 | + $('.label_radio').click(function(){ | |
| 13 | + activateLabelIcons(); | |
| 14 | + }); | |
| 15 | + activateLabelIcons(); | |
| 10 | 16 | }); |
| 11 | 17 | |
| 12 | 18 | function activateNestedForms() { |
| ... | ... | @@ -96,3 +102,15 @@ function activateCheckboxHooks() { |
| 96 | 102 | }); |
| 97 | 103 | } |
| 98 | 104 | |
| 105 | + | |
| 106 | +function activateLabelIcons() { | |
| 107 | + if ($('.label_radio input').length) { | |
| 108 | + $('.label_radio').each(function(){ | |
| 109 | + $(this).removeClass('r_on'); | |
| 110 | + }); | |
| 111 | + $('.label_radio input:checked').each(function(){ | |
| 112 | + $(this).parent('label').addClass('r_on'); | |
| 113 | + }); | |
| 114 | + }; | |
| 115 | +}; | |
| 116 | + | ... | ... |
public/stylesheets/application.css
| ... | ... | @@ -532,8 +532,44 @@ div.nested .chosen { |
| 532 | 532 | display: block !important; |
| 533 | 533 | } |
| 534 | 534 | div.nested .choose { |
| 535 | - margin-bottom: 0.5em; | |
| 535 | + margin-bottom: 1em; | |
| 536 | +} | |
| 537 | +div.issue_tracker.nested img { | |
| 538 | + vertical-align: middle; | |
| 539 | +} | |
| 540 | + | |
| 541 | +/* Icons for Issue Tracker Radio Buttons */ | |
| 542 | +div.issue_tracker.nested label.label_radio { | |
| 543 | + color: #777777; | |
| 544 | + padding-left: 33px; | |
| 545 | + background: url(/images/lighthouseapp_create.png) no-repeat; | |
| 546 | + line-height: 30px; | |
| 547 | + margin-bottom: 6px; | |
| 548 | + margin-right: 8px; | |
| 536 | 549 | } |
| 550 | +div.issue_tracker.nested .label_radio input { | |
| 551 | + position: absolute; left: -9999px; | |
| 552 | +} | |
| 553 | + | |
| 554 | +div.issue_tracker.nested label.r_on { | |
| 555 | + color: #262626; | |
| 556 | +} | |
| 557 | + | |
| 558 | + | |
| 559 | +/* Inactive icons */ | |
| 560 | +div.issue_tracker.nested label.none { background: url(/images/none_inactive.png) no-repeat; } | |
| 561 | +div.issue_tracker.nested label.redmine { background: url(/images/redmine_inactive.png) no-repeat; } | |
| 562 | +div.issue_tracker.nested label.lighthouseapp { background: url(/images/lighthouseapp_inactive.png) no-repeat; } | |
| 563 | +div.issue_tracker.nested label.mingle { background: url(/images/mingle_inactive.png) no-repeat; } | |
| 564 | +div.issue_tracker.nested label.fogbugz { background: url(/images/fogbugz_inactive.png) no-repeat; } | |
| 565 | +div.issue_tracker.nested label.pivotal { background: url(/images/pivotal_inactive.png) no-repeat; } | |
| 566 | +/* Active icons */ | |
| 567 | +div.issue_tracker.nested label.r_on.none { background: url(/images/none_create.png) no-repeat; } | |
| 568 | +div.issue_tracker.nested label.r_on.redmine { background: url(/images/redmine_create.png) no-repeat; } | |
| 569 | +div.issue_tracker.nested label.r_on.lighthouseapp { background: url(/images/lighthouseapp_create.png) no-repeat; } | |
| 570 | +div.issue_tracker.nested label.r_on.mingle { background: url(/images/mingle_create.png) no-repeat; } | |
| 571 | +div.issue_tracker.nested label.r_on.fogbugz { background: url(/images/fogbugz_create.png) no-repeat; } | |
| 572 | +div.issue_tracker.nested label.r_on.pivotal { background: url(/images/pivotal_create.png) no-repeat; } | |
| 537 | 573 | |
| 538 | 574 | |
| 539 | 575 | /* Apps Table */ | ... | ... |