Organize colors

src/main.tsx

@@ -0,0 +1,96 @@
+/*
+Copyright 2021-2022 New Vector Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import React from "react";
+import ReactDOM from "react-dom";
+import { createBrowserHistory } from "history";
+import * as Sentry from "@sentry/react";
+import { Integrations } from "@sentry/tracing";
+
+import "./index.css";
+import App from "./App";
+import { ErrorView } from "./FullScreenView";
+import { init as initRageshake } from "./settings/rageshake";
+import { InspectorContextProvider } from "./room/GroupCallInspector";
+
+initRageshake();
+
+console.info(`matrix-video-chat ${import.meta.env.VITE_APP_VERSION || "dev"}`);
+
+if (import.meta.env.VITE_CUSTOM_THEME) {
+  const style = document.documentElement.style;
+  style.setProperty("--accent", import.meta.env.VITE_THEME_ACCENT as string);
+  style.setProperty(
+    "--accent-20",
+    import.meta.env.VITE_THEME_ACCENT_20 as string
+  );
+  style.setProperty("--alert", import.meta.env.VITE_THEME_ALERT as string);
+  style.setProperty(
+    "--alert-20",
+    import.meta.env.VITE_THEME_ALERT_20 as string
+  );
+  style.setProperty("--links", import.meta.env.VITE_THEME_LINKS as string);
+  style.setProperty(
+    "--primary-content",
+    import.meta.env.VITE_THEME_PRIMARY_CONTENT as string
+  );
+  style.setProperty(
+    "--secondary-content",
+    import.meta.env.VITE_THEME_SECONDARY_CONTENT as string
+  );
+  style.setProperty(
+    "--tertiary-content",
+    import.meta.env.VITE_THEME_TERTIARY_CONTENT as string
+  );
+  style.setProperty(
+    "--quaternary-content",
+    import.meta.env.VITE_THEME_QUATERNARY_CONTENT as string
+  );
+  style.setProperty(
+    "--quinary-content",
+    import.meta.env.VITE_THEME_QUINARY_CONTENT as string
+  );
+  style.setProperty("--system", import.meta.env.VITE_THEME_SYSTEM as string);
+  style.setProperty(
+    "--background",
+    import.meta.env.VITE_THEME_BACKGROUND as string
+  );
+}
+
+const history = createBrowserHistory();
+
+Sentry.init({
+  dsn: import.meta.env.VITE_SENTRY_DSN as string,
+  environment:
+    (import.meta.env.VITE_SENTRY_ENVIRONMENT as string) ?? "production",
+  integrations: [
+    new Integrations.BrowserTracing({
+      routingInstrumentation: Sentry.reactRouterV5Instrumentation(history),
+    }),
+  ],
+  tracesSampleRate: 1.0,
+});
+
+ReactDOM.render(
+  <React.StrictMode>
+    <Sentry.ErrorBoundary fallback={ErrorView}>
+      <InspectorContextProvider>
+        <App history={history} />
+      </InspectorContextProvider>
+    </Sentry.ErrorBoundary>
+  </React.StrictMode>,
+  document.getElementById("root")
+);