Group editor and terminal settings in stack layout

Author: PavelLaptev

apps/desktop/src/components/profileSettings/GeneralSettings.svelte

@@ -191,56 +191,58 @@
 {/if}
 <Spacer />
 
-<SectionCard orientation="row" centerAlign>
-	{#snippet title()}
-		Default code editor
-	{/snippet}
-	{#snippet actions()}
-		<Select
-			value={$userSettings.defaultCodeEditor.schemeIdentifer}
-			options={editorOptionsForSelect}
-			onselect={(value) => {
-				const selected = editorOptions.find((option) => option.schemeIdentifer === value);
-				if (selected) {
-					userSettings.update((s) => ({ ...s, defaultCodeEditor: selected }));
-				}
-			}}
-		>
-			{#snippet itemSnippet({ item, highlighted })}
-				<SelectItem
-					selected={item.value === $userSettings.defaultCodeEditor.schemeIdentifer}
-					{highlighted}
-				>
-					{item.label}
-				</SelectItem>
-			{/snippet}
-		</Select>
-	{/snippet}
-</SectionCard>
+<div class="stack-v">
+	<SectionCard orientation="row" centerAlign roundedBottom={false}>
+		{#snippet title()}
+			Default code editor
+		{/snippet}
+		{#snippet actions()}
+			<Select
+				value={$userSettings.defaultCodeEditor.schemeIdentifer}
+				options={editorOptionsForSelect}
+				onselect={(value) => {
+					const selected = editorOptions.find((option) => option.schemeIdentifer === value);
+					if (selected) {
+						userSettings.update((s) => ({ ...s, defaultCodeEditor: selected }));
+					}
+				}}
+			>
+				{#snippet itemSnippet({ item, highlighted })}
+					<SelectItem
+						selected={item.value === $userSettings.defaultCodeEditor.schemeIdentifer}
+						{highlighted}
+					>
+						{item.label}
+					</SelectItem>
+				{/snippet}
+			</Select>
+		{/snippet}
+	</SectionCard>
 
-<SectionCard orientation="row" centerAlign>
-	{#snippet title()}
-		Default terminal
-	{/snippet}
-	{#snippet actions()}
-		<Select
-			value={$userSettings.defaultTerminal.appName}
-			options={terminalOptionsForSelect}
-			onselect={(value) => {
-				const selected = terminalOptions.find((option) => option.appName === value);
-				if (selected) {
-					userSettings.update((s) => ({ ...s, defaultTerminal: selected }));
-				}
-			}}
-		>
-			{#snippet itemSnippet({ item, highlighted })}
-				<SelectItem selected={item.value === $userSettings.defaultTerminal.appName} {highlighted}>
-					{item.label}
-				</SelectItem>
-			{/snippet}
-		</Select>
-	{/snippet}
-</SectionCard>
+	<SectionCard orientation="row" centerAlign roundedTop={false}>
+		{#snippet title()}
+			Default terminal
+		{/snippet}
+		{#snippet actions()}
+			<Select
+				value={$userSettings.defaultTerminal.appName}
+				options={terminalOptionsForSelect}
+				onselect={(value) => {
+					const selected = terminalOptions.find((option) => option.appName === value);
+					if (selected) {
+						userSettings.update((s) => ({ ...s, defaultTerminal: selected }));
+					}
+				}}
+			>
+				{#snippet itemSnippet({ item, highlighted })}
+					<SelectItem selected={item.value === $userSettings.defaultTerminal.appName} {highlighted}>
+						{item.label}
+					</SelectItem>
+				{/snippet}
+			</Select>
+		{/snippet}
+	</SectionCard>
+</div>
 
 <SectionCard labelFor="disable-auto-checks" orientation="row">
 	{#snippet title()}