diff --git a/.gitignore b/.gitignore
index a21677383a98825c37911974586821109b7c0a67..600a344211eb756d858efc918785035ed07f6349 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,6 +1,8 @@
node_modules
javascripts/maps
javascripts/spacedeck.js
+public/stylesheets/*.css
+database.sqlite
*.swp
*~
diff --git a/package.json b/package.json
index 70fcadaa06b1b169178691f286e7c9b591074dd6..59c73697c8bafb1fc4472062215e954bc1e7c3a4 100644
--- a/package.json
+++ b/package.json
@@ -32,6 +32,7 @@
"moment": "^2.19.3",
"morgan": "^1.9.1",
"node-phantom-simple": "2.2.4",
+ "node-server-screenshot": "^0.2.1",
"nodemailer": "^4.6.7",
"phantomjs-prebuilt": "^2.1.16",
"read-chunk": "^2.1.0",
diff --git a/public/javascripts/spacedeck_sections.js b/public/javascripts/spacedeck_sections.js
index 04afb538d500d46bfaff0d365c146957fd7130a5..f7b2b863a40a0288b352208463477dbb1eacb92b 100644
--- a/public/javascripts/spacedeck_sections.js
+++ b/public/javascripts/spacedeck_sections.js
@@ -63,8 +63,8 @@ var SpacedeckSections = {
active_style: {
border_radius: 0,
stroke: 0,
- font_family: "Avenir W01",
- font_size: 18,
+ font_family: "Inter",
+ font_size: 36,
line_height: 1.5,
letter_spacing: 0,
@@ -136,18 +136,8 @@ var SpacedeckSections = {
],
fonts: [
- "Arial",
- "Courier",
- "Georgia",
- "Verdana",
- "Comic Sans MS",
- "Montserrat",
- "Lato",
- "Roboto",
- "Crimson Text",
- "EB Garamond",
- "Vollkorn",
- "Avenir W01"
+ "Inter",
+ "Courier"
],
detected_text_formats: {},
@@ -180,7 +170,7 @@ var SpacedeckSections = {
toolbar_props_in: false,
toolbar_artifacts_x: "-1000px",
toolbar_artifacts_y: "-1000px",
- toolbar_artifacts_in: false
+ toolbar_artifacts_in: true
},
methods: {
@@ -1057,7 +1047,7 @@ var SpacedeckSections = {
this.toolbar_props_x = pp.x+"px";
this.toolbar_props_y = pp.y+"px";
- this.hide_toolbar_artifacts();
+ //this.hide_toolbar_artifacts();
}
this.selection_metrics.x1 = sr.x1;
@@ -1125,9 +1115,12 @@ var SpacedeckSections = {
var er = this.enclosing_rect(this.active_space_artifacts);
if (!er) return;
- this.active_space.width =Math.max(er.x2+100, window.innerWidth);
- this.active_space.height=Math.max(er.y2+100, window.innerHeight);
+ // resize space
+ this.active_space.width =Math.max((parseInt(er.x2/window.innerWidth)+2)*window.innerWidth, window.innerWidth);
+ this.active_space.height=Math.max((parseInt(er.y2/window.innerHeight)+2)*window.innerHeight, window.innerHeight);
+ console.log("bounds: ",this.active_space.width,this.active_space.height);
+
if (this._last_bounds_width != this.active_space.width ||
this._last_bounds_height != this.active_space.height) {
this._last_bounds_width = this.active_space.width;
@@ -1544,7 +1537,7 @@ var SpacedeckSections = {
add_artifact: function (space, item_type, url, evt) {
this.active_tool = "pointer";
this.mouse_state = "idle";
- this.hide_toolbar_artifacts();
+ //this.hide_toolbar_artifacts();
if (!url && (item_type == 'image' || item_type == 'video' || item_type == 'embed')) {
url = prompt("URL?");
@@ -1788,9 +1781,7 @@ var SpacedeckSections = {
if (this.active_space_role=="viewer") {
return false;
}
-
- this.hide_toolbar_artifacts();
-
+
// 1. create placeholder artifact
var w=300,h=150;
var fill="transparent";
@@ -2578,12 +2569,11 @@ var SpacedeckSections = {
},
hide_toolbar_props: function() {
- this.toolbar_props_in = false;
+ // FIXME test
+ //this.toolbar_props_in = false;
},
show_toolbar_artifacts: function(x,y) {
- this.toolbar_artifacts_x = (x-175)+"px";
- this.toolbar_artifacts_y = y+"px";
this.toolbar_artifacts_in = true;
},
@@ -2593,29 +2583,19 @@ var SpacedeckSections = {
start_adding_artifact: function(evt) {
evt = fixup_touches(evt);
-
- // toggle
- if (this.toolbar_artifacts_in) {
- this.hide_toolbar_artifacts();
- return;
- }
- this.show_toolbar_artifacts(evt.pageX,evt.pageY);
},
start_drawing_scribble: function(evt) {
- this.hide_toolbar_artifacts();
this.active_tool = "scribble";
this.opened_dialog = "none";
},
start_drawing_arrow: function(evt) {
- this.hide_toolbar_artifacts();
this.active_tool = "arrow";
this.opened_dialog = "none";
},
start_drawing_line: function(evt) {
- this.hide_toolbar_artifacts();
this.active_tool = "line";
this.opened_dialog = "none";
},
diff --git a/public/javascripts/spacedeck_spaces.js b/public/javascripts/spacedeck_spaces.js
index 8e39893df0da8782939b8afaf65909f1e570c676..71778d7db9d6ee38e0dba22d29589a7d50ef71ab 100644
--- a/public/javascripts/spacedeck_spaces.js
+++ b/public/javascripts/spacedeck_spaces.js
@@ -273,9 +273,9 @@ var SpacedeckSpaces = {
this.discover_zones();
- //window.setTimeout(function() {
- // this.zoom_to_fit();
- //}.bind(this),10);
+ window.setTimeout(function() {
+ this.zoom_to_fit();
+ }.bind(this),10);
if (on_success) {
on_success();
@@ -876,10 +876,6 @@ var SpacedeckSpaces = {
}.bind(this));
},
- emojified_comment: function(comment) {
- return twemoji.parse(comment);
- },
-
set_folder_sorting: function(key,reverse) {
this.folder_sorting = key;
this.folder_reverse = reverse?-1:1;
diff --git a/public/javascripts/spacedeck_whiteboard.js b/public/javascripts/spacedeck_whiteboard.js
index 9bdb4ec962e6fb7dbd10269db3ab50730e3cb33a..1586fc325614b3836de17eedc6f4baf5d41d708f 100644
--- a/public/javascripts/spacedeck_whiteboard.js
+++ b/public/javascripts/spacedeck_whiteboard.js
@@ -80,10 +80,16 @@ function setup_whiteboard_directives() {
evt.stopPropagation();
}
- var a = $scope.find_artifact_by_id(evt.currentTarget.id.replace("artifact-",""));
-
if ($scope.active_tool == "zoom") return;
+ if (evt.which == 2) {
+ // middle mouse button
+ this.handle_mouse_down_space(evt);
+ return;
+ }
+
+ var a = $scope.find_artifact_by_id(evt.currentTarget.id.replace("artifact-",""));
+
if ($scope.active_tool == "eyedrop") {
var arts = $scope.selected_artifacts();
if (!$scope.is_selected(a) && arts.length > 0) {
@@ -196,8 +202,10 @@ function setup_whiteboard_directives() {
},
handle_mouse_down_space: function(evt) {
- if (evt.target != evt.currentTarget && !_.include(["wrapper"],evt.target.className)) return;
-
+ if (evt.which != 2) {
+ if (evt.target != evt.currentTarget && !_.include(["wrapper"],evt.target.className)) return;
+ }
+
var $scope = this.vm.$root;
$scope.opened_dialog="none";
@@ -214,7 +222,7 @@ function setup_whiteboard_directives() {
this.deselect();
this.mouse_state = "transform";
$scope.mouse_state = this.mouse_state;
- this.start_adding_note(evt);
+ this.start_drawing_note(evt);
return;
} else if ($scope.active_tool=="arrow") {
@@ -492,6 +500,7 @@ function setup_whiteboard_directives() {
if (!xdists[0] || xdists[0][0]>TOL) {
results.snapx = [0,x]; // distance, coordinate
} else {
+ // FIXME snap rulers are broken
//$scope.snap_ruler_x = xdists[0][1];
}
if (!ydists[0] || ydists[0][0]>TOL) {
@@ -516,6 +525,41 @@ function setup_whiteboard_directives() {
return point;
},
+ start_drawing_note: function(evt) {
+ evt.preventDefault();
+ evt.stopPropagation();
+
+ var $scope = this.vm.$root;
+ var point = this.cursor_point_to_space(evt);
+ this.offset_point_in_wrapper(point);
+ var z = $scope.highest_z()+1;
+
+ var a = {
+ space_id: $scope.active_space._id,
+ mime: "text/html",
+ description: "<p>Text</p>",
+ x: point.x,
+ y: point.y,
+ z: z,
+ w: 64,
+ h: 64,
+ align: "center",
+ valign: "middle",
+ stroke_color: "#000000",
+ fill_color: "rgb(241, 196, 15)",
+ stroke: 0
+ };
+
+ $scope.save_artifact(a, function(saved_a) {
+ $scope.update_board_artifact_viewmodel(saved_a);
+ $scope.active_space_artifacts.push(saved_a);
+ $scope.select(evt,a);
+ $scope.transform_ox = 0;
+ $scope.transform_oy = 0;
+ $scope.begin_transaction();
+ }.bind(this));
+ },
+
start_drawing_scribble: function(evt) {
evt.preventDefault();
evt.stopPropagation();
@@ -851,7 +895,7 @@ function setup_whiteboard_directives() {
var scale_x = lead_x ? (moved_x)/lead_x : 1;
var scale_y = lead_y ? (moved_y)/lead_y : 1;
- if (!$scope.transform_lock) scale_y = scale_x;
+ if ($scope.transform_lock) scale_y = scale_x;
$scope.update_selected_artifacts(function(a) {
var old_a = $scope.find_artifact_before_transaction(a);
diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css
index aea59dbacbeecc9c4e8d3c5a1f0ece190dd77406..6d40a5bdbc8116128bc5dad350dc50bef50ff70a 100644
--- a/public/stylesheets/style.css
+++ b/public/stylesheets/style.css
@@ -1995,11 +1995,6 @@
content: "\E275"; }
/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
-html {
- font-family: sans-serif;
- -ms-text-size-adjust: 100%;
- -webkit-text-size-adjust: 100%; }
-
body {
margin: 0; }
@@ -2692,7 +2687,7 @@ body {
color: #888;
font-weight: 300;
font-weight: 400;
- font-family: Avenir W01, sans-serif;
+ font-family: Inter, sans-serif;
font-weight: 300;
font-size: 15px;
line-height: 1.6; }
@@ -2842,8 +2837,8 @@ select {
max-width: 100%;
vertical-align: middle;
font-weight: 300;
- font-family: Avenir W01;
- font-size: 18px;
+ font-family: Inter;
+ font-size: 12pt;
line-height: normal;
color: #222;
background-color: rgba(0, 0, 0, 0.01);
@@ -2885,23 +2880,17 @@ select {
padding-left: 0 !important; }
.input.input-white {
background-color: white;
- color: #888;
box-shadow: inset 0 0 1px 1px rgba(0, 0, 0, 0.05), inset 0 0px 4px rgba(0, 0, 0, 0.1); }
.input.input-light {
- background-color: #f5f5f5;
- color: #888; }
+ background-color: #f5f5f5; }
.input.input-dark {
- background-color: #292929;
- color: #888; }
+ background-color: #292929; }
.input.input-lighten {
- background-color: rgba(255, 255, 255, 0.05);
- color: #888 !important; }
+ background-color: rgba(255, 255, 255, 0.05); }
.input.input-darken {
- background-color: rgba(0, 0, 0, 0.05);
- color: #888; }
+ background-color: rgba(0, 0, 0, 0.05); }
.input.input-transparent {
- background-color: transparent;
- color: #888; }
+ background-color: transparent; }
.input:focus {
outline: 0; }
.input:-moz-placeholder {
@@ -3296,7 +3285,7 @@ form .alert {
font-size: 13px;
line-height: 1;
color: #222;
- font-family: Avenir W01;
+ font-family: Inter;
width: 100%;
white-space: nowrap; }
.label.label-sm {
@@ -3358,7 +3347,7 @@ form .alert {
padding-left: 20px;
max-width: 100%;
font-weight: 300;
- font-family: Avenir W01;
+ font-family: Inter;
font-size: 22px;
line-height: 60px;
color: #888;
@@ -5390,7 +5379,6 @@ form .alert {
line-height: 1.5;
width: 100%;
text-align: left;
- color: #888;
font-weight: normal;
cursor: pointer;
border-radius: 3px;
@@ -5678,18 +5666,13 @@ output {
letter-spacing: 0.1em; }
.input-select {
+ background-color: rgba(255, 255, 255, 0.04);
+ background-image: url("images/select_arrow.gif");
border-radius: 3px;
display: inline-block;
width: 100%; }
-@-moz-document url-prefix() {
- select.input {
- background-repeat: no-repeat;
- background-position: right center;
- cursor: pointer; } }
-
select {
- -webkit-appearance: none;
appearance: none;
padding-left: 0px;
width: 100%; }
@@ -5699,8 +5682,9 @@ select {
.table {
width: 100%;
- color: #888;
- font-family: Avenir W01; }
+ font-family: Inter;
+ border-radius: 3px;
+ border: 2px solid rgba(0, 0, 0, 0.0125); }
.table thead > tr > th:first-child,
.table tbody > tr > th:first-child,
@@ -5784,7 +5768,7 @@ select {
height: 60px;
width: 60px;
display: inline-block;
- font-family: Avenir W01;
+ font-family: Inter;
font-size: 30px;
font-size: 25px;
line-height: 60px;
@@ -7948,14 +7932,14 @@ select {
background-size: cover;
background-position: center;
border-radius: 3px;
- font-family: Avenir W01;
+ font-family: Inter;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
cursor: pointer;
background-color: #f5f5f5;
- color: #888;
+ color: #111;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
@@ -7973,12 +7957,6 @@ select {
.btn.btn-link {
background-color: transparent;
color: #888; }
- .btn.facebook {
- background-color: #3e5b97 !important;
- color: white !important; }
- .btn.twitter {
- background-color: #2aa7de !important;
- color: white !important; }
.btn.btn-round {
border-radius: 100px !important; }
.btn.btn-rounded {
@@ -7986,22 +7964,21 @@ select {
.btn.btn-nude {
min-width: 0 !important;
padding: 0 !important;
- background-color: transparent;
- color: #888; }
+ background-color: transparent; }
.btn.btn-nude + .btn-nude:before {
content: "·";
margin: 0 3px;
color: rgba(0, 0, 0, 0.3); }
.btn.btn-stroke {
box-shadow: inset 0 0 0 1px #222;
- color: #222 !important;
+ color: #111;
background-color: transparent; }
.btn.btn-stroke:active {
box-shadow: inset 0 0 0 1px white;
color: white !important; }
.btn.btn-stroke-darken {
- border: 1px solid rgba(0, 0, 0, 0.1);
- color: #888;
+ border: 1px solid #111;
+ color: #111;
background-color: transparent; }
.btn.btn-stroke-darken:active {
border: 1px solid #222;
@@ -8084,11 +8061,14 @@ select {
pointer-events: none; }
.btn.btn-transparent {
background-color: transparent;
- color: #888; }
+ color: #222; }
.btn.btn-transparent.active {
- color: #292929 !important; }
+ color: #ffffff;
+ background-color: #111; }
.btn.btn-transparent.open {
- color: white !important; }
+ color: #ffffff;
+ background-color: #111;
+ border-radius: 0; }
.btn.btn-transparent-medium {
background-color: transparent;
color: #888; }
@@ -8326,7 +8306,7 @@ select {
position: absolute;
top: 100%;
left: 0;
- font-size: 18px;
+ font-size: 12pt;
color: #888;
margin-top: 10px; }
.btn.btn-social {
@@ -8546,7 +8526,6 @@ select {
.btn-cluster .icon:after, .btn-cluster .icon:before {
width: 100%; }
.btn-cluster > * {
- border-radius: 0 !important;
background-clip: padding-box;
width: 100%;
float: left; }
@@ -8599,9 +8578,6 @@ select {
transform: scale(1, 1); }
.btn-circle .btn-group {
- -webkit-transform: scale(0, 0);
- -ms-transform: scale(0, 0);
- transform: scale(0, 0);
position: absolute;
top: -100%;
left: -100%;
@@ -8610,9 +8586,6 @@ select {
font-size: 0px;
margin-left: -12px; }
.btn-circle .btn-group .btn {
- -webkit-transform: scale(0, 0);
- -ms-transform: scale(0, 0);
- transform: scale(0, 0);
margin: 0 4px; }
.btn-circle .btn-group .btn:first-child {
margin-left: 17.35%; }
@@ -8877,30 +8850,6 @@ select {
border-top-right-radius: 3px !important;
border-bottom-right-radius: 3px !important; }
-.btn-group.bottom-left > .btn {
- border-radius: 0px; }
- .btn-group.bottom-left > .btn:first-child {
- border-top-left-radius: 0px;
- border-bottom-left-radius: 0px; }
- .btn-group.bottom-left > .btn.last, .btn-group.bottom-left > .btn:last-child {
- border-top-right-radius: 3px;
- border-bottom-right-radius: 0px; }
-
-.btn-xyz {
- position: relative;
- display: inline-block;
- line-height: 0px;
- padding: 0px;
- font-size: 0px;
- vertical-align: middle;
- white-space: nowrap;
- min-height: 44px; }
- .btn-xyz:before, .btn-xyz:after {
- content: " ";
- display: table; }
- .btn-xyz:after {
- clear: both; }
-
.btn-group {
position: relative;
display: inline-block;
@@ -8908,13 +8857,15 @@ select {
padding: 0px;
font-size: 0px;
vertical-align: middle;
- white-space: nowrap; }
+ white-space: nowrap;
+ border: 1px solid #222;
+ border-radius: 5px; }
.btn-group.dark {
border-radius: 3px;
background-color: #222;
- color: #989898; }
+ color: #ffffff; }
.btn-group.dark .btn {
- color: #989898; }
+ color: #ffffff; }
.btn-group.lighten {
background-color: rgba(255, 255, 255, 0.3);
color: #888; }
@@ -9049,10 +9000,9 @@ select {
transform: translateY(1%); }
.contained-dropdown .overflow-y-scroll ul li span {
text-align: center;
- font-size: 18px;
- line-height: 24px; }
+ font-size: 12pt;
+ line-height: 1.5em; }
.contained-dropdown.hover:hover, .contained-dropdown.open {
- background-color: #222;
background-color: #f5f5f5; }
.contained-dropdown.hover:hover > *, .contained-dropdown.open > * {
opacity: 1; }
@@ -9127,8 +9077,7 @@ select {
color: #888; }
.dropdown.light > .dropdown-menu,
.dropdown.light > .dialog {
- background: #f5f5f5;
- color: #888; }
+ background: white; }
.dropdown > .dropdown-menu {
box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.05), 0 2px 7px rgba(0, 0, 0, 0.1);
-webkit-backface-visibility: hidden;
@@ -9178,80 +9127,37 @@ select {
filter: alpha(opacity=100);
pointer-events: auto !important;
display: block; }
- .dropdown.center.hover:hover > .dialog,
- .dropdown.center.hover:hover > .dropdown-menu, .dropdown.center.open > .dialog,
- .dropdown.center.open > .dropdown-menu {
- -webkit-transform: translate3d(-50%, -50%, 100px) scale(1);
- -ms-transform: translate3d(-50%, -50%, 100px) scale(1);
- transform: translate3d(-50%, -50%, 100px) scale(1); }
.dropdown.center > .dialog,
.dropdown.center > .dropdown-menu {
left: 50%;
top: 50%;
- margin-top: 0px;
- -webkit-transform-origin: center center;
- -moz-transform-origin: center center;
- -ms-transform-origin: center center;
- transform-origin: center center;
- -webkit-transform: translate3d(-50%, -50%, 100px) scale(0.93, 0.8);
- -ms-transform: translate3d(-50%, -50%, 100px) scale(0.93, 0.8);
- transform: translate3d(-50%, -50%, 100px) scale(0.93, 0.8); }
+ margin-top: 0px; }
.dropdown.bottomleft > .dialog,
.dropdown.bottomleft > .dropdown-menu {
top: auto;
bottom: 100%;
- margin-bottom: 16px;
- -webkit-transform-origin: bottom left;
- -moz-transform-origin: bottom left;
- -ms-transform-origin: bottom left;
- transform-origin: bottom left;
- -webkit-transform: translate3d(-33%, 0%, 100px) scale(0.93, 0.8);
- -ms-transform: translate3d(-33%, 0%, 100px) scale(0.93, 0.8);
- transform: translate3d(-33%, 0%, 100px) scale(0.93, 0.8); }
+ margin-bottom: 16px; }
.dropdown.bottom > .dialog,
.dropdown.bottom > .dropdown-menu {
top: auto;
bottom: 100%;
- margin-bottom: 16px;
- -webkit-transform-origin: bottom center;
- -moz-transform-origin: bottom center;
- -ms-transform-origin: bottom center;
- transform-origin: bottom center;
- -webkit-transform: translate3d(-50%, 0%, 100px) scale(0.93, 0.8);
- -ms-transform: translate3d(-50%, 0%, 100px) scale(0.93, 0.8);
- transform: translate3d(-50%, 0%, 100px) scale(0.93, 0.8); }
+ margin-bottom: 16px; }
.dropdown.top > .dialog,
.dropdown.top > .dropdown-menu {
top: 100%;
bottom: auto;
- margin-top: -16px;
- -webkit-transform-origin: top center;
- -moz-transform-origin: top center;
- -ms-transform-origin: top center;
- transform-origin: top center;
- -webkit-transform: translate3d(-50%, 0%, 100px) scale(0.93, 0.8);
- -ms-transform: translate3d(-50%, 0%, 100px) scale(0.93, 0.8);
- transform: translate3d(-50%, 0%, 100px) scale(0.93, 0.8); }
+ margin-top: -16px; }
+ .dropdown.top.left > .dialog,
+ .dropdown.top.left > .dropdown-menu {
+ left: 70px;
+ margin-top: -60px; }
.dropdown.top.right > .dialog,
.dropdown.top.right > .dropdown-menu {
top: 100%;
bottom: auto;
left: auto;
- right: 0;
- margin-top: 16px;
- -webkit-transform-origin: top right;
- -moz-transform-origin: top right;
- -ms-transform-origin: top right;
- transform-origin: top right;
- -webkit-transform: translate3d(0%, 0%, 100px) scale(0.93, 0.8);
- -ms-transform: translate3d(0%, 0%, 100px) scale(0.93, 0.8);
- transform: translate3d(0%, 0%, 100px) scale(0.93, 0.8); }
- .dropdown.top.right.hover:hover > .dialog,
- .dropdown.top.right.hover:hover > .dropdown-menu, .dropdown.top.right.open > .dialog,
- .dropdown.top.right.open > .dropdown-menu {
- -webkit-transform: translate3d(0%, 0%, 100px) scale(1);
- -ms-transform: translate3d(0%, 0%, 100px) scale(1);
- transform: translate3d(0%, 0%, 100px) scale(1); }
+ right: 70px;
+ margin-top: -60px; }
.dropdown.top, .dropdown.bottom, .dropdown.bottomleft {
/*&.open > .btn-group > .btn-icon-labeled:hover,
&.open > .btn-icon-labeled:hover {
@@ -9267,81 +9173,56 @@ select {
.dropdown.bottomleft.open > .btn-group > .btn-dark .jewel {
background-color: #fff !important;
border-color: #303030 !important; }
- .dropdown.top.hover:hover > .dialog,
- .dropdown.top.hover:hover > .dropdown-menu, .dropdown.top.open > .dialog,
- .dropdown.top.open > .dropdown-menu, .dropdown.bottom.hover:hover > .dialog,
- .dropdown.bottom.hover:hover > .dropdown-menu, .dropdown.bottom.open > .dialog,
- .dropdown.bottom.open > .dropdown-menu, .dropdown.bottomleft.hover:hover > .dialog,
- .dropdown.bottomleft.hover:hover > .dropdown-menu, .dropdown.bottomleft.open > .dialog,
- .dropdown.bottomleft.open > .dropdown-menu {
- -webkit-transform: translate3d(-50%, 0%, 100px) scale(1);
- -ms-transform: translate3d(-50%, 0%, 100px) scale(1);
- transform: translate3d(-50%, 0%, 100px) scale(1); }
- .dropdown.bottomleft.hover:hover > .dialog,
- .dropdown.bottomleft.hover:hover > .dropdown-menu, .dropdown.bottomleft.open > .dialog,
- .dropdown.bottomleft.open > .dropdown-menu {
- -webkit-transform: translate3d(-33%, 0%, 100px) scale(1) !important;
- -ms-transform: translate3d(-33%, 0%, 100px) scale(1) !important;
- transform: translate3d(-33%, 0%, 100px) scale(1) !important; }
-
-.dropdown.options-3.option-1:after {
- margin-left: -68px; }
-
-.dropdown.options-3.option-2:after {
- margin-left: -8px; }
-
-.dropdown.options-3.option-3:after {
- margin-left: 52px; }
-
-.dropdown.option-1:after {
- margin-left: -38px; }
-
-.dropdown.option-2:after {
- margin-left: 22px; }
-
-.dropdown.open:after {
- -webkit-transition: all 0.1s ease-in-out 0s;
- transition: all 0.1s ease-in-out 0s;
- -webkit-transform: scale(1);
- -ms-transform: scale(1);
- transform: scale(1); }
-
-.dropdown:after {
- -webkit-transition: all 0.1s ease-in-out 0s;
- transition: all 0.1s ease-in-out 0s;
- content: "";
- position: absolute;
- bottom: 100%;
- width: 0;
- height: 0;
- margin-left: -8px;
- pointer-events: none !important;
- left: 50%;
- -webkit-transform: scale(0, 0);
- -ms-transform: scale(0, 0);
- transform: scale(0, 0); }
-.dropdown.bottom:after, .dropdown.bottomleft:after {
- -webkit-transform-origin: bottom center;
- -moz-transform-origin: bottom center;
- -ms-transform-origin: bottom center;
- transform-origin: bottom center;
- bottom: 100%;
- border-bottom: 8px solid transparent;
- border-right: 8px solid transparent;
- border-top: 8px solid #303030;
- border-left: 8px solid transparent; }
+.dropdown {
+ /*&.options-3 {
+ &.option-1:after { margin-left: -68px;}
+ &.option-2:after { margin-left: -8px;}
+ &.option-3:after { margin-left: 52px;}
+ }
-.dropdown.top:after {
- -webkit-transform-origin: top center;
- -moz-transform-origin: top center;
- -ms-transform-origin: top center;
- transform-origin: top center;
- top: 100%;
- border-bottom: 8px solid #303030;
- border-right: 8px solid transparent;
- border-top: 8px solid transparent;
- border-left: 8px solid transparent; }
+ &.option-1:after { margin-left: -38px;}
+ &.option-2:after { margin-left: 22px;}
+
+ &.open:after {
+ @include transition( all 0.1s ease-in-out 0s);
+ -webkit-transform: scale(1);
+ -ms-transform: scale(1);
+ transform: scale(1);
+ }*/
+ /*
+ &:after {
+ @include transition( all 0.1s ease-in-out 0s);
+ content: "";
+ position: absolute;
+ bottom: 100%;
+ width: 0;
+ height: 0;
+ // margin-bottom: 8px;
+
+ margin-left: -8px;
+ pointer-events: none !important;
+ left: 50%;
+ //transform: scale(0,0);
+ }
+
+ &.bottom:after, &.bottomleft:after {
+ //@include transform-origin(bottom center);
+ bottom: 100%;
+ border-bottom: 8px solid transparent;
+ border-right: 8px solid transparent;
+ border-top: 8px solid #303030;
+ border-left: 8px solid transparent;
+ }
+*/
+ /*&.top:after {
+ @include transform-origin(top center);
+ top: 100%;
+ border-bottom: 8px solid #303030;
+ border-right: 8px solid transparent;
+ border-top: 8px solid transparent;
+ border-left: 8px solid transparent;
+ }*/ }
.separate .icon {
display: block; }
@@ -9438,7 +9319,7 @@ select {
transition: all 0.125s ease-in-out;
pointer-events: none;
background-color: #f5f5f5;
- color: #888;
+ color: #222;
border-radius: 9px;
box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.05), 0 2px 7px rgba(0, 0, 0, 0.1); }
.dialog ol, .dialog ul, .dialog p {
@@ -9560,7 +9441,7 @@ select {
.overflow-x-scroll ::-webkit-scrollbar,
.overflow-y-scroll::-webkit-scrollbar-corner,
.overflow-y-scroll ::-webkit-scrollbar {
- background-color: transparent; }
+ background-color: rgba(0, 0, 0, 0); }
.overflow-scroll::-webkit-scrollbar-thumb,
.overflow-hidden::-webkit-scrollbar-thumb,
.overflow-x-scroll::-webkit-scrollbar-thumb,
@@ -9723,8 +9604,8 @@ button.close {
-ms-transform: scale(1, 1);
transform: scale(1, 1); }
.modal .close {
- position: fixed;
- margin: 44px 44px; }
+ margin-left: 44px;
+ margin-bottom: 44px; }
.modal .close .icon {
display: block; }
.modal figure {
@@ -9794,8 +9675,7 @@ button.close {
.modal-header {
padding: 30px 40px;
- position: relative;
- color: #888; }
+ position: relative; }
.close-search {
position: fixed;
@@ -10010,7 +9890,7 @@ button.close {
color: #888; }
.select-list {
- -webkit-mask-image: -webkit-gradient(linear, left top, left 15px, from(transparent), to(rgba(0, 0, 0, 0.5)));
+ -webkit-mask-image: -webkit-gradient(linear, left top, left 15px, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.5)));
background-clip: padding-box;
font-size: 15px;
line-height: 14px;
@@ -10188,26 +10068,14 @@ button.close {
margin-left: -20px; }
.header-left {
- -webkit-transform-origin: center left;
- -moz-transform-origin: center left;
- -ms-transform-origin: center left;
- transform-origin: center left;
left: 0;
padding-left: 10px; }
.header-right {
- -webkit-transform-origin: center right;
- -moz-transform-origin: center right;
- -ms-transform-origin: center right;
- transform-origin: center right;
right: 0;
- padding-right: 10px; }
+ padding-right: 20px; }
.header-center {
- -webkit-transform-origin: center center;
- -moz-transform-origin: center center;
- -ms-transform-origin: center center;
- transform-origin: center center;
width: 100%;
left: 0;
right: 0;
@@ -10239,7 +10107,7 @@ button.close {
margin: 0;
height: 60px;
line-height: 60px;
- font-size: 13.5px;
+ font-size: 9pt;
font-weight: bold;
color: #888;
display: inline-block;
@@ -10450,7 +10318,7 @@ button.close {
margin-right: 3px;
color: #888;
text-transform: uppercase;
- font-family: Avenir W01;
+ font-family: Inter;
font-size: 11px;
opacity: 0.5; }
#profile-details ul li:hover {
@@ -12482,7 +12350,7 @@ button.close {
.avatar {
background-color: #3d9ee9;
- font-family: Avenir W01;
+ font-family: Inter;
color: white;
display: inline-block;
height: 30px;
@@ -12579,8 +12447,8 @@ button.close {
min-height: 0; }
#folder-empty > div p {
border-radius: 100px;
- font-size: 18px;
- line-height: 24px;
+ font-size: 12pt;
+ line-height: 1.5em;
display: block;
color: #888; }
@@ -12760,7 +12628,7 @@ button.close {
background-color: #292929;
position: absolute;
bottom: 2px;
- -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.1)));
+ -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.1)));
background-color: black;
pointer-events: none; }
#folder-grid .item.favorite .fav-toggle {
@@ -12950,7 +12818,7 @@ button.close {
right: 40px;
color: #888;
font-size: 11px;
- font-family: Avenir W01;
+ font-family: Inter;
text-align: left; }
#editors, #editors-list {
@@ -13038,7 +12906,7 @@ button.close {
.editor > a .editor-name,
.editor > span .editor-email,
.editor > span .editor-name {
- font-family: Avenir W01;
+ font-family: Inter;
font-size: 13px;
line-height: 1.4;
display: block;
@@ -13424,22 +13292,12 @@ button.close {
.toolbar {
margin: auto;
position: fixed;
- bottom: 0px;
+ top: 10px;
z-index: 3000;
- padding: 20px;
+ padding: 0;
font-size: 0;
line-height: 0;
- transition-duration: 0.15s;
- transition-timing-function: ease-in-out;
- transition-delay: initial;
- transition-property: opacity, transform;
- -webkit-backface-visibility: hidden;
- -moz-backface-visibility: hidden;
- backface-visibility: hidden;
- -webkit-transform: translate3d(0, 10px, 0);
- transform: translate3d(0, 10px, 0);
- pointer-events: none !important;
- opacity: 0; }
+ pointer-events: none !important; }
.toolbar.toolbar-meta {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
@@ -13452,28 +13310,8 @@ button.close {
top: auto !important;
left: 0 !important;
bottom: 0 !important; }
- .toolbar.out {
- -webkit-transform: translate3d(0, 10px, 0);
- transform: translate3d(0, 10px, 0); }
- .toolbar.out * {
- pointer-events: none !important; }
- .toolbar.out button, .toolbar.out input, .toolbar.out .dialog {
- display: none; }
- .toolbar.in {
- -webkit-transform: translate3d(0, 0, 0);
- transform: translate3d(0, 0, 0); }
- .toolbar.in.out {
- -webkit-transform: translate3d(0, 10px, 0);
- transform: translate3d(0, 10px, 0); }
- .toolbar.in.out * {
- pointer-events: none !important; }
.toolbar > * {
- margin: 0 2px;
- margin-top: 4px;
pointer-events: auto !important; }
- .toolbar > *.out {
- margin: 0;
- opacity: 0; }
.toolbar.toolbar-vertical {
width: auto !important;
font-size: 0px;
@@ -13588,16 +13426,14 @@ button.close {
position: relative; }
.toolbar-properties {
- bottom: 64px;
z-index: 0; }
.toolbar-properties.in {
z-index: 3000; }
.toolbar-properties .icon-sm {
z-index: 110;
- background-color: #222;
border-radius: 50px; }
.toolbar-properties .jewel {
- border: 2px solid rgba(255, 255, 255, 0.5);
+ border: 2px solid #888;
background-color: transparent;
color: #989898;
width: 36px;
@@ -13616,7 +13452,13 @@ button.close {
.toolbar-elements > .btn-group,
.toolbar-properties > .btn-group {
- box-shadow: 0 0 30px rgba(0, 0, 0, 0.5); }
+ background-color: #ffffff; }
+
+.toolbar-elements {
+ left: 10px; }
+
+.toolbar-properties {
+ right: 20px; }
#color-toggles {
background-size: 40px;
@@ -14638,7 +14480,7 @@ button.close {
padding-top: 10px;
margin-bottom: 0;
font-size: 16px !important;
- font-family: Avenir W01 !important;
+ font-family: Inter !important;
list-style: none;
border-top-left-radius: 3px;
border-top-right-radius: 3px; }
@@ -14784,12 +14626,9 @@ button.close {
max-width: 100%;
max-height: 100%;
position: relative;
- overflow: scroll;
- /** {
- -moz-user-select: none !important; // firefox has selection problems
- }*/ }
+ overflow: scroll; }
.board .wrapper {
- border: 1px dotted rgba(128, 128, 128, 0.5);
+ border: 4px solid black;
transition-duration: 0.25s;
transition-property: width, height, background-color;
background-repeat: no-repeat;
@@ -14798,20 +14637,20 @@ button.close {
.snap-ruler-h {
pointer-events: none;
position: fixed;
- z-index: 0;
+ z-index: 2000;
right: 0px;
height: 1px;
- background-color: rgba(0, 0, 0, 0.5);
+ background-color: black;
left: 0px; }
.snap-ruler-v {
pointer-events: none;
position: fixed;
- z-index: 0;
+ z-index: 2000;
top: 0px;
bottom: 0px;
width: 1px;
- background-color: rgba(0, 0, 0, 0.5); }
+ background-color: black; }
.cursor {
position: absolute;
@@ -14842,16 +14681,16 @@ button.close {
max-width: 100%;
position: relative;
width: auto;
- margin-left: -18px;
- margin-right: -18px;
- margin-top: -18px;
- margin-bottom: -18px; }
+ margin-left: -12pt;
+ margin-right: -12pt;
+ margin-top: -12pt;
+ margin-bottom: -12pt; }
.table table {
width: 100%;
table-layout: auto;
border-collapse: separate;
- border-spacing: 18px 18px; }
+ border-spacing: 12pt 12pt; }
.table tr {
border-top: 1px solid rgba(255, 255, 255, 0.125); }
@@ -14866,26 +14705,10 @@ button.close {
position: absolute; }
#space {
- /*-webkit-user-select: all;
- -ms-user-select: all;
- -moz-user-select: all;
- user-select: all;*/
position: relative;
height: 100% !important;
background-color: #eee; }
-#made-with {
- position: fixed;
- width: 100%;
- bottom: 0;
- padding: 12px;
- opacity: 0.25; }
- #made-with a {
- color: #222; }
- #made-with p {
- text-align: center;
- font-size: 11px; }
-
#baseline {
position: absolute;
width: 100%;
@@ -14898,7 +14721,7 @@ button.close {
top: 0;
display: none; }
#baseline li {
- height: 6px;
+ height: 0.375em;
border-bottom: 1px solid #3d9ee9; }
#space-header .item-meta {
@@ -14921,8 +14744,8 @@ button.close {
.space-bounds {
position: absolute;
- left: 0px;
- top: 0px;
+ left: 0;
+ top: 0;
pointer-events: none;
background-size: cover;
background-repeat: no-repeat;
@@ -15186,7 +15009,7 @@ button.close {
top: 60px;
width: 100%;
height: 100%;
- background-color: transparent;
+ background-color: rgba(0, 0, 0, 0);
pointer-events: none; }
#sidebar .sidebar-menu-backdrop.in {
pointer-events: auto;
@@ -15195,20 +15018,15 @@ button.close {
padding: 15px 25px;
font-size: 14px; }
#sidebar #search-input:-moz-placeholder, #sidebar #search-input::-moz-placeholder, #sidebar #search-input:-ms-input-placeholder {
- font-family: Avenir W01; }
+ font-family: Inter; }
#sidebar #search-input::-webkit-input-placeholder {
- font-family: Avenir W01; }
+ font-family: Inter; }
#sidebar #online-members > div:not(.in) {
display: none; }
.artifact {
position: relative;
- /*&.artifact-text.text-blank [contentEditable=true]:not(.text-editing) p:first-child::after {
- content: "Double click to edit";
- opacity: 0.25;
- }
-
- &.artifact-text.text-blank [contentEditable=true].text-editing p:first-child::after {
+ /*&.artifact-text.text-blank [contentEditable=true].text-editing p:first-child::after {
content: "Type here";
opacity: 0.25;
}*/
@@ -15235,6 +15053,9 @@ button.close {
top: 50%;
left: 50%;
margin: -22px; }
+ .artifact.artifact-text.text-blank [contentEditable=true]:not(.text-editing) p:first-child::after {
+ content: "Double click to edit";
+ opacity: 0.25; }
.artifact.artifact-text.text-blank p:first-child br {
display: none; }
.artifact .link-wrapper {
@@ -15282,9 +15103,9 @@ button.close {
display: block;
word-wrap: break-word;
line-height: 1.5em;
- font-size: 18px; }
+ font-size: 12pt; }
.artifact .text-table .text-cell .text-column.text-editing {
- min-height: 18px;
+ min-height: 12pt;
-webkit-user-select: auto;
-moz-user-select: auto;
user-select: auto;
@@ -15550,7 +15371,7 @@ button.close {
position: absolute;
color: black;
white-space: normal;
- font-size: 18px; }
+ font-size: 36px; }
.board .artifact.artifact-zone {
border: 1px solid #2ecc71;
background-color: rgba(46, 204, 113, 0.025);
@@ -15600,6 +15421,9 @@ body:not(.present-mode) #space .artifact.selected {
.tool-pan {
cursor: grab !important; }
+.tool-note {
+ cursor: crosshair !important; }
+
.artifact.state-idle .progress, .artifact.state-idle .progress-text {
display: none; }
@@ -15692,30 +15516,30 @@ body:not(.present-mode) #space .artifact.selected {
display: block; }
.handles {
- border: 1px solid rgba(255, 255, 255, 0.5);
position: absolute;
left: 0;
top: 0;
- bottom: 0;
+ bottom: -1;
right: 0;
z-index: 800;
- pointer-events: none; }
+ pointer-events: none;
+ background: rgba(255, 255, 255, 0.1); }
.handles:after {
- border: 1px dotted #288cd7;
+ border: 4px dotted #000000;
content: "";
display: block;
position: absolute;
height: auto;
width: auto;
- top: -1px;
- left: -1px;
- right: -1px;
+ top: 0px;
+ left: 0px;
+ right: 0px;
bottom: -1px; }
.extreme-zoom .handles {
border: 8px solid rgba(255, 255, 255, 0.5); }
.extreme-zoom .handles:after {
- border: 8px dotted #288cd7;
+ border: 8px dotted #000000;
top: -4px;
left: -4px;
right: -4px;
@@ -16049,13 +15873,12 @@ body:not(.present-mode) #space .artifact.selected {
pointer-events: auto;
z-index: 2000;
position: absolute;
- width: 30px !important;
- height: 30px !important;
border-radius: 100%;
- margin: -15px;
- border: 1px solid rgba(0, 0, 0, 0.25); }
+ border: 1px solid black;
+ margin: -5px;
+ padding: 4px; }
.vector-handle:hover {
- background-color: rgba(255, 255, 255, 0.5);
+ background-color: black;
cursor: move; }
.handles-vector .handle, .handles-vector .edge-handle {
@@ -16152,13 +15975,7 @@ body:not(.present-mode) #space .artifact.selected {
border-style: solid;
border-width: 10px;
border-color: transparent;
- -webkit-background-clip: padding-box;
- -moz-background-clip: padding-box;
background-clip: padding-box;
- -webkit-transition: all .05s ease-in-out;
- -moz-transition: all .05s ease-in-out;
- -ms-transition: all .05s ease-in-out;
- -o-transition: all .05s ease-in-out;
transition: all .05s ease-in-out; }
.handle div {
position: relative;
@@ -16421,10 +16238,8 @@ body:not(.present-mode) #space .artifact.selected {
html,
body {
height: 100%;
- -webkit-tap-highlight-color: transparent;
- background-color: white;
background-color: #f5f5f5;
- color: #292929; }
+ color: #111; }
*[contenteditable="true"] {
outline: none; }
@@ -16442,49 +16257,18 @@ body {
text-rendering: optimizeLegibility;
cursor: default; }
+#home {
+ background-color: white; }
+
.img img {
max-width: 100%;
height: auto; }
-.plan {
- color: #888;
- border-radius: 3px;
- display: inline-block;
- padding: 30px;
- background-color: transparent;
- border: 2px solid rgba(0, 0, 0, 0.05);
- width: 100%; }
- .plan.active {
- background-color: white;
- border: none; }
- .plan h4 {
- color: black;
- margin-bottom: 0px; }
- .plan p {
- font-size: 13px;
- line-height: 1.4;
- margin-top: 5px;
- margin-bottom: 5px; }
- .plan ul {
- list-style: none;
- font-size: 10px;
- margin: 0px;
- padding: 0px;
- border-top: 2px solid rgba(0, 0, 0, 0.05);
- padding-top: 20px;
- margin-top: 20px;
- margin-bottom: 20px; }
- .plan ul li {
- padding-top: 2px; }
-
#startup {
background-position: center;
background-image: url(/images/diamond.svg);
background-repeat: no-repeat; }
-#home {
- background-color: white; }
-
.layer {
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
diff --git a/routes/api/space_exports.js b/routes/api/space_exports.js
index 0083febbd8a9f8110588df97a23aee80faa0035d..aed5d6ce3eab2e99af2f84deffb3e9b7b66502df 100644
--- a/routes/api/space_exports.js
+++ b/routes/api/space_exports.js
@@ -78,14 +78,14 @@ router.get('/png', function(req, res, next) {
var oldPath = url.parse(oldUrl).pathname;
uploader.removeFile(oldPath, function(err, res) {});
}
- fs.unlink(local_path);
+ fs.unlinkSync(local_path);
} catch (e) {
console.error(e);
}
});
try {
- fs.unlink(localResizedFilePath);
+ fs.unlinkSync(localResizedFilePath);
} catch (e) {
console.error(e);
}
diff --git a/routes/api/space_memberships.js b/routes/api/space_memberships.js
index 2b88dfaba5f1f34ed2fca2488dbc98c4e909c49e..cd0f23e5be850d5825616f3fe7257d5f92d7b9a0 100644
--- a/routes/api/space_memberships.js
+++ b/routes/api/space_memberships.js
@@ -84,7 +84,7 @@ router.post('/', function(req, res, next) {
} else {
res.status(400).json({
- "error": "user already in space"
+ "error": "This email is already included in the Space memberships."
});
}
diff --git a/styles/artifact.scss b/styles/artifact.scss
index 2596466be05bda6894b93bad50c7de9f19b25e09..bfff1c29d2035e2a43cfcc9081165af11e85e83d 100644
--- a/styles/artifact.scss
+++ b/styles/artifact.scss
@@ -26,12 +26,12 @@
}
}
- /*&.artifact-text.text-blank [contentEditable=true]:not(.text-editing) p:first-child::after {
+ &.artifact-text.text-blank [contentEditable=true]:not(.text-editing) p:first-child::after {
content: "Double click to edit";
opacity: 0.25;
}
- &.artifact-text.text-blank [contentEditable=true].text-editing p:first-child::after {
+ /*&.artifact-text.text-blank [contentEditable=true].text-editing p:first-child::after {
content: "Type here";
opacity: 0.25;
}*/
@@ -469,7 +469,7 @@
color: black;
//@include user-select(none);
white-space: normal;
- font-size: 18px;
+ font-size: 36px;
&.artifact-zone {
border: 1px solid rgba(46,204,113,1);
@@ -553,6 +553,10 @@ body:not(.present-mode) {
cursor: grab !important;
}
+.tool-note {
+ cursor: crosshair !important;
+}
+
.artifact.state-idle {
.progress, .progress-text {
display: none;
diff --git a/styles/button.scss b/styles/button.scss
index 26bd125a01eed210b288d8a75ee96636d9f8dc99..f9c2c0e4f1e80e2ef6ff7ba8a0d4fb6005a0ef85 100644
--- a/styles/button.scss
+++ b/styles/button.scss
@@ -7,12 +7,6 @@
.btn-group.colors {
.btn {
- // padding: 4px;
- // background-clip: content-box;
- // padding-right: 2px;
- // &:last-child {
- // padding-right: 4px;
- // }
box-shadow: inset 0 0 30px 0px rgba(40,40,40,0.1);
}
}
@@ -64,7 +58,7 @@
backface-visibility: hidden;
cursor: pointer;
background-color: $light;
- color: $medium;;
+ color: $black;
@include user-select(none);
&:last-child {border: none;}
@@ -82,12 +76,9 @@
&.btn-link {
background-color: transparent;
- color: $medium;;
+ color: $medium;
}
- &.facebook {background-color: $facebook !important; color: white !important;}
- &.twitter {background-color: $twitter !important; color: white !important; }
-
&.btn-round {
border-radius: 100px !important;
}
@@ -96,21 +87,10 @@
border-radius: 6px !important;
}
- // &.close {
- // position: absolute;
- // top: 15px;
- // right: 15px;
- // z-index: 4000;
- // font-size: 40px;
- // }
-
&.btn-nude {
min-width: 0 !important;
- // font-size: inherit !important;
padding: 0 !important;
- // height: auto !important;
background-color: transparent;
- color: $medium;
}
&.btn-nude + .btn-nude {
@@ -123,7 +103,7 @@
&.btn-stroke {
box-shadow: inset 0 0 0 1px $dark;
- color: $dark !important;
+ color: $black;
background-color: transparent;
&:active {
box-shadow: inset 0 0 0 1px white;
@@ -132,9 +112,8 @@
}
&.btn-stroke-darken {
- //box-shadow: inset 0 0 0 1px rgba(0,0,0,0.1);
- border: 1px solid rgba(0,0,0,0.1);
- color: $medium;
+ border: 1px solid $black;
+ color: $black;
background-color: transparent;
&:active {
//box-shadow: inset 0 0 0 1px $dark;
@@ -263,9 +242,18 @@
&.btn-transparent {
background-color: transparent;
- color: $medium;
- &.active {color: $darker !important; }
- &.open {color: white !important; }
+ color: $dark;
+ &.active {
+ //color: $black !important;
+ color: $white;
+ background-color: $black;
+ }
+ &.open {
+ //color: $black !important;
+ color: $white;
+ background-color: $black;
+ border-radius: 0;
+ }
}
&.btn-transparent-medium {
@@ -714,7 +702,6 @@
}
> * {
- border-radius: 0 !important;
background-clip: padding-box;
width: 100%;
float: left;
@@ -775,7 +762,7 @@
}
}
.btn-group {
- @include scale(0,0);
+ //@include scale(0,0);
//@include transition( all 0.1s 0s ease-in-out);
position: absolute;
@@ -787,7 +774,7 @@
margin-left: -12px;
.btn {
- @include scale(0,0);
+ //@include scale(0,0);
//@include transition( all 0.1s 0.05s ease-in-out);
@@ -979,31 +966,7 @@
}
}
-.btn-group.bottom-left > .btn {
- border-radius: 0px;
-
- &:first-child{
- border-top-left-radius: 0px;
- border-bottom-left-radius: 0px;
- }
- &.last,
- &:last-child{
- border-top-right-radius: 3px;
- border-bottom-right-radius: 0px;
- }
-}
-
-.btn-xyz {
- position: relative;
- display: inline-block;
- line-height: 0px;
- padding: 0px;
- font-size: 0px;
- vertical-align: middle;
- white-space: nowrap;
- @include clearfix;
- min-height: 44px;
-}
+// !btn-group
.btn-group {
position: relative;
@@ -1014,13 +977,16 @@
vertical-align: middle;
white-space: nowrap;
+ border: 1px solid $dark;
+ border-radius: 5px;
+
&.dark {
border-radius: $radius;
background-color: $dark;
- color: $lighter;
+ color: $white;
.btn {
- color: $lighter;
+ color: $white;
}
}
@@ -1159,4 +1125,4 @@
margin: 4px;
z-index: 100;
border-radius: 50px;
-}
\ No newline at end of file
+}
diff --git a/styles/dialog.scss b/styles/dialog.scss
index 0a14f5748933b680f6978a0494b1826c99c50e82..2c2d19c3b93fa736c361f326c572dee59839a5af 100644
--- a/styles/dialog.scss
+++ b/styles/dialog.scss
@@ -125,8 +125,10 @@
@include transition( all 0.125s ease-in-out);
pointer-events: none;
background-color: $light;
- color: $medium;
- &.dark {background-color: $dark; }
+ color: $dark;
+ &.dark {
+ background-color: $dark;
+ }
border-radius: $radius*3;
box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.05), 0 2px 7px rgba(0, 0, 0, 0.1);
@@ -228,4 +230,4 @@
h4 .icon {
height: 38px;
}
-}
\ No newline at end of file
+}
diff --git a/styles/dropdown.scss b/styles/dropdown.scss
index 4a7d1cce086b53becd5f5ec88dbe1e111cb08bc8..9baed27cd3448cd54ded9a4f6064fc24ab359ec3 100644
--- a/styles/dropdown.scss
+++ b/styles/dropdown.scss
@@ -43,9 +43,6 @@ $predelay: 0;
&.hover:hover,
&.open {
- // &:before {opacity: 0.125; }
- // pointer-events: auto;
- background-color: $dark;
background-color: $light;
> * {
@@ -111,8 +108,8 @@ $predelay: 0;
}
&:last-child > .btn{
- border-top-right-radius: $radius ;
- border-bottom-right-radius: $radius ;
+ border-top-right-radius: $radius;
+ border-bottom-right-radius: $radius;
}
}
}
@@ -143,8 +140,7 @@ $predelay: 0;
&.light > .dropdown-menu,
&.light > .dialog {
- background: $light;
- color: $medium;
+ background: white;
}
> .dropdown-menu {
@@ -189,8 +185,6 @@ $predelay: 0;
}
}
-
-
&.hover:hover > .dialog,
&.hover:hover > .dropdown-menu,
@@ -206,9 +200,7 @@ $predelay: 0;
&.open {
> .dialog,
> .dropdown-menu {
- -webkit-transform: translate3d(-50%, -50%, 100px) scale(1);
- -ms-transform: translate3d(-50%, -50%, 100px) scale(1);
- transform: translate3d(-50%, -50%, 100px) scale(1);
+ //transform: translate3d(-50%, -50%, 100px) scale(1);
}
}
@@ -217,10 +209,8 @@ $predelay: 0;
left: 50%;
top: 50%;
margin-top: 0px;
- @include transform-origin(center center);
- -webkit-transform: translate3d(-50%, -50%, 100px) scale(0.93,0.8);
- -ms-transform: translate3d(-50%, -50%, 100px) scale(0.93,0.8);
- transform: translate3d(-50%, -50%, 100px) scale(0.93,0.8);
+ //@include transform-origin(center center);
+ //transform: translate3d(-50%, -50%, 100px) scale(0.93,0.8);
}
}
@@ -230,10 +220,8 @@ $predelay: 0;
top: auto;
bottom: 100%;
margin-bottom: 16px;
- @include transform-origin(bottom left);
- -webkit-transform: translate3d(-33%, 0%, 100px) scale(0.93,0.8);
- -ms-transform: translate3d(-33%, 0%, 100px) scale(0.93,0.8);
- transform: translate3d(-33%, 0%, 100px) scale(0.93,0.8);
+ //@include transform-origin(bottom left);
+ //transform: translate3d(-33%, 0%, 100px) scale(0.93,0.8);
}
}
@@ -243,10 +231,8 @@ $predelay: 0;
top: auto;
bottom: 100%;
margin-bottom: 16px;
- @include transform-origin(bottom center);
- -webkit-transform: translate3d(-50%, 0%, 100px) scale(0.93,0.8);
- -ms-transform: translate3d(-50%, 0%, 100px) scale(0.93,0.8);
- transform: translate3d(-50%, 0%, 100px) scale(0.93,0.8);
+ //@include transform-origin(bottom center);
+ //transform: translate3d(-50%, 0%, 100px) scale(0.93,0.8);
}
}
@@ -257,33 +243,37 @@ $predelay: 0;
top: 100%;
bottom: auto;
margin-top: -16px;
- @include transform-origin(top center);
- -webkit-transform: translate3d(-50%, 0%, 100px) scale(0.93,0.8);
- -ms-transform: translate3d(-50%, 0%, 100px) scale(0.93,0.8);
- transform: translate3d(-50%, 0%, 100px) scale(0.93,0.8);
+ //@include transform-origin(top center);
+ //transform: translate3d(-50%, 0%, 100px) scale(0.93,0.8);
}
}
-
+
+ &.top.left {
+ > .dialog,
+ > .dropdown-menu {
+ left: 70px;
+ margin-top: -60px;
+ }
+ }
+
&.top.right {
> .dialog,
> .dropdown-menu {
top: 100%;
bottom: auto;
left: auto;
- right: 0;
- margin-top: 16px;
- @include transform-origin(top right);
- -webkit-transform: translate3d(0%, 0%, 100px) scale(0.93,0.8);
- -ms-transform: translate3d(0%, 0%, 100px) scale(0.93,0.8);
- transform: translate3d(0%, 0%, 100px) scale(0.93,0.8);
+
+ right: 70px;
+ margin-top: -60px;
+
+ //@include transform-origin(top right);
+ //transform: translate3d(0%, 0%, 100px) scale(0.93,0.8);
}
&.hover:hover,
&.open {
> .dialog,
> .dropdown-menu {
- -webkit-transform: translate3d(0%, 0%, 100px) scale(1);
- -ms-transform: translate3d(0%, 0%, 100px) scale(1);
- transform: translate3d(0%, 0%, 100px) scale(1);
+ //transform: translate3d(0%, 0%, 100px) scale(1);
}
}
@@ -312,9 +302,7 @@ $predelay: 0;
> .dialog,
> .dropdown-menu {
- -webkit-transform: translate3d(-50%, 0%, 100px) scale(1);
- -ms-transform: translate3d(-50%, 0%, 100px) scale(1);
- transform: translate3d(-50%, 0%, 100px) scale(1);
+ //transform: translate3d(-50%, 0%, 100px) scale(1);
}
}
}
@@ -324,9 +312,7 @@ $predelay: 0;
&.open {
> .dialog,
> .dropdown-menu {
- -webkit-transform: translate3d(-33%, 0%, 100px) scale(1) !important;
- -ms-transform: translate3d(-33%, 0%, 100px) scale(1) !important;
- transform: translate3d(-33%, 0%, 100px) scale(1) !important;
+ //transform: translate3d(-33%, 0%, 100px) scale(1) !important;
}
}
}
@@ -334,7 +320,7 @@ $predelay: 0;
.dropdown {
- &.options-3 {
+ /*&.options-3 {
&.option-1:after { margin-left: -68px;}
&.option-2:after { margin-left: -8px;}
&.option-3:after { margin-left: 52px;}
@@ -348,8 +334,9 @@ $predelay: 0;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
- }
-
+ }*/
+
+ /*
&:after {
@include transition( all 0.1s ease-in-out 0s);
content: "";
@@ -362,26 +349,24 @@ $predelay: 0;
margin-left: -8px;
pointer-events: none !important;
left: 50%;
- -webkit-transform: scale(0,0);
- -ms-transform: scale(0,0);
- transform: scale(0,0);
+ //transform: scale(0,0);
}
&.bottom:after, &.bottomleft:after {
- @include transform-origin(bottom center);
+ //@include transform-origin(bottom center);
bottom: 100%;
border-bottom: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #303030;
border-left: 8px solid transparent;
}
-
- &.top:after {
+*/
+ /*&.top:after {
@include transform-origin(top center);
top: 100%;
border-bottom: 8px solid #303030;
border-right: 8px solid transparent;
border-top: 8px solid transparent;
border-left: 8px solid transparent;
- }
-}
\ No newline at end of file
+ }*/
+}
diff --git a/styles/form-checkbox.scss b/styles/form-checkbox.scss
index 66fb272c3077f765ad63854557171479fc01a702..76550a8e13968c101e65ed62b9e91a46a073e66f 100644
--- a/styles/form-checkbox.scss
+++ b/styles/form-checkbox.scss
@@ -28,7 +28,6 @@
line-height: 1.5;
width: 100%;
text-align: left;
- color: $medium;
font-weight: normal;
cursor: pointer;
border-radius: $radius;
@@ -139,4 +138,4 @@
display: inline-block !important;
width: auto !important;
padding-right: 15px !important;
-}
\ No newline at end of file
+}
diff --git a/styles/form-select.scss b/styles/form-select.scss
index 5ae6de61a2f03d2b6daf8f62a05736422f5f1707..44f40ee949047edf23e756f0d4cb56c19207b4be 100644
--- a/styles/form-select.scss
+++ b/styles/form-select.scss
@@ -2,24 +2,14 @@
@import "mixins";
.input-select {
- // background-color: rgba(255,255,255,0.04);
- // background-image: url('images/select_arrow.gif');
+ background-color: rgba(255,255,255,0.04);
+ background-image: url('images/select_arrow.gif');
border-radius: $radius;
display: inline-block;
width: 100%;
}
-@-moz-document url-prefix() {
- select.input{
- background-repeat: no-repeat;
- background-position: right center;
- cursor: pointer;
- }
-}
-
select {
- -webkit-appearance:none;
- // -moz-appearance:window;
appearance:none;
padding-left: 0px;
width: 100%;
diff --git a/styles/form.scss b/styles/form.scss
index a09d77661882bdca01728fc90e6fe3c0647f9bcf..b0206be1a32b80fd60906afab898e43a12b8626a 100644
--- a/styles/form.scss
+++ b/styles/form.scss
@@ -113,43 +113,26 @@ select {
&.input-white {
background-color: white;
- color: $medium;
box-shadow: inset 0 0 1px 1px rgba(0, 0, 0, 0.05), inset 0 0px 4px rgba(0, 0, 0, 0.1);
}
&.input-light {
background-color: $light;
- color: $medium;
}
&.input-dark {
background-color: $darker;
- color: $medium;
}
&.input-lighten {
background-color: rgba(255,255,255,0.05);
- color: $medium !important;
}
&.input-darken {
background-color: rgba(0,0,0,0.05);
- color: $medium;
}
&.input-transparent {
background-color: transparent;
- color: $medium;
- }
-
- // &:focus {color: white; }
-
- &:invalid {
- // background-color: rgba(198,101,84,0.05);
- // color: rgba(198,101,84,0.75)
-
- &:after {
-
- }
}
@include input-focus();
diff --git a/styles/handles.scss b/styles/handles.scss
index bf5c07da6c9dda273ce8278ca794e5894d6a2d1f..e3ca7fd25299b1dcd45f32072f211478dd4ec52c 100644
--- a/styles/handles.scss
+++ b/styles/handles.scss
@@ -69,26 +69,27 @@
}
.handles {
- // background-color: rgba(40,140,215,0.45);
- border: 1px solid rgba(255,255,255,0.5);
+ //border: 1px solid rgba(255,255,255,0.5);
position: absolute;
left: 0;
top: 0;
- bottom: 0;
+ bottom: -1;
right: 0;
z-index: 800;
pointer-events: none;
+ background: rgba(255,255,255,0.1);
+
&:after{
- border: 1px dotted rgba(40,140,215,1);
+ border: 4px dotted #000000;
content: "";
display: block;
position: absolute;
height: auto;
width: auto;
- top: -1px;
- left: -1px;
- right: -1px;
+ top: 0px;
+ left: 0px;
+ right: 0px;
bottom: -1px;
}
}
@@ -97,7 +98,7 @@
border: 8px solid rgba(255,255,255,0.5);
&:after{
- border: 8px dotted rgba(40,140,215,1);
+ border: 8px dotted #000000;
top: -4px;
left: -4px;
right: -4px;
@@ -332,16 +333,15 @@
pointer-events:auto;
z-index: 2000;
position: absolute;
- width: 30px !important;
- height: 30px !important;
border-radius: 100%;
- margin: -15px;
-
- border: 1px solid rgba(0,0,0,0.25);
+ border: 1px solid black;
+ margin: -5px;
+ padding: 4px;
+
&:hover {
- background-color: rgba(255,255,255,0.5);
- cursor: move;
+ background-color: black;
+ cursor: move;
}
}
@@ -428,15 +428,8 @@
border-style: solid;
border-width: 10px;
border-color: transparent;
- -webkit-background-clip: padding-box;
- -moz-background-clip: padding-box;
- background-clip: padding-box;
-
- -webkit-transition: all .05s ease-in-out;
- -moz-transition: all .05s ease-in-out;
- -ms-transition: all .05s ease-in-out;
- -o-transition: all .05s ease-in-out;
- transition: all .05s ease-in-out;
+ background-clip: padding-box;
+ transition: all .05s ease-in-out;
}
div {
diff --git a/styles/header.scss b/styles/header.scss
index 80a850d6a01f2bcd3edd2a1f3de3f600571167a2..2b9a4abfa9fac31db39ca36de8d9032ccf408d0f 100644
--- a/styles/header.scss
+++ b/styles/header.scss
@@ -31,17 +31,14 @@
}
.header-left {
- @include transform-origin(center left);
left: 0;
padding-left: 10px;
}
-.header-right {
- @include transform-origin(center right);
+.header-right {
right: 0;
- padding-right: 10px;
+ padding-right: 20px;
}
.header-center {
- @include transform-origin(center center);
width: 100%;
left: 0;
right: 0;
diff --git a/styles/main.scss b/styles/main.scss
index bbe8404d4f4056e18b08494f080cc1d6e382e599..ce953b83ca8ea7bd91bfa14fa211cff43095e2fc 100644
--- a/styles/main.scss
+++ b/styles/main.scss
@@ -2,7 +2,6 @@
@import "mixins";
.wrapper {
- //@include transition( all 0.25s ease-in-out);
position: relative;
margin: auto;
max-width: 1160px;
diff --git a/styles/modal.scss b/styles/modal.scss
index 5129ce24591f4906c8c5591f4162be744feb08c7..b02a4c3d2feeb6abecabcdf2fbf58e5e2dcb1a46 100644
--- a/styles/modal.scss
+++ b/styles/modal.scss
@@ -59,9 +59,9 @@
}
.close {
- position: fixed;
- margin: 44px 44px;
- .icon {display: block; }
+ margin-left: 44px;
+ margin-bottom: 44px;
+ .icon {display: block; }
}
figure {
@@ -146,7 +146,6 @@
.modal-header {
padding: 30px 40px;
position: relative;
- color: $medium;
}
.close-search {
@@ -300,4 +299,4 @@
// .btn-block + .btn-block {
// margin-left: 0;
// }
-}
\ No newline at end of file
+}
diff --git a/styles/normalize.scss b/styles/normalize.scss
index 98e793b7a5a2dfa6c9d0b9abdb9e236d6a0e6ebd..f87d302faa83a3b458f3ac638fb44faf9266c2bf 100644
--- a/styles/normalize.scss
+++ b/styles/normalize.scss
@@ -1,17 +1,5 @@
/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
-//
-// 1. Set default font family to sans-serif.
-// 2. Prevent iOS text size adjust after orientation change, without disabling
-// user zoom.
-//
-
-html {
- font-family: sans-serif; // 1
- -ms-text-size-adjust: 100%; // 2
- -webkit-text-size-adjust: 100%; // 2
-}
-
//
// Remove default margin.
//
@@ -420,4 +408,4 @@ table {
td,
th {
padding: 0;
-}
\ No newline at end of file
+}
diff --git a/styles/space-sections.scss b/styles/space-sections.scss
index 2185a27564c4e0cae1fc66f14f7f53afaa7fbcc2..b1c0443d2d35fb3026dde80d368ef5bc937177db 100644
--- a/styles/space-sections.scss
+++ b/styles/space-sections.scss
@@ -118,7 +118,7 @@
padding: 0 !important;
.wrapper {
- border: 1px dotted rgba(128,128,128,0.5);
+ border: 4px solid black;
transition-duration: 0.25s;
transition-property: width, height, background-color;
@@ -132,32 +132,27 @@
max-height: 100%;
position: relative;
-
overflow: scroll;
-
- /** {
- -moz-user-select: none !important; // firefox has selection problems
- }*/
}
.snap-ruler-h {
pointer-events: none;
position: fixed;
- z-index: 0;
+ z-index: 2000;
right: 0px;
height: 1px;
- background-color: rgba(0,0,0,0.5);
+ background-color: black;
left: 0px;
}
.snap-ruler-v {
pointer-events: none;
position: fixed;
- z-index: 0;
+ z-index: 2000;
top: 0px;
bottom: 0px;
width: 1px;
- background-color: rgba(0,0,0,0.5);
+ background-color: black;
}
.cursor {
@@ -227,30 +222,12 @@
}
#space {
- /*-webkit-user-select: all;
- -ms-user-select: all;
- -moz-user-select: all;
- user-select: all;*/
+ // user-select: all;
position: relative;
height: 100% !important;
-
- //padding-top: 64px !important;
background-color: #eee;
}
-#made-with {
- position: fixed;
- width: 100%;
- bottom: 0;
- padding: 12px;
- opacity: 0.25;
- a {color: $dark; }
- p {
- text-align: center;
- font-size: 11px;
- }
-}
-
#baseline {
position: absolute;
width: 100%;
@@ -298,8 +275,8 @@
.space-bounds {
position: absolute;
- left: 0px;
- top: 0px;
+ left: 0;
+ top: 0;
pointer-events: none;
background-size: cover;
background-repeat: no-repeat;
diff --git a/styles/style.scss b/styles/style.scss
index 15ebdc80d7dea8a09b8429847df4d68216add151..bff34f4f1cce9ae35569b5f06c38c410f189b0a9 100644
--- a/styles/style.scss
+++ b/styles/style.scss
@@ -65,10 +65,8 @@
html,
body {
height:100%;
- -webkit-tap-highlight-color: transparent;
- background-color: white;
background-color: $light;
- color: $darker;
+ color: $black;
}
*[contenteditable="true"] {
@@ -89,60 +87,21 @@ body {
cursor: default;
}
+#home {
+ background-color: white;
+}
+
.img img {
max-width: 100%;
height: auto;
}
-.plan {
- color: $medium;
- border-radius: $radius;
- display: inline-block;
- padding: 30px;
-
- background-color: transparent;
- border: 2px solid rgba(0,0,0,0.05);
- width: 100%;
-
- &.active {
- background-color: white;
- border: none;
- }
-
- h4 {
- color: black;
- margin-bottom: 0px;
- }
-
- p {
- font-size: 13px;
- line-height: 1.4;
- margin-top: 5px;
- margin-bottom: 5px;
- }
-
- ul {
- list-style: none;
- font-size: 10px;
- margin: 0px;
- padding: 0px;
- border-top: 2px solid rgba(0,0,0,0.05);
- padding-top: 20px;
- margin-top: 20px;
- margin-bottom: 20px;
- li {padding-top: 2px; }
- }
-}
-
#startup {
background-position: center;
background-image:url(/images/diamond.svg);
background-repeat: no-repeat;
}
-#home {
- background-color: white;
-}
.layer {
@include transition( all 0.2s ease-in-out);
diff --git a/styles/table.scss b/styles/table.scss
index ed008fcc3d659678e7f8107affc1ab54bf71463e..e4e935e92cbd1544f5649d1f46a73ebcf4618bad 100644
--- a/styles/table.scss
+++ b/styles/table.scss
@@ -8,10 +8,9 @@
}
.table {
width: 100%;
- color: $medium;;
font-family: $main-font;
- // border-radius: $radius;
- // border: 2px solid rgba(0,0,0,0.0125) !important;
+ border-radius: $radius;
+ border: 2px solid rgba(0,0,0,0.0125);
}
.table thead > tr > th:first-child,
diff --git a/styles/toolbar.scss b/styles/toolbar.scss
index e347070838a3f0616a5cd357b1b446a6bd3dd2a4..778e8116631154e5ab458d6b34c3c79a733decc2 100644
--- a/styles/toolbar.scss
+++ b/styles/toolbar.scss
@@ -19,50 +19,19 @@
}
margin: auto;
- //text-align: center;
position: fixed;
- bottom: 0px;
- //width: 100%;
+ top: 10px;
z-index: 3000;
- padding: $gutter-b;
+ padding: 0;
font-size: 0;
line-height: 0;
- transition-duration: 0.15s;
- transition-timing-function: ease-in-out;
- transition-delay: initial;
- transition-property: opacity, transform;
- @include backface-visibility(hidden);
+ // FIXME questionable?
- @include translate3d(0, 10px, 0);
pointer-events: none !important;
- opacity: 0;
-
- &.out {
- @include translate3d(0, 10px, 0);
- * {pointer-events: none !important; }
- button, input, .dialog {
- display: none;
- }
- }
-
- &.in {
- @include translate3d(0, 0, 0);
-
- &.out {
- @include translate3d(0, 10px, 0);
- * {pointer-events: none !important; }
- }
- }
> * {
- margin: 0 2px;
- margin-top: 4px;
pointer-events: auto !important;
- &.out {
- margin: 0;
- opacity: 0;
- }
}
&.toolbar-vertical {
@@ -187,7 +156,6 @@
}
.toolbar-properties {
- bottom: 64px;
z-index: 0;
&.in {
@@ -196,12 +164,12 @@
.icon-sm {
z-index: 110;
- background-color: #222;
+ //background-color: #222;
border-radius: 50px;
}
.jewel {
- border: 2px solid rgba(255,255,255,0.5);
+ border: 2px solid #888;
background-color: transparent;
color: #989898;
width: 36px;
@@ -228,5 +196,15 @@
.toolbar-elements > .btn-group,
.toolbar-properties > .btn-group {
- box-shadow: 0 0 30px rgba(0,0,0,0.5);
+ //box-shadow: 0 0 30px rgba(0,0,0,0.5);
+ background-color: $white;
+}
+
+.toolbar-elements {
+ left: 10px;
}
+
+.toolbar-properties {
+ right: 20px;
+}
+
diff --git a/styles/tools.scss b/styles/tools.scss
index 797e7bbd248480b0a03aa224a13a2b53aba1e01f..e24673044570c8e0d40c89391111a962e0fe4923 100644
--- a/styles/tools.scss
+++ b/styles/tools.scss
@@ -33,10 +33,7 @@
@include translate3d(0, 0, 0);
// @include backface-visibility(hidden);
- -webkit-perspective: 1000;
- -moz-perspective: 1000;
- -ms-perspective: 1000;
- perspective: 1000;
+ perspective: 1000;
.panel-toggles {
@include transition( all 0.15s ease-in-out);
@@ -99,10 +96,7 @@
display: table-cell;
vertical-align: middle;
// @include backface-visibility(hidden);
- -webkit-perspective: 1000;
- -moz-perspective: 1000;
- -ms-perspective: 1000;
- perspective: 1000;
+ perspective: 1000;
z-index: 1000;
diff --git a/styles/vars.scss b/styles/vars.scss
index 1ec69bf9dbab53b4c67b47ef85f0de8cc2ccee45..4203ebb793a4ace1aa3c10e5bd9fe2d2118e64db 100644
--- a/styles/vars.scss
+++ b/styles/vars.scss
@@ -9,13 +9,6 @@ $green: #2ecc71;
$red: #ff5955;
$yellow: #f1c40f;
-$light: #f5f5f5;
-$lightish: #eee;
-
-
-$facebook: #3e5b97;
-$twitter: #2aa7de;
-
$color-1 : #4a2f7e; // purple
$color-2 : #9b59b6; // lilac
$color-3 : #3498db; // blue
@@ -32,15 +25,18 @@ $black: #111; // black
$darker: #292929;
$dark: #222; // dark
$medium: #888; // medium
+$light: #f5f5f5;
+$lightish: #eee; // fixme
$lighter: #989898;
+$white: #ffffff;
$sidebar-width: 280px;
-$main-font: Avenir W01;
-$sec-font: Avenir W01;
+$main-font: Inter;
+$sec-font: Inter;
-$font-size: 18px;
-$line-height: 24px;
+$font-size: 12pt;
+$line-height: 1.5em;
$gutter-a: 10px;
$gutter-b: 20px;
@@ -48,4 +44,4 @@ $gutter-c: 40px;
$gutter-d: 60px;
$gutter-e: 80px;
-$folder-gutter: 20px;
\ No newline at end of file
+$folder-gutter: 20px;
diff --git a/views/layouts/outer.html b/views/layouts/outer.html
index 603d96a1076339139518dfe7226ed4fceeeb6927..e3851d8db0add1f9ebd492fb35f314b52da91eda 100644
--- a/views/layouts/outer.html
+++ b/views/layouts/outer.html
@@ -9,10 +9,7 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<link href="[[ '/images/favicon.png' | cdn ]]" rel="icon" type="image/x-icon" />
- <link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,700,600,800,300|Montserrat:400,700|EB+Garamond|Vollkorn|Lato|Roboto|Source+Code+Pro|Ubuntu|Raleway|Playfair+Display|Crimson+Text' rel='stylesheet' type='text/css'>
-
- <link type="text/css" rel="stylesheet" href="https://fast.fonts.net/cssapi/ee1a3484-4d98-4f9f-9f55-020a7b37f3c5.css"/>
-
+ <link href="https://fonts.googleapis.com/css?family=Inter" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="[[ '/stylesheets/style.css' | cdn ]]">
<script> var csrf_token = '[[ csrf_token ]]'; </script>
@@ -53,7 +50,7 @@
<p>
<div class="col-xs-6">
<a href="/contact">[[ __("contact") ]]</a>
- <span style="color:#888">© 2011–2018 The Spacedeck Open Developers <a href="https://github.com/spacedeck/spacedeck-open">https://github.com/spacedeck/spacedeck-open</a></span>
+ <span style="color:#888">© 2011–2020 The Spacedeck Open Developers <a href="https://github.com/spacedeck/spacedeck-open">https://github.com/spacedeck/spacedeck-open</a></span>
</div>
</p>
</div>
diff --git a/views/partials/folders.html b/views/partials/folders.html
index 79eacebb58686a13e23a1556c27586dab3f26fd1..2106a8ee5259b745ef9e0681a6a9be5b541a700d 100644
--- a/views/partials/folders.html
+++ b/views/partials/folders.html
@@ -5,11 +5,19 @@
</a>
<button v-if="logged_in && (active_space_role == 'editor' ||Â active_space_role == 'admin')" class="btn btn-primary btn-md btn-round" v-on:click="create_space('space')">[[ __('create_space') ]]</button>
<button v-if="logged_in && (active_space_role == 'editor' ||Â active_space_role == 'admin')" class="btn btn-stroke-darken btn-md btn-round" v-on:click="create_space('folder')">
- <span v-bind:class="{'disabled-pro':!is_pro(user)}">[[ __('create_folder') ]]</span>
+ <span>[[ __('create_folder') ]]</span>
</button>
- </div>
- <div class="header-right pull-right">
+ <label class="relative compact-hidden">
+ <span class="icon icon-sm icon-zoom no-events absolute-top-left" style="margin: 5px;"></span>
+ <input id="folder-search"
+ type="search" name="search"
+ style="padding-left: 40px !important; margin-right: 10px;"
+ placeholder="[[ __('search') ]]"
+ class="input input-md input-white input-round no-b w-2"
+ v-model="folder_spaces_search" v-on:change="search_spaces">
+ </label>
+
<div class="dropdown top light m-r-20 compact-hidden" v-bind:class="{open : active_dropdown=='folder_sorting'}">
<button class="btn btn-sm btn-nude" v-on:click="activate_dropdown('folder_sorting')">
<span>[[ __('sort_by') ]]</span>:
@@ -33,26 +41,12 @@
v-on:click="set_folder_sorting('space_type',false)">
<span>[[ __('type') ]]</span>
</li>
-
</ul>
</div>
</div>
+ </div>
- <label class="relative compact-hidden">
- <span class="icon icon-sm icon-zoom no-events absolute-top-left" style="margin: 5px;"></span>
- <input id="folder-search"
- type="search" name="search"
- style="padding-left: 40px !important; margin-right: 10px;"
- placeholder="[[ __('search') ]]"
- class="input input-md input-white input-round no-b w-2"
- v-model="folder_spaces_search" v-on:change="search_spaces">
- </label>
-
- <button class="btn btn-stroke-darken btn-md btn-round" v-if="!user.confirmed_at" v-on:click="confirm_again()">
- <span v-if="!account_confirmed_sent">[[ __('email_unconfirmed') ]]</span>
- <span v-if="account_confirmed_sent">[[ __('confirmation_sent') ]]</span>
- </button>
-
+ <div class="header-right pull-right">
<div class="dropdown top right light" v-bind:class="{open: active_dropdown=='account'}">
<button
class="profile-avatar btn btn-md btn-icon btn-darken btn-round"
@@ -76,13 +70,6 @@
</a>
</li>
- <li v-on:click="activate_modal('support')">
- <span>
- <span class="icon icon-sm icon-info"></span>
- <span>[[ __('support') ]]</span>
- </span>
- </li>
-
<li v-on:click="logout()">
<span>
<span class="icon icon-sm icon-logout"></span>
diff --git a/views/partials/modal/access.html b/views/partials/modal/access.html
index f394cdbfa280f90f19f159ffa1c338a489a74ec8..41abcef8a71c1759a8a5d9a4094f6eedae400f72 100644
--- a/views/partials/modal/access.html
+++ b/views/partials/modal/access.html
@@ -3,7 +3,7 @@
<div class="modal-dialog">
<div class="modal-content" style="width:760px">
<div class="modal-header" style="padding-bottom:0">
- <h3 class="text-left"><span class="icon icon-share icon-sm"></span> [[__("share")]]: {{access_settings_space.name}}</h3>
+ <h3 class="text-left">[[__("share")]]: {{access_settings_space.name}}</h3>
<button type="button" class="btn btn-icon btn-light btn-round close" v-on:click=" close_modal()">
<span class="icon icon-cross-1"></span>
</button>
@@ -68,7 +68,7 @@
</div>
<div class="form-group">
- <button class="btn btn-primary btn-md btn-round" v-on:click="invite_member(access_settings_space, invite_email, invite_message, invite_member_role)"> [[__("invite")]] </button>
+ <button class="btn btn-primary btn-md" v-on:click="invite_member(access_settings_space, invite_email, invite_message, invite_member_role)"> [[__("invite")]] </button>
</div>
</div>
@@ -78,7 +78,7 @@
<h4 class="text-left"><span class="icon icon-user-group icon-sm"></span> [[__("access_current_members")]]</h4>
<table class="table">
<tr>
- <th></th>
+ <th>Icon</th>
<th>Email / Name</th>
<th>Role</th>
<th></th>
@@ -91,7 +91,7 @@
<td>
<span class="editor-email" v-if="member.state == 'active'">{{member.user.email}}</span>
<span class="editor-email" v-if="member.state == 'pending'">{{member.email_invited}}</span>
- <span class="editor-name" v-if="member.state == 'active'">{{member.user.nickname}}</span>
+ <span class="editor-name" v-if="member.state == 'active'">{{member.user.nickname}}</span>
<span class="editor-email" v-if="member.state == 'pending'">(pending)</span>
</td>
<td>
@@ -113,7 +113,7 @@
</p>
<div class="form-group" style="padding-top: 40px">
- <button class="btn btn-primary btn-md btn-round" v-on:click="close_modal();"> [[__("ok")]] </button>
+ <button class="btn btn-primary btn-md" v-on:click="close_modal();"> [[__("ok")]] </button>
</div>
</div>
diff --git a/views/partials/space.html b/views/partials/space.html
index 3b7482f1bad65ce6d8529b2f78d273b1de753ade..86ef0105dcd520c76692dddab3b784e7ead83452 100644
--- a/views/partials/space.html
+++ b/views/partials/space.html
@@ -1,131 +1,3 @@
-<!-- FIXME modal -->
-<div class="modal" v-if="(duplicate_folders.length > 0)" v-cloak>
- <div class="modal-wrapper">
- <div class="modal-dialog">
-
- <button type="button" class="btn btn-icon btn-light btn-round close" v-on:click="duplicate_folders = []">
- <span class="icon icon-cross-1"></span>
- </button>
-
- <div class="modal-content">
- <div class="modal-body labels-inline">
- <div class="modal-section">
-
- <div class="form-group">
- <label>
- [[__("duplicate_destination")]]
- </label>
- </div>
-
- <div class="form-group">
- <select v-on:change="duplicate_folder_id=$event.target.value">
- <option v-for="f in duplicate_folders" value="{{f._id}}">{{f.name}}</option>
- </select>
- </div>
-
- <div class="form-group">
- <button class="btn btn-md btn-round btn-primary" v-on:click="duplicate_folder_confirm(); ">
- <span class="icon-label">[[__("ok")]]</span>
- </button>
-
- <button class="btn btn-md btn-round btn-darken pull-right" v-on:click="duplicate_folders = [];">
- <span class="icon-label">[[__("cancel")]]</span>
- </button>
- </div>
- </div>
-
- </div>
- </div>
- </div>
- </div>
-</div>
-
-<div v-cloak class="header-left" v-show="active_space_loaded">
- <div class="btn-group dark">
-
- <div class="pull-left">
- <a
- class="btn btn-stroke-darken btn-md btn-round btn-icon"
- title="[[__("home")]]" href="/spaces"
- v-if="(logged_in && !embedded && !active_space.parent_space_id && !guest_nickname)">
- <span class="icon icon-home"></span>
- </a>
-
- <a
- class="btn btn-stroke-darken btn-md btn-round btn-icon"
- title="[[__("parent_folder")]]"
- href="/folders/{{active_space.parent_space_id}}"
- v-if="(active_space.parent_space_id && !guest_nickname)">
-
- <span class="icon icon-arrow-left-light"></span>
- </a>
-
- <input class="input input-md input-transparent w-auto"
- id="space-title"
- v-model="active_space.name" name="title" v-on:keydown="save_space_keydown($event)"
- v-if="space_editing_title && logged_in" style="padding-right:0" v-focus>
-
- <span class="input input-md input-transparent w-auto"
- v-if="!space_editing_title && logged_in"
- v-on:click="edit_space_title()">{{active_space.name}}</span>
-
- <span v-if="!logged_in" class="btn btn-dark btn-round btn-md">{{active_space.name}}</span>
-
- <button class="btn btn-md btn-transparent btn-icon" v-if="space_editing_title" v-on:click="save_space_keydown()">
- <span class="icon icon-check"></span>
- </button>
-
- <div class="dropdown top left light" v-bind:class="{open: active_dropdown=='space'}">
- <button class="btn btn-md btn-icon btn-dark" v-on:click="activate_dropdown('space')">
- <span class="icon icon-triangle-down"></span></button>
-
- <div class="dropdown-menu" role="menu">
- <ul class="select-list">
-
- <li v-on:click="activate_access()" v-if="logged_in">
- <span>
- <span class="icon icon-sm icon-share"></span>
- <span>[[ __('share') ]]</span>
- </span>
- </li>
-
- <li v-on:click="edit_space_title()" v-if="logged_in">
- <span>
- <span class="icon icon-sm icon-tag"></span>
- <span>[[ __('rename') ]]</span>
- </span>
- </li>
-
- <li v-on:click="duplicate_space_into_folder()" v-if="logged_in">
- <span>
- <span class="icon icon-sm icon-duplicate"></span>
- <span>[[ __('duplicate') ]]</span>
- </span>
- </li>
-
- <li v-on:click="download_space()">
- <span>
- <span class="icon icon-sm icon-download"></span>
- <span>[[ __('download_space') ]]</span>
- </span>
- </li>
-
- <li v-on:click="activate_modal('support')" v-if="logged_in">
- <span>
- <span class="icon icon-sm icon-info"></span>
- <span>[[ __('support') ]]</span>
- </span>
- </li>
- </ul>
- </div>
- </div>
-
- </div>
- </div>
-
- <span class="btn btn-red btn-md" id="offline-indicator" v-bind:class="{offline: was_offline}" v-on:click="show_offline_help()">[[__("offline")]]</span>
-</div>
-
<div v-cloak class="header-right" v-if="active_space_loaded">
<span v-for="active_user in active_space_users" >
@@ -140,14 +12,8 @@
</button>
</span>
-
- <div class="btn-group dark" v-if="active_space_role!='viewer'">
- <button class="btn btn-md btn-transparent btn-icon" title="Start Presentation (others follow what you see)" v-on:click="toggle_present_mode()" v-bind:class="{open:present_mode}">
- <span class="icon icon-presentation"></span>
- </button>
- </div>
- <div class="btn-group dark round" v-if="zones.length">
+ <div class="btn-group light round" v-if="zones.length">
<button class="btn btn-md btn-transparent btn-icon" v-on:click="go_to_previous_zone()" title="[[__("Previous Zone")]]">
<span class="icon icon-triangle-4-left"></span>
</button>
@@ -158,17 +24,13 @@
<span class="icon icon-triangle-4-right"></span>
</button>
</div>
-
- <!--button class="btn btn-md btn-dark btn-round btn-icon" v-on:click="download_space()" title="[[__("download_space")]]">
- <span class="icon icon-download"></span>
- </button-->
- <div class="btn-group dark" id="meta-toggle" style="margin-right:10px">
+ <!--div class="btn-group light" id="meta-toggle" style="margin-right:10px">
<button class="btn btn-md btn-transparent btn-icon" v-on:click="toggle_meta()" title="[[__("chat")]]">
<span class="jewel" style="color: white; background-color: red" v-if="meta_unseen>0">{{meta_unseen}}</span>
<span class="icon icon-messages"></span>
</button>
- </div>
+ </div-->
</div>
{% include "./tool/toolbar-elements.html" %}
@@ -206,7 +68,7 @@
<div id="space-clipboard" style="position:fixed;top:0;left:0;z-index:0;opacity:0;background-color:white"><textarea v-model="selected_artifacts_json" cols="2" rows="2" id="clipboard-ta" class="mousetrap"></textarea></div>
- <div class="space-bounds" v-bind:style="{width: active_space.width*bounds_zoom + 'px', height: active_space.height*bounds_zoom + 'px', 'background-color': active_space.background_color}"></div>
+ <div class="space-bounds" v-bind:style="{width: (active_space.width*bounds_zoom+1000) + 'px', height: (active_space.height*bounds_zoom+1000) + 'px', 'background-color': active_space.background_color}"></div>
<div class="wrapper"
v-bind:style="{
@@ -244,7 +106,6 @@
<a class="link btn btn-round btn-primary btn-sm" v-if="a.view.link" v-bind:href="a.view.link" target="_blank">{{a.view.link_caption}}</a>
</span>
- <div class="btn btn-xs btn-icon btn-round btn-primary edit" v-show="editing_artifact_id!=a._id && is_selected(a)" v-on:touchstart="delayed_edit_artifact($event)"><span class="icon icon-pencil" v-on:click="toggle_selected_artifact_editing(true)" v-on:"touchstart:delayed_edit_artifact($event)"></span></div>
<input v-show="is_selected(a)" type="text" id="ios-focuser-{{a._id}}" class="ios-focuser">
</div>
@@ -463,7 +324,7 @@
</div>
<div v-if="active_space_loaded" v-cloak>
- <div id="minimap"
+ <!--div id="minimap"
v-bind:style="{width: ''+(active_space.width/minimap_scale)+'px', height: ''+(active_space.height/minimap_scale)+'px', bottom: '66px', right: '20px'}"
v-if="active_space"
v-on:mousedown="handle_minimap_mousedown($event)"
@@ -475,17 +336,16 @@
v-on:mouseup="handle_minimap_mouseup($event)">
<div v-for="a in active_space_artifacts" v-bind:style="{left: ''+(a.x/minimap_scale)+ 'px', top: ''+(a.y/minimap_scale) + 'px', width: ''+(a.w/minimap_scale)+ 'px', height: ''+(a.h/minimap_scale) + 'px'}"></div>
<div class="window" v-bind:style="{left: ''+(scroll_left/minimap_scale) + 'px', top: ''+(scroll_top/minimap_scale)+ 'px', width: ''+(window_width/minimap_scale)+ 'px', height: ''+(window_height/minimap_scale) + 'px'}"></div>
+ </div-->
- </div>
-
- <div class="btn-group dark" style="position:absolute;bottom:20px;right:20px;">
- <button class="btn btn-icon btn-md btn-transparent" v-on:click="zoom_in()">
+ <div class="btn-group light zoom-bar" style="position:absolute;bottom:20px;right:20px;">
+ <button class="btn btn-icon btn-md btn-white" v-on:click="zoom_in()">
<span class="icon icon-plus"></span>
</button>
- <button class="btn btn-md btn-transparent no-p" v-on:click="zoom_to_original()">
+ <button class="btn btn-md btn-white no-p" v-on:click="zoom_to_original()">
{{viewport_zoom_percent}}%
</button>
- <button class="btn btn-icon btn-md btn-transparent" v-on:click="zoom_out()">
+ <button class="btn btn-icon btn-md btn-white" v-on:click="zoom_out()">
<span class="icon icon-minus"></span>
</button>
</div>
diff --git a/views/partials/tool/color.html b/views/partials/tool/color.html
index a4ee0185701b62aeb18801f5bdd88b69d4356f03..ced83e7bd87aff18a54bbb13ebcc97f1b1634c2d 100644
--- a/views/partials/tool/color.html
+++ b/views/partials/tool/color.html
@@ -126,19 +126,11 @@
<label class="label label-sm text-center">[[__("font_size")]]</label>
<input class="input no-b no-p text-center text-large" spellcheck="false" type="text" pattern="[0-9]" maxlength="64" v-model="active_style.font_size">
- <!--button tabindex="-1" class="input-drag btn btn-transparent btn-icon" style="cursor: ns-resize;" v-sd-fader="true" sd-fader-var-y="active_style.font_size" sd-fader-min-y="8" sd-fader-max-y="400" sd-fader-sens="0.2">
+ <button tabindex="-1" class="input-drag btn btn-transparent btn-icon" style="cursor: ns-resize;" v-sd-fader="true" sd-fader-var-y="active_style.font_size" sd-fader-min-y="30" sd-fader-max-y="200" sd-fader-sens="5">
<span class="icon icon-triangles-vertical"></span>
- </button-->
+ </button>
<span class="input-unit">px</span>
</div>
-
- <div class="form-group no-m">
- <span class="font-size-swatches" v-show="opened_dialog=='color-text'">
- <button class="btn btn-sm" v-on:click="apply_font_size(64)" style="font-size:32px">Big</button>
- <button class="btn btn-sm" v-on:click="apply_font_size(32)" style="font-size:24px">Medium</button>
- <button class="btn btn-sm" v-on:click="apply_font_size(18)" style="font-size:14px">Small</button>
- </span>
- </div>
<!--div class="form-group no-m">
<label class="label label-sm text-center">[[__("line_height")]]</label>
diff --git a/views/partials/tool/layout.html b/views/partials/tool/layout.html
index 1982127ddb1cee79b8c40a5bc0aa34d6b3d413c6..8a9d00051834d8279b6d4b96ec3a70340fc6116f 100644
--- a/views/partials/tool/layout.html
+++ b/views/partials/tool/layout.html
@@ -1,6 +1,6 @@
<div id="layout" class="relative">
<div class="dialog-section no-p-b">
- <div class="btn-group">
+ <div class="">
<button class="btn btn-transparent btn-icon" v-on:click="layout_stack_top()">
<span class="icon icon-stack-3d-top"></span>
</button>
@@ -20,7 +20,7 @@
<span class="icon icon-align-bottom"></span>
</button>
</div>
- <div class="btn-group">
+ <div class="">
<button class="btn btn-transparent btn-icon" v-on:click="layout_align_center()">
<span class="icon icon-align-center-horizontal"></span>
</button>
diff --git a/views/partials/tool/text-styles.html b/views/partials/tool/text-styles.html
index e88f10af30ab41d0791b0fb4fb3dfc5455b733b4..44d2b69b236f4939dab144a9ef9736c5ef214260 100644
--- a/views/partials/tool/text-styles.html
+++ b/views/partials/tool/text-styles.html
@@ -24,6 +24,6 @@
<!--button class="btn btn-transparent btn-icon-labeled" v-on:click="apply_formatting($event,'insertUnorderedList')">
<span class="icon icon-text-list-bullet"></span>
<span class="icon-label">Bullets</span>
- </button-->
+ </button--!>
</div>
</div>
diff --git a/views/partials/tool/toolbar-elements.html b/views/partials/tool/toolbar-elements.html
index c08d8e11235e06acf892a1bc582f5fa83a7b69f6..d6080f6ab7cbf252d0cf35524a0bfaf405b0da06 100644
--- a/views/partials/tool/toolbar-elements.html
+++ b/views/partials/tool/toolbar-elements.html
@@ -1,21 +1,24 @@
-<div class="toolbar toolbar-elements" v-bind:class="{in:toolbar_artifacts_in,out:!toolbar_artifacts_in}" v-show="!is_active_space_role('viewer') && active_space_loaded" v-bind:style="{left:toolbar_artifacts_x,top:toolbar_artifacts_y}">
-
- <div class="btn-group dark">
-
- <!--div id="search-dialog" class="dropdown bottom light center static" v-bind:class="{open:opened_dialog=='search'}">
- <div class="btn-collapse in">
- <button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='search'}" v-on:click="open_dialog('search')" >
- <span class="icon icon-search"></span>
- <span class="icon-label">[[__("tool_search")]]</span>
- </button>
- </div>
+<div class="toolbar toolbar-elements" v-bind:class="{in:toolbar_artifacts_in,out:!toolbar_artifacts_in}" v-show="!is_active_space_role('viewer') && active_space_loaded">
+
+ <div class="btn-group light vertical">
+
+ <a class="btn btn-icon btn-transparent"
+ title="[[__("home")]]" href="/spaces"
+ v-if="(!active_space.parent_space_id && !guest_nickname)">
+ <span class="icon icon-folder"></span>
+ </a>
+
+ <a class="btn btn-icon btn-transparent"
+ title="Parent Folder"
+ href="/folders/{{active_space.parent_space_id}}"
+ v-if="(active_space.parent_space_id && !guest_nickname)">
+
+ <span class="icon icon-folder"></span>
+ </a>
- <div class="dialog dialog-search">
- xinclude "./search.html"
- </div>
- </div-->
+ <button class="btn btn-divider"></button>
- <div class="dropdown bottom light center" v-bind:class="{open:opened_dialog=='shapes'}">
+ <div class="dropdown top left light" v-bind:class="{open:opened_dialog=='shapes'}">
<div class="btn-collapse in">
<button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='shapes'}" v-on:click="open_dialog('shapes')">
<span class="icon icon-shapes"></span>
@@ -28,11 +31,16 @@
</div>
</div>
- <button class="btn btn-icon-labeled btn-transparent" v-on:click="start_drawing_scribble()">
+ <button class="btn btn-icon-labeled btn-transparent" v-on:click="start_drawing_scribble()" v-bind:class="{active:active_tool=='scribble'}">
<span class="icon icon-tool-scribble"></span>
<span class="icon-label">[[__("tool_scribble")]]</span>
</button>
+ <button class="btn btn-icon-labeled btn-transparent" v-on:click="start_drawing_arrow()" v-bind:class="{active:active_tool=='arrow'}">
+ <span class="icon icon-tool-arrow"></span>
+ <span class="icon-label">[[__("tool_arrow")]]</span>
+ </button>
+
<div class="dropdown bottom light center">
<div class="btn-collapse in">
<button class="btn btn-transparent btn-icon-labeled" v-on:click="handle_insert_image_url()" v-on:touchstart="handle_insert_image_url()">
@@ -44,14 +52,14 @@
<div class="dropdown bottom light center">
<div class="btn-collapse in">
- <button class="btn btn-transparent btn-icon-labeled" v-on:click=" add_artifact(active_space, 'text', null, $event)">
+ <button class="btn btn-transparent btn-icon-labeled" v-on:click="active_tool='note'" v-bind:class="{active:active_tool=='note'}">
<span class="icon icon-tool-text"></span>
<span class="icon-label">[[__("tool_text")]]</span>
</button>
</div>
</div>
- <div class="dropdown bottom light center">
+ <div class="dropdown top left light">
<div class="btn-collapse">
<button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='image'}" v-on:click="open_dialog('image')">
<span class="icon icon-picture"></span>
@@ -64,7 +72,7 @@
</div>
</div>
- <div class="dropdown bottom light center" v-bind:class="{open:opened_dialog=='zones'}">
+ <div class="dropdown top left light" v-bind:class="{open:opened_dialog=='zones'}">
<div class="btn-collapse in">
<button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='zones'}" v-on:click="open_dialog('zones')">
<span class="icon icon-zone"></span>
@@ -79,7 +87,7 @@
<button class="btn btn-divider" v-show="logged_in"></button>
- <div class="dropdown bottom light center" v-show="logged_in" v-bind:class="{open:opened_dialog=='background'}">
+ <div class="dropdown top left center" v-show="logged_in" v-bind:class="{open:opened_dialog=='background'}">
<div class="btn-collapse in">
<button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='background'}" v-on:click="open_dialog('background')">
<span class="letter">bg</span>
@@ -92,6 +100,23 @@
</div>
</div>
+ <button class="btn btn-transparent btn-icon-labeled" v-on:click="activate_access()">
+ <span class="icon icon-share"></span>
+ <span class="icon-label">[[ __('share') ]]</span>
+ </button>
+
+ <!--
+ <li v-on:click="edit_space_title()" v-if="logged_in">
+ <span>
+ <span class="icon icon-sm icon-tag"></span>
+ <span>[[ __('rename') ]]</span>
+ </span>
+ </li>
+ -->
+ <button class="btn btn-transparent btn-icon-labeled" title="Start Presentation (others follow what you see)" v-on:click="toggle_present_mode()" v-bind:class="{open:present_mode}">
+ <span class="icon icon-presentation"></span>
+ <span class="icon-label">[[ __('present') ]]</span>
+ </button>
</div>
</div>
diff --git a/views/partials/tool/toolbar-object.html b/views/partials/tool/toolbar-object.html
index 132f71de6df89a81b2306d617bc83f7ada06b244..0d57cd98027aa3083b3ffabea75539bd0a8c26a9 100644
--- a/views/partials/tool/toolbar-object.html
+++ b/views/partials/tool/toolbar-object.html
@@ -1,42 +1,38 @@
-<div class="toolbar toolbar-properties" v-cloak v-show="active_space_loaded && !is_active_space_role('viewer')" v-bind:class="{in:toolbar_props_in,out:!toolbar_props_in}" v-bind:style="{left:toolbar_props_x,top:toolbar_props_y}" v-if="active_space_loaded">
+<div class="toolbar toolbar-properties" v-cloak v-show="active_space_loaded && !is_active_space_role('viewer')" v-bind:class="{in:toolbar_props_in,out:!toolbar_props_in}" v-if="active_space_loaded">
- <div class="btn-group dark">
- <div class="dropdown topleft light"
+ <div class="btn-group light vertical">
+ <div class="dropdown top right light"
v-bind:class="{open : opened_dialog.match('color') ,
'option-1':opened_dialog=='color-fill' ,
'option-2':opened_dialog=='color-stroke' ,
'option-3':opened_dialog=='color-text',
'options-3':selection_metrics.contains_text}">
- <label
- class="dropdown-toggle btn btn-icon btn-transparent no-r-r"
+ <button
+ class="dropdown-toggle btn btn-icon btn-transparent"
v-on:click="open_dialog('color-fill')"
v-bind:class="{open:opened_dialog=='color-fill'}">
<span class="icon icon-tool-fill icon-sm"></span>
<span class="jewel" v-bind:style="{'background-color':active_style.fill_color}"></span>
- </label>
- <label
- class="dropdown-toggle btn btn-icon btn-transparent no-r"
+ </button><br>
+ <button
+ class="dropdown-toggle btn btn-icon btn-transparent"
v-bind:class="{open:opened_dialog=='color-stroke'}"
v-on:click="open_dialog('color-stroke')">
<span class="icon icon-tool-stroke icon-sm"></span>
<span class="jewel jewel-stroke" v-bind:style="{'border-color':active_style.stroke_color}"></span>
- </label>
- <label
- class="dropdown-toggle btn btn-icon btn-transparent no-r-l"
+ </button><br>
+ <button
+ class="dropdown-toggle btn btn-icon btn-transparent"
v-on:click="open_dialog('color-text')"
v-bind:class="{open:opened_dialog=='color-text'}">
<span class="icon icon-tool-text icon-sm"></span>
<span class="jewel" v-bind:style="{'border-color':active_style.text_color}">{{active_style.font_size}}</span>
- </label>
+ </button>
<div class="dialog">
{% include "./color.html" %}
</div>
</div>
- </div>
-
- <div class="btn-group dark">
-
<!-- <button class="btn btn-transparent btn-icon-labeled">
<span class="icon icon-tool-eyedrop"></span>
<span class="icon-label">Eyedrop</span>
@@ -45,7 +41,7 @@
<button class="btn btn-divider"></button>
-->
- <div class="dropdown top light center" v-bind:class="{open:opened_dialog=='text-styles'}">
+ <div class="dropdown top light right" v-bind:class="{open:opened_dialog=='text-styles'}">
<div class="btn-collapse in">
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('text-styles')" v-bind:class="{open : opened_dialog=='text-styles'}">
<span class="icon icon-text-styles"></span>
@@ -58,21 +54,7 @@
</div>
</div>
- <div class="dropdown top light center" v-bind:class="{open:opened_dialog=='filter'}">
- <div class="btn-collapse" v-bind:class="{in:selection_metrics.contains_images}">
- <!-- <div class="btn-collapse" v-bind:class="in:selection_metrics.count>0"> -->
- <button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('filter')" v-bind:class="{open : opened_dialog=='filter'}">
- <span class="icon icon-contrast"></span>
- <span class="icon-label">[[__("tool_filter")]]</span>
- </button>
- </div>
-
- <div class="dialog">
- {% include "./filter.html" %}
- </div>
- </div>
-
- <div class="dropdown top light center" v-bind:class="{open:opened_dialog=='type-align'}">
+ <div class="dropdown top light right" v-bind:class="{open:opened_dialog=='type-align'}">
<div class="btn-collapse" v-bind:class="{in:selection_metrics.contains_text}">
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('type-align')" v-bind:class="{open : opened_dialog=='type-align'}">
<span class="icon icon-text-align-left-alt"></span>
@@ -85,9 +67,9 @@
</div>
</div>
- <div class="dropdown top light center" v-bind:class="{open:opened_dialog=='layout'}">
+ <div class="dropdown top light right" v-bind:class="{open:opened_dialog=='layout'}">
- <div class="btn-collapse" v-bind:class="{in:selection_metrics.count>0}">
+ <div class="btn-collapse in">
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('layout')" v-bind:class="{open : opened_dialog=='layout'}">
<span class="icon icon-cluster"></span>
<span class="icon-label">[[__("tool_layout")]]</span>
@@ -99,13 +81,13 @@
</div>
</div>
- <div class="dropdown top light center" v-bind:class="{open:opened_dialog=='text-settings'}">
+ <div class="dropdown top light right" v-bind:class="{open:opened_dialog=='text-settings'}">
<div class="btn-collapse in">
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('text-settings')" v-bind:class="{open : opened_dialog=='text-settings'}">
<span class="icon icon-text-typeface"></span>
- <span class="icon-label">Font</span>
- </button>
+ <span class="icon-label">Font</span>
+ </button>
</div>
<div class="dialog">
@@ -115,7 +97,7 @@
<button class="btn btn-divider"></button>
- <div class="dropdown top light center" v-bind:class="{open:opened_dialog=='object-options'}">
+ <div class="dropdown top light right" v-bind:class="{open:opened_dialog=='object-options'}">
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('object-options')" v-bind:class="{open : opened_dialog=='object-options'}">
<span class="icon icon-cogwheel"></span>
<span class="icon-label">[[__("more")]]</span>
diff --git a/views/spacedeck.html b/views/spacedeck.html
index daf54d59081d252cae4ef118a9325748ba660402..19f39a6abbf4db0818f93f801e1579935635f70e 100644
--- a/views/spacedeck.html
+++ b/views/spacedeck.html
@@ -9,13 +9,10 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<link href="[[ '/images/favicon.png' | cdn ]]" rel="icon" type="image/x-icon" />
- <link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,700,600,800,300|Montserrat:400,700|EB+Garamond|Vollkorn|Lato|Roboto|Source+Code+Pro|Ubuntu|Raleway|Playfair+Display|Crimson+Text' rel='stylesheet' type='text/css'>
- <link type="text/css" rel="stylesheet" href="https://fast.fonts.net/cssapi/ee1a3484-4d98-4f9f-9f55-020a7b37f3c5.css"/>
+ <link href='https://fonts.googleapis.com/css?family=Inter' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="[[ '/stylesheets/style.css' | cdn ]]">
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
-
- <script src="//cdnjs.cloudflare.com/ajax/libs/twemoji/1.3.2/twemoji.min.js"></script>
<script>
window.socket_auth = '[[socket_auth]]';