From 49905127dc7231b4af0c22fa1de719f75067164e Mon Sep 17 00:00:00 2001
From: Eric Amodio <eamodio@gmail.com>
Date: Mon, 9 Nov 2020 01:52:49 -0500
Subject: [PATCH] Fixes wrapping

---
 src/webviews/apps/scss/settings.scss               | 12 +++++++++
 .../apps/settings/partials/views.commits.html      | 28 ++++++++++----------
 .../apps/settings/partials/views.repositories.html | 30 ++++++++++------------
 3 files changed, 39 insertions(+), 31 deletions(-)

diff --git a/src/webviews/apps/scss/settings.scss b/src/webviews/apps/scss/settings.scss
index 74b7693..fa25ea0 100644
--- a/src/webviews/apps/scss/settings.scss
+++ b/src/webviews/apps/scss/settings.scss
@@ -577,6 +577,18 @@ section {
 	}
 }
 
+.setting__input--inner-select {
+	& label:nth-of-type(1) {
+		flex-shrink: 0;
+	}
+
+	& label:nth-of-type(2) {
+		text-overflow: ellipsis;
+		overflow: hidden;
+		white-space: nowrap;
+	}
+}
+
 .setting__hint {
 	color: var(--color-foreground--75);
 	display: block;
diff --git a/src/webviews/apps/settings/partials/views.commits.html b/src/webviews/apps/settings/partials/views.commits.html
index ce29a16..92442cf 100644
--- a/src/webviews/apps/settings/partials/views.commits.html
+++ b/src/webviews/apps/settings/partials/views.commits.html
@@ -27,7 +27,7 @@
 			<div class="section__content">
 				<div class="settings settings--fixed ml-1">
 					<div class="setting">
-						<div class="setting__input">
+						<div class="setting__input setting__input--inner-select">
 							<input
 								id="views.commits.showBranchComparison"
 								name="views.commits.showBranchComparison"
@@ -35,20 +35,18 @@
 								value="working"
 								data-setting
 							/>
-							<label for="views.commits.showBranchComparison"
-								>Show a comparison of the
-								<div class="select-container">
-									<select
-										id="views.commits.showBranchComparison"
-										name="views.commits.showBranchComparison"
-										data-setting
-										data-enablement="views.commits.showBranchComparison !false"
-									>
-										<option value="branch">current branch</option>
-										<option value="working">working tree</option>
-									</select>
-								</div>
-							</label>
+							<label for="views.commits.showBranchComparison">Show a comparison of the </label>
+							<div class="select-container">
+								<select
+									id="views.commits.showBranchComparison"
+									name="views.commits.showBranchComparison"
+									data-setting
+									data-enablement="views.commits.showBranchComparison !false"
+								>
+									<option value="branch">current branch</option>
+									<option value="working">working tree</option>
+								</select>
+							</div>
 							<label for="views.commits.showBranchComparison"
 								>with a user-selected reference (branch, tag, etc)
 							</label>
diff --git a/src/webviews/apps/settings/partials/views.repositories.html b/src/webviews/apps/settings/partials/views.repositories.html
index c41d8c4..006d65c 100644
--- a/src/webviews/apps/settings/partials/views.repositories.html
+++ b/src/webviews/apps/settings/partials/views.repositories.html
@@ -28,7 +28,7 @@
 			<div class="section__content">
 				<div class="settings settings--fixed ml-1">
 					<div class="setting" data-enablement="views.repositories.enabled">
-						<div class="setting__input">
+						<div class="setting__input setting__input--inner-select">
 							<input
 								id="views.repositories.showBranchComparison"
 								name="views.repositories.showBranchComparison"
@@ -37,21 +37,19 @@
 								data-setting
 								disabled
 							/>
-							<label for="views.repositories.showBranchComparison"
-								>Show a comparison of the
-								<div class="select-container">
-									<select
-										id="views.repositories.showBranchComparison"
-										name="views.repositories.showBranchComparison"
-										data-setting
-										data-enablement="views.repositories.enabled &amp; views.repositories.showBranchComparison !false"
-										disabled
-									>
-										<option value="branch">current branch</option>
-										<option value="working">working tree</option>
-									</select>
-								</div>
-							</label>
+							<label for="views.repositories.showBranchComparison">Show a comparison of the </label>
+							<div class="select-container">
+								<select
+									id="views.repositories.showBranchComparison"
+									name="views.repositories.showBranchComparison"
+									data-setting
+									data-enablement="views.repositories.enabled &amp; views.repositories.showBranchComparison !false"
+									disabled
+								>
+									<option value="branch">current branch</option>
+									<option value="working">working tree</option>
+								</select>
+							</div>
 							<label for="views.repositories.showBranchComparison"
 								>with a user-selected reference (branch, tag, etc)
 							</label>