api types; navbar style refactoring; user themes

src/ui/Comment/Comment.sass

@@ -18,4 +18,4 @@
   &__Content
     .Comment__User_Username
       font-size: 1.1rem
-      font-weight: 600
+      font-weight: 600

src/ui/Tabs/TabItem.tsx

@@ -0,0 +1,13 @@
+import React from "react";
+
+interface Props extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
+    selected?: boolean
+}
+
+const TabItem = ({ children, selected, ...props }: Props) => (
+    <div className={selected ? 'TabItem Selected' : 'TabItem'} {...props}>
+        {children}
+    </div>
+)
+
+export default TabItem;

src/ui/Tabs/Tabs.sass

@@ -0,0 +1,14 @@
+.Tabs
+  display: flex
+  justify-content: space-around
+
+  .TabItem
+    cursor: pointer
+    font-size: 1.2rem
+    color: var(--sec-color)
+
+    &:hover
+      color: var(--link-color)
+
+    &.Selected
+      color: var(--main-color)

src/ui/Tabs/Tabs.tsx

@@ -0,0 +1,10 @@
+import React from "react";
+import './Tabs.sass';
+
+const Tabs = ({ children }: { children: React.ReactNode[] }) => (
+    <div className={'Tabs'}>
+        {children}
+    </div>
+)
+
+export default Tabs;