new spaces view

New modal dialog framework used for Add Space.

gui/app/styles/app.scss

@@ -13,8 +13,9 @@
 @import "mixins.scss";
 @import "base.scss";
 @import "bootstrap.scss";
+
 @import "widget/widget.scss";
-@import "view/layout.scss";
+@import "view/layout.scss"; // junk?
 @import "view/page-search.scss";
 @import "view/page-profile.scss";
 @import "view/page-customize.scss";
@@ -25,10 +26,11 @@
 @import "view/document/all.scss";
 @import "view/common.scss";
 
+@import "view/navigation.scss";
+@import "view/toolbar.scss";
 @import "view/views.scss";
 
 @import "vendor.scss";
-@import "responsive.scss";
 @import "print.scss";
 @import "section/trello.scss";
 @import "section/gemini.scss";

gui/app/styles/bootstrap.scss

@@ -48,6 +48,9 @@ $modal-footer-border-color: 	$color-white;
 $border-radius:		.125rem;
 $border-radius-lg:  .15rem;
 $border-radius-sm:  .1rem;
+$border-radius:		0;
+$border-radius-lg:  0;
+$border-radius-sm:  0;
 
 // dropdown
 $dropdown-link-color:               $color-off-black;

gui/app/styles/color.scss

@@ -10,7 +10,7 @@
 // https://documize.com
 
 // Theme colors
-$color-primary: #351056;
+$color-primary: #290F3F; //#351056;
 $color-primary-light: #F7F2FF;
 $color-link: #1b701e;
 

gui/app/styles/mixins.scss

@@ -39,7 +39,7 @@
 	box-shadow: 1px 1px 3px 0px rgba(211,211,211,1);
 
 	&:hover {
-		background-color: darken($color-card, 3%);
+		background-color: darken($color-card, 5%);
 		color: $color-link;
 	}
 }

gui/app/styles/view/layout.scss

@@ -1,33 +1,3 @@
-.nav-bar {
-	background-color: $color-primary;
-	padding: 10px 20px;
-	color: $color-white;
-	font-size: 1rem;
-
-	.nav-link, .nav-link:visited {
-		color: $color-white;
-
-		&:hover {
-			color: darken($color-white, 15%);
-		}
-	}
-
-	.nav-title {
-		font-size: 1.4rem;
-		font-weight: bold;
-	}
-
-	.nav-msg {
-		font-size: 0.875rem;
-	}
-
-	.nav-right {
-		float: right;
-	}
-}
-
-
-
 
 // pre-nov17 UX
 $sidebar-width: 400px;
@@ -82,15 +52,6 @@ $sidebar-width: 400px;
 	}
 }
 
-@media(min-width:768px) {
-    #wrapper {
-        padding-left: $sidebar-width;
-    }
-
-    #sidebar-wrapper {
-        width: $sidebar-width;
-    }
-}
 
 .sidebar-common {
 	display: inline-block;
@@ -152,36 +113,6 @@ $sidebar-width: 400px;
 	}
 }
 
-.navigation {
-	margin: 0 0 0 0;
-    padding: 10px 0;
-    text-align: center;
-    background-color: $color-sidebar-navigation;
-    border-bottom: 1px solid $color-sidebar-navigation-border;
-
-	.round-button-mono {
-		> .material-icons {
-			color: $color-gray;
-			@include ease-in();
-		}
-
-		&:hover {
-			> .material-icons {
-				color: $color-link;
-			}
-		}
-	}
-
-	.profile-link {
-		color: $color-primary;
-		text-align: center;
-		font-size: 1rem;
-		font-style: normal;
-		font-family: $font-regular;
-		vertical-align: top;
-	}
-}
-
 .document-sidebar-toolbar {
 	margin: 10px 0 0 0;
     padding: 10px 0;

gui/app/styles/view/navigation.scss

@@ -0,0 +1,27 @@
+.nav-bar {
+	background-color: $color-primary;
+	padding: 10px 20px;
+	color: $color-white;
+	font-size: 1rem;
+
+	.nav-link, .nav-link:visited {
+		color: $color-white;
+
+		&:hover {
+			color: darken($color-white, 15%);
+		}
+	}
+
+	.nav-title {
+		font-size: 1.4rem;
+		font-weight: bold;
+	}
+
+	.nav-msg {
+		font-size: 1rem;
+	}
+
+	.nav-right {
+		float: right;
+	}
+}

gui/app/styles/view/toolbar.scss

@@ -0,0 +1,28 @@
+.toolbar {
+	margin: 30px 0 0 0;
+
+	> .links {
+		display: inlne-block;
+
+		> .link {
+			color: $color-gray;
+			font-size: 1.1rem;
+			font-weight: bold;
+			display: inline-block;
+			margin-right: 30px;
+			cursor: pointer;
+
+			&:hover {
+				color: $color-link;
+			}
+		}
+
+		> .selected {
+			color: $color-link;
+		}
+	}
+
+	> .buttons {
+		float: right;
+	}
+}