Adding separators to sidebar menu

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

src/renderer/components/+entity-settings/entity-settings.tsx

@@ -87,6 +87,7 @@ export class EntitySettings extends React.Component<Props> {
         <Tabs className="flex column" scrollable={false} onChange={this.onTabChange} value={this.activeTab}>
           { groups.map((group, groupIndex) => (
             <React.Fragment key={`group-${groupIndex}`}>
+              <hr/>
               <div className="header">{group[0]}</div>
               { group[1].map((setting, index) => (
                 <Tab

src/renderer/components/layout/setting-layout.scss

@@ -61,6 +61,19 @@
         font-weight: 600;
       }
 
+      hr {
+        margin-top: 10px;
+        margin-bottom: 10px;
+        margin-left: 10px;
+        margin-right: 20px;
+        height: 1px;
+        border-top: thin solid var(--hrColor);
+
+        &:first-child {
+          display: none;
+        }
+      }
+
       .Tabs {
         .header {
           padding: 6px 10px;
@@ -102,6 +115,7 @@
 
           > .label {
             width: 100%;
+            font-weight: 500;
           }
         }
       }