feat: Add i18n docs and light and dark theme styles

platform/docs/src/css/custom.css

@@ -1,25 +1,82 @@
+@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap");
+
 /* stylelint-disable docusaurus/copyright-header */
 /**
  * Any CSS included here will be global. The classic template
  * bundles Infima by default. Infima is a CSS framework designed to
  * work well for content-centric websites.
  */
-
 /* You can override the default Infima variables here. */
+/* https://infima.dev/docs/utilities/colors */
+/* https://docs.theochu.com/docusaurus/styling/ */
 :root {
-  --ifm-color-primary: #25c2a0;
+  /*--ifm-color-primary: #25c2a0;
   --ifm-color-primary-dark: rgb(33, 175, 144);
   --ifm-color-primary-darker: rgb(31, 165, 136);
   --ifm-color-primary-darkest: rgb(26, 136, 112);
   --ifm-color-primary-light: rgb(70, 203, 174);
   --ifm-color-primary-lighter: rgb(102, 212, 189);
-  --ifm-color-primary-lightest: rgb(146, 224, 208);
+  --ifm-color-primary-lightest: rgb(146, 224, 208);*/
+  --ifm-color-primary: #1c296d;
+  --ifm-color-primary-dark: #192562;
+  --ifm-color-primary-darker: #18235d;
+  --ifm-color-primary-darkest: #141d4c;
+  --ifm-color-primary-light: #1f2d78;
+  --ifm-color-primary-lighter: #202f7d;
+  --ifm-color-primary-lightest: #24358e;
   --ifm-code-font-size: 95%;
+  --ifm-background-color: #f5ffff;
+  --ifm-background-surface-color: #f5ffff;
+  --ifm-menu-color: #002e85;
+}
+html[data-theme="dark"] {
+  --ifm-color-primary: #5acce6;
+  --ifm-color-primary-dark: #3ec3e2;
+  --ifm-color-primary-darker: #30bfe0;
+  --ifm-color-primary-darkest: #1da4c3;
+  --ifm-color-primary-light: #76d5ea;
+  --ifm-color-primary-lighter: #84d9ec;
+  --ifm-color-primary-lightest: #ade6f3;
+  --ifm-background-color: #080b2b;
+  --ifm-background-surface-color: #080b2b;
+  --ifm-menu-color: #7bb2ce;
 }
-
 .docusaurus-highlight-code-line {
   background-color: rgb(72, 77, 91);
   display: block;
   margin: 0 calc(-1 * var(--ifm-pre-padding));
   padding: 0 var(--ifm-pre-padding);
 }
+
+
+html {
+  font-size: 18px;
+}
+
+body {
+  font-family: "Inter", sans-serif;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5 {
+  color: var(--ifm-color-primary);
+  font-weight: 400;
+  font-family: "Inter", sans-serif;
+}
+
+.menu {
+  font-weight: 400;
+  font-size: 1.0rem;
+}
+
+.menu__list-item .menu__list{
+  font-weight: 400;
+  font-size: 0.9rem;
+}
+
+.table-of-contents {
+  font-size: 0.8rem;
+}