Replace inline styles with proper CSS

Co-authored-by: Janne Savolainen <janne.savolainen@live.fi>

Signed-off-by: Iku-turso <mikko.aspiala@gmail.com>

src/features/preferences/renderer/preference-items/preference-tab-root.module.scss

@@ -0,0 +1,7 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+.TabSeparator {
+  padding: 0 10px;
+}

src/features/preferences/renderer/preference-items/preference-tab-root.tsx

@@ -7,6 +7,7 @@ import { HorizontalLine } from "../../../../renderer/components/horizontal-line/
 import type { RootComposite } from "../../../../common/utils/composite/interfaces";
 import type { Discriminable } from "../../../../common/utils/composable-responsibilities/discriminable/discriminable";
 import type { ChildrenAreSeparated } from "./preference-item-injection-token";
+import styles from "./preference-tab-root.module.scss";
 
 export type PreferenceTabsRoot =
   & Discriminable<"preference-tabs-root">
@@ -19,7 +20,7 @@ export const preferenceTabsRoot: PreferenceTabsRoot = {
   parentId: undefined,
 
   childSeparator: () => (
-    <div style={{ padding: "0 10px" }}>
+    <div className={styles.TabSeparator}>
       <HorizontalLine size="sm" />
     </div>
   ),