From fccb746640f9c832a660eb328d3196c8e50d5794 Mon Sep 17 00:00:00 2001
From: madelinegr <mgriswold99@gmail.com>
Date: Tue, 26 Feb 2019 18:18:36 -0500
Subject: css mostly

---
 src/client/views/Main.tsx              |  4 +++-
 src/client/views/PresentationView.scss | 29 +++++++++++++++++++++++++++++
 src/client/views/PresentationView.tsx  | 11 ++++++-----
 3 files changed, 38 insertions(+), 6 deletions(-)
 create mode 100644 src/client/views/PresentationView.scss

(limited to 'src')

diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index 91d9909bb..3b03899d6 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -69,7 +69,8 @@ Documents.initProtos(() => {
             mainContainer = Documents.DockDocument(JSON.stringify({ content: [{ type: 'row', content: [] }] }), { title: "main container" }, mainDocId);
             Utils.Emit(Server.Socket, MessageStore.AddDocument, new DocumentTransfer(mainContainer.ToJson()))
 
-            mainContainer.Set(KeyStore.PresentationView, Documents.FreeformDocument([], { title: "Presentation" }));
+            //save a document for the presentation view in Key Store - this is where title is set
+            mainContainer.Set(KeyStore.PresentationView, Documents.FreeformDocument([], { title: "Presentation Mode" }));
 
             setTimeout(() => {
                 mainfreeform = Documents.FreeformDocument([], { x: 0, y: 400, title: "mini collection" });
@@ -130,6 +131,7 @@ Documents.initProtos(() => {
                 </div>),
                 document.getElementById('root'));
         }
+        //call render async passing in the doc saved in PresentationView key
         mainContainer.GetAsync(KeyStore.PresentationView, render);
     })
 });
diff --git a/src/client/views/PresentationView.scss b/src/client/views/PresentationView.scss
new file mode 100644
index 000000000..c635f51ea
--- /dev/null
+++ b/src/client/views/PresentationView.scss
@@ -0,0 +1,29 @@
+.presentationView-cont {
+    position: absolute;
+    background: blue;
+    z-index: 1;
+    box-shadow: #AAAAAA .2vw .2vw .4vw;
+    right: 0;
+    top:0;
+    bottom:0;
+}
+
+.presentationView-item {
+    width: 10vw;
+    height: 6vh;
+    background: #DDDDDD;
+    flex-direction: column;
+    
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    transition: all .1s;
+}
+
+.presentationView-item:hover {
+    transition: all .1s;
+    background: #AAAAAA
+}
\ No newline at end of file
diff --git a/src/client/views/PresentationView.tsx b/src/client/views/PresentationView.tsx
index 081f8533c..045a5acc7 100644
--- a/src/client/views/PresentationView.tsx
+++ b/src/client/views/PresentationView.tsx
@@ -7,6 +7,7 @@ import { TextField } from "../../fields/TextField";
 import { observable, action } from "mobx";
 import { Field } from "../../fields/Field";
 import { Documents } from '../documents/Documents';
+import "./PresentationView.scss"
 
 export interface PresViewProps {
     Document: Document;
@@ -28,11 +29,11 @@ class PresentationViewItem extends React.Component<PresViewProps> {
 
         // if the title hasn't loaded, immediately return the div
         if (!title || title === "<Waiting>") {
-            return <div key={document.Id}></div>;
+            return <div className="presentationView-item" key={document.Id}></div>;
         }
         // finally, if it's a normal document, then render it as such.
         else {
-            return <li key={document.Id}>{title.Data}</li>;
+            return <li className="presentationView-item" key={document.Id}>{title.Data}</li>;
         }
     }
 
@@ -116,9 +117,9 @@ export class PresentationView extends React.Component<PresViewProps>  {
         }
         let width = this.collapsed ? 100 : 300;
         return (
-            <div background-color="lightblue" max-width={width}>
-                <h3>{titleStr}</h3>
-                <ul className="no-indent">
+            <div className="presentationView-cont" max-width={width}>
+                <h2>{titleStr}</h2>
+                <ul>
                     <PresentationViewItem
                         Document={this.props.Document}
                     />
-- 
cgit v1.2.3-70-g09d2