Add tests and styling for betterbuttons port

client/src/components/Toolbar/Toolbar.scss

@@ -14,6 +14,41 @@
   .btn {
     margin-bottom: 0;
   }
+
+  .right {
+    margin-left: auto;
+
+    .btn-group:not(last-child) {
+      margin-right: 10px !important;
+    }
+  }
+
+  .rounded {
+
+    &.btn,
+    >.btn {
+      width: 32px;
+      padding-left: 7px;
+
+      &:last-child {
+        border-top-right-radius: 100px !important;
+        border-bottom-right-radius: 100px !important;
+      }
+
+      &:first-child {
+        border-top-left-radius: 100px !important;
+        border-bottom-left-radius: 100px !important;
+      }
+
+    }
+
+    border-radius: 100px !important;
+
+    &::before,
+    .btn::before {
+      margin-right: 0;
+    }
+  }
 }
 
 // Northern bar containing breadcrumb, tabs etc.

client/src/font/styles.css

@@ -62,8 +62,10 @@
 .font-icon-book-open:before {
   content: "\6f";
 }
-.font-icon-plus:before {
-  content: "\6a";
+.font-icon-plus-thin:before {
+  content: "\44";
+  transform: rotate(45deg);
+  display: inline-block;
 }
 .font-icon-tree:before {
   content: "\70";

client/src/legacy/LeftAndMain.js

@@ -1086,6 +1086,14 @@ $.entwine('ss', function($) {
     }
   });
 
+  $('.cms button.action.discard-confirmation').entwine({
+    onclick: function(e) {
+      if (!$('.cms-container').checkCanNavigate()) {
+        e.preventDefault();
+      }
+    }
+  });
+
   /**
    * Does an ajax loads of the link's 'href' attribute via ajax and displays any FormResponse messages from the CMS.
    * Little helper to avoid repetition, and make it easy to trigger actions via a link,

client/src/styles/_fonts.scss

@@ -58,8 +58,10 @@
   content: "\6f";
 }
 
-.font-icon-plus:before {
-  content: "\6a";
+.font-icon-plus-thin:before {
+  content: "\44";
+  transform: rotate(45deg);
+  display: inline-block;
 }
 
 .font-icon-tree:before {

tests/behat/features/manage-users.feature

@@ -8,6 +8,7 @@ Feature: Manage users
     Given a "member" "ADMIN" belonging to "ADMIN group" with "Email"="[email protected]"
     And the "member" "ADMIN" belonging to "ADMIN group2"
     And a "member" "Staff" belonging to "Staff group" with "Email"="[email protected]"
+    And a "member" "Other Staff" belonging to "Staff group" with "Email"="[email protected]"
     And the "group" "ADMIN group" has permissions "Full administrative rights"
     And the "group" "ADMIN group2" has permissions "Full administrative rights"
     And I am logged in with "ADMIN" permissions
@@ -88,8 +89,32 @@ Feature: Manage users
     When I go to "admin/security/"
     Then I should see "[email protected]" in the "#Root_Users" element
 
-  Scenario: I can edit an existing user and add him to an existing group
+  @modal
+  Scenario: I can navigate users from the edit form and retain my search query
     When I click the "Users" CMS tab
+    And I press the "First Name" button
+
+    Then I should see "[email protected]" in the "#Root_Users" element
+    And I should see "[email protected]" in the "#Root_Users" element
+    And I should see "[email protected]" in the "#Root_Users" element
+
+    When I click "[email protected]" in the "#Root_Users" element
+    And I press the "Form_ItemEditForm_action_doNext" button
+    Then the "Email" field should contain "[email protected]"
+    When I press the "Form_ItemEditForm_action_doPrevious" button
+    Then the "Email" field should contain "[email protected]"
+
+    When I fill in "FirstName" with "Staff Renamed"
+    And I press the "Form_ItemEditForm_action_doNew" button
+    Then I see the text "Are you sure you want to navigate away from this page?" in the alert
+    And I dismiss the dialog
+
+    When I go to "admin/security/"
+    Then I confirm the dialog
+
+  Scenario: I can edit an existing user and add him to an existing group
+    When I go to "admin/security/"
+    And I click the "Users" CMS tab
     And I click "[email protected]" in the "#Root_Users" element
     And I select "ADMIN group" from "Groups"
     And I press the "Apply changes" button