Initial commit

src/Pages/ExperimentsPage/MoleculePage.css

@@ -0,0 +1,65 @@
+.MoleculeEdit {
+    height: 100%;
+    display: flex;
+}
+.MoleculeEditWrapper {
+    display: flex !important;
+    flex: 1 !important;
+    min-width: 0;
+    min-height: 0;
+    background-color: var(--mantine-color-secondary-filled);
+}
+
+.MoleculeEditLineNumber {
+    height: 100%;
+    padding-top: calc(1px + var(--input-padding-y, 0rem));
+    padding-bottom: calc(1px + var(--input-padding-y, 0rem));
+    font-family:
+        "Fira Code", "Courier New", Courier, monospace; /* Monospace fonts */
+    font-size: 14px; /* Comfortable size */
+    line-height: 1.5; /* Spacing like an editor */
+    letter-spacing: 0; /* Keeps punctuation aligned */
+    white-space: pre-line;
+    overflow: scroll;
+    scrollbar-width: none;
+    overscroll-behavior: none;
+    cursor: default;
+}
+
+.MoleculeEditInput {
+    font-family:
+        "Fira Code", "Courier New", Courier, monospace; /* Monospace fonts */
+    font-size: 14px; /* Comfortable size */
+    line-height: 1.5; /* Spacing like an editor */
+    letter-spacing: 0; /* Keeps punctuation aligned */
+    white-space: pre; /* preserves spaces & tabs */
+    overflow-x: auto; /* horizontal scroll when needed */
+    overflow-y: auto; /* vertical scroll when needed */
+    word-wrap: normal; /* prevent wrapping */
+    overscroll-behavior: none;
+    background-color: var(--mantine-color-secondary-filled);
+}
+
+.Separator {
+    width: 10px;
+}
+
+.moleculeInput {
+    height: 250px;
+}
+
+.moleculeInputWrapper {
+    height: 100%;
+}
+
+.moleculeInputWrapper > * {
+    height: 100%;
+}
+
+.tabPanel {
+    flex: 1;
+    padding: 10px;
+    border-left: 1px solid var(--tab-border-color);
+    border-right: 1px solid var(--tab-border-color);
+    border-bottom: 1px solid var(--tab-border-color);
+}