feat: initialise usage limits page

src/locales/en/en.json

@@ -127,6 +127,11 @@
     "title": "Chats",
     "empty": "No chats found."
   },
+  "usageLimits": {
+    "title": "Phone usage time limits",
+    "desc": "Set a daily phone usage limit.",
+    "allowedApps": "Allowed apps will be still accessible."
+  },
   "pincode": {
     "enterTitle": "Enter your PIN Code",
     "createTitle": "Create your PIN Code",
@@ -149,7 +154,8 @@
     "logout": "Logout",
     "cancel": "Cancel",
     "delete": "Delete",
-    "search": "Search"
+    "search": "Search",
+    "save": "Save"
   },
   "notFound": {
     "code": "404",

src/locales/ru/ru.json

@@ -144,7 +144,8 @@
     "resetPassword": "Сбросить пароль",
     "logout": "Выйти",
     "cancel": "Отмена",
-    "search": "Поиск"
+    "search": "Поиск",
+    "save": "Сохранить"
   },
   "notFound": {
     "code": "404",

src/pages/UsageLimits/UsageLimits.css

+.usagelimits {
+    margin-top: 60px;
+}
+
+.usagelimits__content {
+    min-height: calc(100vh - 60px - 2rem);
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+}
\ No newline at end of file

src/pages/UsageLimits/UsageLimits.tsx

 import React from "react";
 import "./UsageLimits.css";
+import SectionHeader from "../../layouts/SectionHeader";
+import CButton from "../../components/CButton";
+import { useTranslation } from "react-i18next";
 
 const UsageLimits: React.FC = () => {
-  return <div>UsageLimits</div>;
+  const { t } = useTranslation();
+
+  return (
+    <div className="usagelimits wrapper">
+      <SectionHeader to="/home/manage-apps" />
+
+      <div className="usagelimits__content">
+        <div>
+          <h3>{t("usageLimits.title")}</h3>
+          <p>{t("usageLimits.desc")}</p>
+          <p>{t("usageLimits.allowedApps")}</p>
+        </div>
+
+        <CButton title={t("button.save")} />
+      </div>
+    </div>
+  );
 };
 
 export default UsageLimits;