Spacedeck 6.0 CI WIP; more style, UX cleanups; fix account dialog; add more color swatches; new landing page

views/partials/tool/layout.html

@@ -1,6 +1,6 @@
 <div id="layout" class="relative">
-  <div class="dialog-section no-p-b">
-    <div class="">
+  <div class="dialog-section">
+    <div class="btn-group">
       <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="">
+    <div class="btn-group">
       <button class="btn btn-transparent btn-icon" v-on:click="layout_align_center()">
         <span class="icon icon-align-center-horizontal"></span>
       </button>

views/partials/tool/shapes.html

@@ -1,69 +1,48 @@
 <h4 class="dialog-title">[[__("tool_shape")]]</h4>
 
 <div id="shapes">
-  <div class="dialog-section no-p-h" style="white-space: normal;">
-    <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('ellipse',$event)">
-    <span class="icon icon-shape-circle"></span>
-    <span class="icon-label">[[__("tool_circle")]]</span>
-    </button>
+  <div class="dialog-section">
+    <div class="btn-group">
+      <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('ellipse',$event)">
+        <span class="icon icon-shape-circle"></span>
+        <span class="icon-label">[[__("tool_circle")]]</span>
+      </button>
+      
+      <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('hexagon',$event)">
+        <span class="icon icon-shape-hexagon"></span>
+        <span class="icon-label">[[__("tool_hexagon")]]</span>
+      </button>
+      
+      <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('square',$event)">
+        <span class="icon icon-shape-square"></span>
+        <span class="icon-label">[[__("tool_square")]]</span>
+      </button>
+      
+      <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('speechbubble',$event)">
+        <span class="icon icon-shape-bubble"></span>
+        <span class="icon-label">[[__("tool_bubble")]]</span>
+      </button>
+      
+      <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('cloud',$event)">
+        <span class="icon icon-shape-cloud"></span>
+        <span class="icon-label">[[__("tool_cloud")]]</span>
+      </button>
+      
+      <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('burst',$event)">
+        <span class="icon icon-shape-burst"></span>
+        <span class="icon-label">[[__("tool_burst")]]</span>
+      </button>
+      
+      <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('star',$event)">
+        <span class="icon icon-shape-star"></span>
+        <span class="icon-label">[[__("tool_star")]]</span>
+      </button>
+      
+      <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('heart',$event)">
+        <span class="icon icon-shape-heart"></span>
+        <span class="icon-label">[[__("tool_heart")]]</span>
+      </button>
 
-    <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('hexagon',$event)">
-    <span class="icon icon-shape-hexagon"></span>
-    <span class="icon-label">[[__("tool_hexagon")]]</span>
-    </button>
-
-    <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('square',$event)">
-    <span class="icon icon-shape-square"></span>
-    <span class="icon-label">[[__("tool_square")]]</span>
-    </button>
-
-    <!--button class="btn btn-icon-labeled btn-transparent rot45" v-on:click="add_shape('diamond',$event)">
-    <span class="icon icon-shape-square"></span>
-    <span class="icon-label">[[__("tool_diamond")]]</span>
-    </button-->
-
-    <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('speechbubble',$event)">
-    <span class="icon icon-shape-bubble"></span>
-    <span class="icon-label">[[__("tool_bubble")]]</span>
-    </button>
-
-    <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('cloud',$event)">
-    <span class="icon icon-shape-cloud"></span>
-    <span class="icon-label">[[__("tool_cloud")]]</span>
-    </button>
-
-    <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('burst',$event)">
-    <span class="icon icon-shape-burst"></span>
-    <span class="icon-label">[[__("tool_burst")]]</span>
-    </button>
-
-    <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('star',$event)">
-    <span class="icon icon-shape-star"></span>
-    <span class="icon-label">[[__("tool_star")]]</span>
-    </button>
-
-    <button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('heart',$event)">
-    <span class="icon icon-shape-heart"></span>
-    <span class="icon-label">[[__("tool_heart")]]</span>
-    </button>
-
-    <button class="btn btn-icon-labeled btn-transparent" v-on:click="start_drawing_arrow()">
-      <span class="icon icon-tool-arrow"></span>
-      <span class="icon-label">[[__("tool_arrow")]]</span>
-    </button>
-
-    <button class="btn btn-icon-labeled btn-transparent" v-on:click="start_drawing_line()">
-    <span class="icon icon-tool-line"></span>
-    <span class="icon-label">[[__("tool_line")]]</span>
-    </button>
+    </div>
   </div>
 </div>
-
-<!--
-<div class="dialog-section no-p">
-    <div class="btn-cluster">
-        <button class="btn btn-transparent text-center"> Upload </button>
-        <button class="btn btn-transparent text-center" v-on:click="start_drawing_scribble()"> Draw </button>
-    </div>
-</div>
--->

views/partials/tool/toolbar-elements.html

@@ -8,12 +8,12 @@
       <span class="icon icon-folder"></span>
     </a>
       
-    <a class="btn btn-icon btn-transparent"
+    <a class="btn btn-icon btn-dark"
        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>
+      <span class="icon icon-sd6 icon-svg"></span>
     </a>
 
     <button class="btn btn-divider"></button>
@@ -45,7 +45,7 @@
       <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()">
           <span class="icon icon-upload"></span>
-          <span class="icon-label" >[[__("tool_upload")]]</span>
+          <span class="icon-label" >Media</span>
         </button>
       </div>
     </div>

views/partials/tool/toolbar-object.html

@@ -45,7 +45,7 @@
       <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>
-          <span class="icon-label">styles</span>
+          <span class="icon-label">Styles</span>
         </button>
       </div>
 

views/partials/tool/zones.html

@@ -2,11 +2,11 @@
 
 <div id="zones" style="max-height:500px;overflow-y:scroll">
   <div class="dialog-section">
-    <p v-if="zones.length<2">
+    <!--p v-if="zones.length<2">
       Turn your Space into a zooming presentation by placing some Zones and switch through them when presenting.
-    </p>
+    </p-->
     
-    <button v-on:click="add_zone()" class="btn btn-sm btn-primary">[[__("add_zone")]]</button>
+    <button v-on:click="add_zone()" class="btn btn-sm btn-dark">[[__("add_zone")]]</button>
   </div>
 
   <div class="dialog-section no-p" v-for="z in zones | orderBy 'order'" style="white-space: nowrap;text-align:left;cursor:pointer" v-on:click="zoom_to_zone(z)">