framework for properties panel

2 files changed, 70 insertions, 0 deletions

diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.scss b/src/client/views/collections/collectionFreeForm/PropertiesView.scss
new file mode 100644
index 000000000..d4cc53bfa
--- /dev/null
+++ b/src/client/views/collections/collectionFreeForm/PropertiesView.scss
@@ -0,0 +1,32 @@
+.propertiesView {
+
+    background-color: rgb(168, 168, 168);
+    height: 100%;
+    z-index: 1;
+
+    .propertiesView-title {
+        background-color: rgb(134, 134, 134);
+        border-top: 1px solid black;
+        border-bottom: 1px solid black;
+    }
+
+    .propertiesView-name {
+        border-top: 1px solid black;
+        border-bottom: 1px solid black;
+    }
+
+    .propertiesView-settings {
+        border-top: 1px solid black;
+        border-bottom: 1px solid black;
+    }
+
+    .propertiesView-fields {
+        border-top: 1px solid black;
+        border-bottom: 1px solid black;
+    }
+
+    .propertiesView-layout {
+        border-top: 1px solid black;
+        border-bottom: 1px solid black;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx
new file mode 100644
index 000000000..4306453ea
--- /dev/null
+++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx
@@ -0,0 +1,38 @@
+import React = require("react");
+import { observer } from "mobx-react";
+import "./PropertiesView.scss";
+import { observable, action } from "mobx";
+import { Doc } from "../../../../fields/Doc";
+import { DocumentView } from "../../nodes/DocumentView";
+
+
+// interface PropertiesViewProps {
+//     document: Doc;
+//     dataDoc: Doc;
+//     docView: DocumentView;
+//     width: number;
+// }
+
+@observer
+export class PropertiesView extends React.Component<{}> {
+
+    render() {
+        return <div className="propertiesView" >
+            <div className="propertiesView-title">
+                Properties
+            </div>
+            <div className="propertiesView-name">
+                Properties
+            </div>
+            <div className="propertiesView-settings">
+                Settings
+            </div>
+            <div className="propertiesView-fields">
+                Fields
+            </div>
+            <div className="propertiesView-layout">
+                Layout
+            </div>
+        </div>;
+    }
+} 
\ No newline at end of file