Display settings to right

Also rename style file name to match component name
nvizionkm · Sep 29, 2022 · a0e9ea9 · a0e9ea9
1 parent c59263b
commit a0e9ea9
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 12 deletions.
diff --git a/app/src/ui/open-pull-request/pull-request-files-changed.tsx b/app/src/ui/open-pull-request/pull-request-files-changed.tsx
@@ -217,17 +217,17 @@ export class PullRequestFilesChanged extends React.Component<
   private renderHeader() {
     return (
       <div className="files-changed-header">
-        <div>Showing changes from all commits</div>
-        <span>
-          <DiffOptions
-            isInteractiveDiff={false}
-            hideWhitespaceChanges={this.props.hideWhitespaceInDiff}
-            onHideWhitespaceChangesChanged={this.onHideWhitespaceInDiffChanged}
-            showSideBySideDiff={this.props.showSideBySideDiff}
-            onShowSideBySideDiffChanged={this.onShowSideBySideDiffChanged}
-            onDiffOptionsOpened={this.onDiffOptionsOpened}
-          />
-        </span>
+        <div className="commits-displayed">
+          Showing changes from all commits
+        </div>
+        <DiffOptions
+          isInteractiveDiff={false}
+          hideWhitespaceChanges={this.props.hideWhitespaceInDiff}
+          onHideWhitespaceChangesChanged={this.onHideWhitespaceInDiffChanged}
+          showSideBySideDiff={this.props.showSideBySideDiff}
+          onShowSideBySideDiffChanged={this.onShowSideBySideDiffChanged}
+          onDiffOptionsOpened={this.onDiffOptionsOpened}
+        />
       </div>
     )
   }

diff --git a/app/styles/_ui.scss b/app/styles/_ui.scss
@@ -100,5 +100,5 @@
 @import 'ui/discard-changes-retry';
 @import 'ui/_git-email-not-found-warning';
 @import 'ui/_branch-select';
-@import 'ui/_pull-request-diff';
 @import 'ui/_popover-dropdown';
+@import 'ui/_pull-request-files-changed';
diff --git a/app/styles/ui/_pull-request-diff.scss → ...tyles/ui/_pull-request-files-changed.scss b/app/styles/ui/_pull-request-diff.scss → ...tyles/ui/_pull-request-files-changed.scss
@@ -5,6 +5,11 @@
   .files-changed-header {
     padding: var(--spacing);
     border-bottom: var(--base-border);
+    display: flex;
+
+    .commits-displayed {
+      flex-grow: 1;
+    }
   }
 
   .files-diff-viewer {