aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/ContextMenu.scss3
-rw-r--r--src/client/views/DocumentDecorations.scss3
-rw-r--r--src/client/views/Main.scss63
-rw-r--r--src/client/views/Main.tsx42
-rw-r--r--src/client/views/_global_variables.scss4
-rw-r--r--src/client/views/nodes/DocumentView.scss4
6 files changed, 92 insertions, 27 deletions
diff --git a/src/client/views/ContextMenu.scss b/src/client/views/ContextMenu.scss
index ea40c8e99..8786a623f 100644
--- a/src/client/views/ContextMenu.scss
+++ b/src/client/views/ContextMenu.scss
@@ -1,3 +1,4 @@
+@import "global_variables";
.contextMenu-cont {
position: absolute;
display: flex;
@@ -31,7 +32,7 @@
.contextMenu-item:hover {
transition: all .1s;
- background: #B0E0E6;
+ background: $light-emphasis;
}
.contextMenu-description {
diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss
index e8b93a18b..e86b67565 100644
--- a/src/client/views/DocumentDecorations.scss
+++ b/src/client/views/DocumentDecorations.scss
@@ -1,3 +1,4 @@
+@import 'global_variables';
#documentDecorations-container {
position: absolute;
display: grid;
@@ -10,7 +11,7 @@
}
.documentDecorations-resizer {
pointer-events: auto;
- background: lightblue;
+ background: $light-emphasis;
opacity: 0.4;
}
#documentDecorations-topLeftResizer,
diff --git a/src/client/views/Main.scss b/src/client/views/Main.scss
index 4334ed299..f8c7e24d5 100644
--- a/src/client/views/Main.scss
+++ b/src/client/views/Main.scss
@@ -1,3 +1,4 @@
+@import "global_variables";
html,
body {
width: 100%;
@@ -13,7 +14,7 @@ h1 {
top: 30px;
left: 50%;
transform: translateX(-50%);
- color: black;
+ color: $dark-color;
text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
z-index: 9999;
font-family: 'Fjalla One', sans-serif;
@@ -29,23 +30,71 @@ p {
margin: 0px;
padding: 0px;
}
+
::-webkit-scrollbar {
-webkit-appearance: none;
- height:5px;
- width:5px;
+ height: 5px;
+ width: 5px;
}
+
::-webkit-scrollbar-thumb {
border-radius: 2px;
- background-color: rgba(0,0,0,.5);
+ background-color: rgba(0, 0, 0, .5);
+}
+
+// button stuff
+button {
+ background: $dark-color;
+ outline: none;
+ border: 0px;
+ color: $light-color;
+ text-transform: uppercase;
+ letter-spacing: 2px;
+ font-size: 75%;
+ padding: 10px;
}
-.main-buttonDiv {
+button:hover {
+ background: $dark-emphasis;
+}
+
+.clear-db-button {
position: absolute;
- width: 150px;
- left: 0px;
+ left: 47%;
+ bottom: 1em;
+ font-size: 50%;
+}
+
+.add-button {
+ position: absolute;
+ left: 1em;
+ bottom: 1em;
+ width: 2em;
+ height: 2em;
+ border-radius: 1em;
+ font-size: 24px;
}
+
.main-undoButtons {
position: absolute;
width: 150px;
right: 0px;
}
+
+// goldenlayout stuff
+div .lm_header {
+ background: $dark-color;
+ min-height: 2em;
+}
+
+.lm_tab {
+ margin-top: 0.7em !important;
+ padding-top: 0.5em !important;
+ min-height: 1.4em;
+ padding-bottom: 0px;
+ border-radius: 5px;
+}
+
+.lm_header .lm_controls {
+ right: 1em !important;
+} \ No newline at end of file
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index c9bdc24c2..ca3bb76d2 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -33,6 +33,7 @@ document.addEventListener("pointerdown", action(function (e: PointerEvent) {
const mainDocId = "mainDoc";
let mainContainer: Document;
let mainfreeform: Document;
+
Documents.initProtos(mainDocId, (res?: Document) => {
if (res instanceof Document) {
mainContainer = res;
@@ -51,6 +52,11 @@ Documents.initProtos(mainDocId, (res?: Document) => {
}, 0);
}
+
+ let specificContextMenu = (e: React.MouseEvent): void => {
+ ContextMenu.Instance.addItem({ description: "Freeform", event: () => console.log("dsjflkaj") });
+ }
+
let imgurl = "https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Cat03.jpg/1200px-Cat03.jpg";
let pdfurl = "http://www.adobe.com/support/products/enterprise/knowledgecenter/media/c4611_sample_explain.pdf"
let weburl = "https://cs.brown.edu/courses/cs166/";
@@ -86,22 +92,26 @@ Documents.initProtos(mainDocId, (res?: Document) => {
ContainingCollectionView={undefined} />
<DocumentDecorations />
<ContextMenu />
- <div className="main-buttonDiv" style={{ bottom: '0px' }} ref={imgRef} >
- <button onPointerDown={setupDrag(imgRef, addImageNode)} onClick={addClick(addImageNode)}>Add Image</button></div>
- <div className="main-buttonDiv" style={{ bottom: '25px' }} ref={webRef} >
- <button onPointerDown={setupDrag(webRef, addWebNode)} onClick={addClick(addWebNode)}>Add Web</button></div>
- <div className="main-buttonDiv" style={{ bottom: '50px' }} ref={textRef}>
- <button onPointerDown={setupDrag(textRef, addTextNode)} onClick={addClick(addTextNode)}>Add Text</button></div>
- <div className="main-buttonDiv" style={{ bottom: '75px' }} ref={colRef}>
- <button onPointerDown={setupDrag(colRef, addColNode)} onClick={addClick(addColNode)}>Add Collection</button></div>
- <div className="main-buttonDiv" style={{ bottom: '100px' }} ref={schemaRef}>
- <button onPointerDown={setupDrag(schemaRef, addSchemaNode)} onClick={addClick(addSchemaNode)}>Add Schema</button></div>
- <div className="main-buttonDiv" style={{ bottom: '125px' }} >
- <button onClick={clearDatabase}>Clear Database</button></div>
- <div className="main-buttonDiv" style={{ bottom: '150px' }} ref={pdfRef}>
- <button onPointerDown={setupDrag(pdfRef, addPDFNode)} onClick={addClick(addPDFNode)}>Add PDF</button></div>
- <button className="main-undoButtons" style={{ bottom: '25px' }} onClick={() => UndoManager.Undo()}>Undo</button>
- <button className="main-undoButtons" style={{ bottom: '0px' }} onClick={() => UndoManager.Redo()}>Redo</button>
+ <button className="clear-db-button" onClick={clearDatabase}>Clear Database</button>
+ <button className="add-button" onClick={specificContextMenu}>+</button>
+ <ul>
+ <li><div className="main-buttonDiv" ref={imgRef} >
+ <button onPointerDown={setupDrag(imgRef, addImageNode)} onClick={addClick(addImageNode)}>Add Image</button></div></li>
+ <li><div className="main-buttonDiv" ref={webRef} >
+ <button onPointerDown={setupDrag(webRef, addWebNode)} onClick={addClick(addWebNode)}>Add Web</button></div></li>
+ <li><div className="main-buttonDiv" ref={textRef}>
+ <button onPointerDown={setupDrag(textRef, addTextNode)} onClick={addClick(addTextNode)}>Add Text</button></div></li>
+ <li><div className="main-buttonDiv" ref={colRef}>
+ <button onPointerDown={setupDrag(colRef, addColNode)} onClick={addClick(addColNode)}>Add Collection</button></div></li>
+ <li><div className="main-buttonDiv" ref={schemaRef}>
+ <button onPointerDown={setupDrag(schemaRef, addSchemaNode)} onClick={addClick(addSchemaNode)}>Add Schema</button></div></li>
+ <li></li>
+ <li><div className="main-buttonDiv" ref={pdfRef}>
+ <button onPointerDown={setupDrag(pdfRef, addPDFNode)} onClick={addClick(addPDFNode)}>Add PDF</button></div></li>
+ <button className="main-undoButtons" style={{ bottom: '25px' }} onClick={() => UndoManager.Undo()}>Undo</button>
+ <button className="main-undoButtons" style={{ bottom: '0px' }} onClick={() => UndoManager.Redo()}>Redo</button>
+ </ul>
+
<InkingControl />
</div>),
document.getElementById('root'));
diff --git a/src/client/views/_global_variables.scss b/src/client/views/_global_variables.scss
new file mode 100644
index 000000000..5ed767258
--- /dev/null
+++ b/src/client/views/_global_variables.scss
@@ -0,0 +1,4 @@
+$light-color: #FCFBF7;
+$dark-color: #121721;
+$dark-emphasis: #61AAA3;
+$light-emphasis: #AFCBFF; \ No newline at end of file
diff --git a/src/client/views/nodes/DocumentView.scss b/src/client/views/nodes/DocumentView.scss
index ab913897b..5797fde45 100644
--- a/src/client/views/nodes/DocumentView.scss
+++ b/src/client/views/nodes/DocumentView.scss
@@ -1,7 +1,7 @@
+@import "../global_variables";
.documentView-node {
position: absolute;
- background: #cdcdcd;
- //overflow: hidden;
+ background: $light-color; //overflow: hidden;
&.minimized {
width: 30px;
height: 30px;
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-10 20:19:27 +0000