Merge pull request #17906 from edx/McKenzieW/learner-4893

move Create Entitlement button up and shrink username search bar

lms/djangoapps/support/static/support/jsx/entitlements/components/Main/Main.jsx

@@ -7,7 +7,7 @@ import EntitlementSupportTableContainer from '../Table/EntitlementSupportTableCo
 import EntitlementFormContainer from '../EntitlementForm/container.jsx';
 
 const Main = props => (
-  <div>
+  <div className="entitlement-support-wrapper">
     <StatusAlert
       alertType="danger"
       dialog={props.errorMessage}
@@ -28,15 +28,17 @@ const Main = props => (
 const MainContent = (props) => {
   if (props.isFormOpen) {
     return <EntitlementFormContainer />;
-  } 
+  }
   return (
     <div>
-      <SearchContainer />
+      <div className="actions">
-      <Button
+        <SearchContainer />
-        className={['btn', 'btn-primary']}
+        <Button
-        label="Create New Entitlement"
+          className={['btn', 'btn-primary']}
-        onClick={props.openCreationForm}
+          label="Create New Entitlement"
-      />
+          onClick={props.openCreationForm}
+        />
+      </div>
       <EntitlementSupportTableContainer ecommerceUrl={props.ecommerceUrl} />
     </div>
   );

lms/djangoapps/support/static/support/jsx/entitlements/components/Search/Search.jsx

@@ -24,7 +24,7 @@ class Search extends React.Component {
 
   render() {
     return (
-      <form onSubmit={this.handleSubmit}>
+      <form onSubmit={this.handleSubmit} className="col-md-3 search-form">
         <InputText
           name="username"
           label="Search by Username"

lms/static/sass/bootstrap/lms-main.scss

@@ -27,6 +27,7 @@ $static-path: '../..';
 
 // Individual Pages
 @import "views/program-marketing-page";
+@import "views/entitlement-support-page";
 
 // Responsive Design
 @import '../header';
@@ -35,4 +36,4 @@ $static-path: '../..';
 @import 'lms/theme/extras';
 
 // Experiments
-@import 'experiments';
+@import 'experiments';

lms/static/sass/views/_entitlement-support-page.scss

@@ -0,0 +1,13 @@
+.entitlement-support-wrapper {
+  div.actions {
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    align-items: center;
+  }
+
+  form.search-form {
+    padding-left: 0;
+    padding-right: 0;
+  }
+}