Bug 1146910: Button styles are inconsistent

5 files changed, 45 insertions, 57 deletions

diff --git a/extensions/BugModal/template/en/default/bug_modal/activity_stream.html.tmpl b/extensions/BugModal/template/en/default/bug_modal/activity_stream.html.tmpl
index 881ed927f..1e50284ba 100644
--- a/extensions/BugModal/template/en/default/bug_modal/activity_stream.html.tmpl
+++ b/extensions/BugModal/template/en/default/bug_modal/activity_stream.html.tmpl
@@ -72,12 +72,12 @@
             </div>
           [% END %]
           [% IF user.id %]
-            <button class="reply-btn in-page"
+            <button class="reply-btn minor"
               data-reply-id="[% comment.count FILTER none %]"
               data-reply-name="[% comment.author.name || comment.author.moz_nick FILTER html %]"
               >Reply</button>
           [% END %]
-          <button class="comment-spinner in-page" id="cs-[% comment.count FILTER none%]">-</button>
+          <button class="comment-spinner minor" id="cs-[% comment.count FILTER none%]">-</button>
         </td>
       </tr>
       <tr>
@@ -113,7 +113,7 @@
             Comment hidden ([% comment.tags.join(', ') FILTER html %])
         </td>
         <td class="comment-actions">
-          <button class="comment-spinner in-page" id="ccs-[% comment.count FILTER none%]">
+          <button class="comment-spinner minor" id="ccs-[% comment.count FILTER none%]">
             [%~ comment.collapsed ? "+" : "-" ~%]
           </button>
         </td>
diff --git a/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl b/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
index a5d5f09f8..dae2006a4 100644
--- a/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
+++ b/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
@@ -211,32 +211,34 @@
   <div id="mode-container">
     [% IF user.id %]
       <div>
-        <button type="button" class="minor" id="cc-btn" data-is-cced="[% is_cced ? 1 : 0 %]">
-          [% is_cced ? "Stop following" : "Follow" %]
-        </button>
         <button type="button" id="cancel-btn" class="minor" style="display:none">Cancel</button>
-        <button type="button" id="mode-btn">
+        <button type="button" id="mode-btn" class="major">
           <span id="mode-btn-readonly">Edit</span>
           <span id="mode-btn-loading">
             <img id="edit-throbber" src="extensions/BugModal/web/throbber.gif" width="16" height="11">
             Fetching
           </span>
         </button>
-        <button type="submit" id="commit-btn" style="display:none">Save Changes</button>
+        <button type="submit" id="commit-btn" class="major" style="display:none">Save Changes</button>
       </div>
     [% END %]
     <div class="button-row">
       [% IF user.id %]
-        <button type="button" class="comment-btn in-page">Add Comment</button>
+        <button type="button" class="comment-btn minor">Add Comment</button>
       [% END %]
-      <button type="button" id="last-comment-btn" class="in-page">Last Comment &darr;</button>
+      <button type="button" id="last-comment-btn" class="minor">Last Comment &darr;</button>
     </div>
     <div class="button-row">
       [% IF bug.assigned_to.id == user.id || user.in_group("editbugs") %]
-        <button type="button" id="copy-summary" class="in-page"
+        <button type="button" id="copy-summary" class="minor"
           title="Copy [% terms.bug %] number and summary to your clipboard">Copy Summary</button>
       [% END %]
-      <button type="button" id="expand-all-btn" class="in-page">Expand All</button>
+      [% IF user.id %]
+        <button type="button" class="minor" id="cc-btn" data-is-cced="[% is_cced ? 1 : 0 %]">
+          [% is_cced ? "Stop Following" : "Follow" %]
+        </button>
+      [% END %]
+      <button type="button" id="expand-all-btn" class="minor">Expand All</button>
     </div>
   </div>
 [% END %]
@@ -375,7 +377,7 @@
         <input id="dup_id" name="dup_id" size="6" value="[% bug.dup_id FILTER html %]">
       </div>
       <div id="duplicate-actions">
-        <button type="button" class="in-page" id="mark-as-dup-btn">
+        <button type="button" class="minor" id="mark-as-dup-btn">
           Mark as Duplicate
         </button>
       </div>
@@ -409,7 +411,7 @@
       [% IF unassigned %]
         <i>Unassigned</i>
         [% IF bug.check_can_change_field("assigned_to", 0, 1) %]
-          <button type="button" id="take-btn" class="in-page">Take</button>
+          <button type="button" id="take-btn" class="minor">Take</button>
         [% END %]
       [% ELSE %]
         [% INCLUDE bug_modal/user.html.tmpl u=bug.assigned_to %]
@@ -469,7 +471,7 @@
           label = "NeedInfo"
           hide_on_view = 1
       %]
-        <button type="button" id="needinfo-scroll" class="in-page">Update</button>
+        <button type="button" id="needinfo-scroll" class="minor">Update</button>
       [% END %]
     [% END %]
 
@@ -813,10 +815,10 @@
     [% IF user.id %]
       <div id="user-story-actions">
         [% IF bug.check_can_change_field('cf_user_story', 0, 1) %]
-          <button type="button" class="in-page" id="user-story-edit-btn">Edit</button>
+          <button type="button" class="minor" id="user-story-edit-btn">Edit</button>
         [% END %]
         [% IF bug.cf_user_story != "" && bug.check_can_change_field('longdesc', 0, 1) %]
-          <button type="button" class="in-page" id="user-story-reply-btn">Reply</button>
+          <button type="button" class="minor" id="user-story-reply-btn">Reply</button>
         [% END %]
       </div>
     [% END %]
@@ -849,7 +851,7 @@
     [% INCLUDE bug_modal/attachments.html.tmpl %]
     [% IF obsolete_attachments %]
       <div id="attachments-actions">
-        <button type="button" id="attachments-obsolete-btn" class="in-page">Show Obsolete Attachments</button>
+        <button type="button" id="attachments-obsolete-btn" class="minor">Show Obsolete Attachments</button>
       </div>
     [% END %]
   [% END %]
@@ -860,8 +862,8 @@
 [% IF user.id %]
   <div id="top-actions">
     <button type="button" id="attachments-add-btn" class="minor">Attach File</button>
-    <button type="button" class="comment-btn in-page">Add Comment</button>
-    <button type="submit" class="save-btn" id="top-save-btn" style="display:none">Save Changes</button>
+    <button type="button" class="comment-btn minor">Add Comment</button>
+    <button type="submit" class="save-btn major" id="top-save-btn" style="display:none">Save Changes</button>
   </div>
 [% END %]
 
@@ -878,7 +880,7 @@
 
 [% IF user.id %]
   <div id="bottom-actions">
-    <button type="submit" class="save-btn" id="bottom-save-btn">Save Changes</button>
+    <button type="submit" class="save-btn major" id="bottom-save-btn">Save Changes</button>
     [%
       IF bug.resolution == "";
         seen_header = 0;
@@ -888,14 +890,14 @@
             seen_header = 1;
             " Resolve as ";
           END;
-          %] <button type="button" class="in-page resolution-btn">[% resolution FILTER html %]</button> [%
+          %] <button type="button" class="minor resolution-btn">[% resolution FILTER html %]</button> [%
         END;
       ELSIF bug.choices.bug_status.only("name", "REOPENED").size;
-          %] <button type="button" class="in-page status-btn" data-status="REOPENED">REOPEN</button> [%
+          %] <button type="button" class="minor status-btn" data-status="REOPENED">REOPEN</button> [%
       END;
     %]
     <div id="bottom-right-actions">
-      <button type="button" id="top-btn" class="in-page">Top &uarr;</button>
+      <button type="button" id="top-btn" class="minor">Top &uarr;</button>
       <button type="button" id="new-bug-btn" class="minor">New [% terms.Bug %] &#9662;</button>
     </div>
   </div>
diff --git a/extensions/BugModal/template/en/default/bug_modal/field.html.tmpl b/extensions/BugModal/template/en/default/bug_modal/field.html.tmpl
index d9b5873d9..cb2ce7a7a 100644
--- a/extensions/BugModal/template/en/default/bug_modal/field.html.tmpl
+++ b/extensions/BugModal/template/en/default/bug_modal/field.html.tmpl
@@ -198,7 +198,7 @@ END;
 
         [% CASE constants.FIELD_TYPE_TEXTAREA %]
           [%# text area %]
-            <button type="button" class="in-page edit-textarea-btn [%= "edit-textarea-set-btn" IF value != "" %]"
+            <button type="button" class="minor edit-textarea-btn [%= "edit-textarea-set-btn" IF value != "" %]"
               id="[% name FILTER html %]-edit">Edit</button>
             <span class="multiline-value" id="[% name FILTER html %]-view">[% value FILTER html FILTER html_line_break %]</span>
             <textarea id="[% name FILTER html %]" name="[% name FILTER html %]"
@@ -256,7 +256,7 @@ END;
   [% END %]
 
   [% IF edit %]
-    <button id="[% name FILTER html %]-btn" class="bug-urls-btn in-page">Add</button>
+    <button id="[% name FILTER html %]-btn" class="bug-urls-btn minor">Add</button>
     <input id="[% name FILTER html %]" name="[% name FILTER html %]" style="display:none">
   [% END %]
 [% END %]
diff --git a/extensions/BugModal/web/bug_modal.css b/extensions/BugModal/web/bug_modal.css
index 27a9e3f73..5779ebd34 100644
--- a/extensions/BugModal/web/bug_modal.css
+++ b/extensions/BugModal/web/bug_modal.css
@@ -38,38 +38,28 @@
     margin-right: 5px;
 }
 
-button.minor {
-    background-color: #888;
-    background-image: linear-gradient(#aaa, #888);
+button.major {
     font-size: 11px;
-    padding: 0.25em 0.5em;
-}
-
-button.minor:hover {
-    -webkit-box-shadow: 0 1px 0 0 rgba(0,0,0,0.2), inset 0 -1px 0 0 rgba(0,0,0,0.3), inset 0 12px 24px 2px #bbb;
-    -moz-box-shadow: 0 1px 0 0 rgba(0,0,0,0.2), inset 0 -1px 0 0 rgba(0,0,0,0.3), inset 0 12px 24px 2px #bbb;
-    box-shadow: 0 1px 0 0 rgba(0,0,0,0.2), inset 0 -1px 0 0 rgba(0,0,0,0.3), inset 0 12px 24px 2px #bbb;
+    padding: 4px 8px;
 }
 
-button.in-page {
-    background-color: #fff;
-    background-image: linear-gradient(#fff, #fff);
+button.minor {
+    background-color: #eee;
+    background-image: linear-gradient(#fcfcfc, #eee);
     color: #000;
-    border: 1px solid #ccc;
-    -webkit-box-shadow: none;
-    -moz-box-shadow: none;
-    box-shadow: none;
     font-size: 11px;
-    padding: 0.25em 0.5em;
+    font-weight: 500;
+    padding: 4px 8px;
+    text-shadow: none;
+    -web-kit-box-shadow: 0 1px 0 0 rgba(0,0,0,0.1), inset 0 -1px 0 0 rgba(0,0,0,0.1);
+    -moz-box-shadow: 0 1px 0 0 rgba(0,0,0,0.1), inset 0 -1px 0 0 rgba(0,0,0,0.1);
+    box-shadow: 0 1px 0 0 rgba(0,0,0,0.1), inset 0 -1px 0 0 rgba(0,0,0,0.1);
 }
 
-button.in-page:hover {
-    -webkit-box-shadow: inset 0 12px 24px 2px #eee;
-    -moz-box-shadow: inset 0 12px 24px 2px #eee;
-    box-shadow: inset 0 12px 24px 2px #eee;
-    -moz-transition: all linear 100ms;
-    -webkit-transition: all linear 100ms;
-    transition: all linear 100ms;
+button.minor:hover {
+    -webkit-box-shadow: 0 1px 0 0 rgba(0,0,0,0.2), inset 0 -1px 0 0 rgba(0,0,0,0.3), inset 0 12px 24px 2px #ddd;
+    -moz-box-shadow: 0 1px 0 0 rgba(0,0,0,0.2), inset 0 -1px 0 0 rgba(0,0,0,0.3), inset 0 12px 24px 2px #ddd;
+    box-shadow: 0 1px 0 0 rgba(0,0,0,0.1), inset 0 -1px 0 0 rgba(0,0,0,0.1), inset 0 12px 24px 2px #ddd;
 }
 
 select[multiple], .text_input, .yui-ac-input, input {
@@ -293,10 +283,6 @@ input[type="number"] {
 
 /* actions */
 
-#copy-summary {
-    margin-left: 20px;
-}
-
 #top-actions {
     margin-top: 5px;
     padding-bottom: 20px;
diff --git a/extensions/BugModal/web/bug_modal.js b/extensions/BugModal/web/bug_modal.js
index 67d576728..2411f4c15 100644
--- a/extensions/BugModal/web/bug_modal.js
+++ b/extensions/BugModal/web/bug_modal.js
@@ -330,7 +330,7 @@ $(function() {
             else {
                 cc_change = { add: [ BUGZILLA.user.login ] };
                 $('#cc-btn')
-                    .text('Stop following')
+                    .text('Stop Following')
                     .data('is-cced', '1')
                     .prop('disabled', true);
             }
@@ -347,7 +347,7 @@ $(function() {
                         return;
                     if (data.bugs[0].changes.cc.added == BUGZILLA.user.login) {
                         $('#cc-btn')
-                            .text('Stop following')
+                            .text('Stop Following')
                             .data('is-cced', '1');
                     }
                     else if (data.bugs[0].changes.cc.removed == BUGZILLA.user.login) {