update style

hrtjps · Aug 27, 2019 · dd371b6 · dd371b6
1 parent e0a0e6c
commit dd371b6
Show file tree

Hide file tree

Showing 21 changed files with 409 additions and 267 deletions.
diff --git a/package.json b/package.json
@@ -52,6 +52,7 @@
     "vue": "^2.5.17",
     "vue-chartjs": "^3.4.0",
     "vue-codemirror": "^4.0.5",
+    "vue-context": "^4.0.3",
     "vue-cropperjs": "^4.0.0",
     "vue-grid-layout": "^2.3.1",
     "vue-mq": "^0.2.1",

diff --git a/src/assets/scss/_custom.scss b/src/assets/scss/_custom.scss
@@ -318,12 +318,19 @@ h1 {
 .modal-content {
   border-radius: 8px;
 }
-
+.custom-control .custom-checkbox:hover  {
+  cursor: pointer;
+}
 .custom-control-input:checked ~ .custom-control-label::before {
   color: #fff;
   border: solid 2px #8a6454 !important;
   background-color: #8a6454 !important;
 }
+.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
+  color: #fff;
+  border: solid 2px #8a6454 !important;
+  background-color: #8a6454 !important;
+}
 .badge-primary {
   color: #fff;
   background-color: $col-primary;

diff --git a/src/components/UserSidebarEx.scss b/src/components/UserSidebarEx.scss
@@ -1,4 +1,8 @@
 .user-sidebar-nav {
+  @media (max-width: 500px) {
+    max-height: 260px;
+    overflow-y: auto;
+  }
   .user-item{
     border-radius: 5px;
     margin-bottom: 10px;

diff --git a/src/containers/DocumentsContainer.vue b/src/containers/DocumentsContainer.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="app">
     <div class="app-body">
-      <AppSidebar fixed>
+      <AppSidebar >
         <AppLogo></AppLogo>
         <div class="p-3 side-menu">
           <div class="w-100">
@@ -12,7 +12,7 @@
               class="d-block d-sm-none"
               block
               style="padding-top: 0.5rem;"
-              to="/payment/pricing-plan"
+              v-on:click="gotoPage('/payment/pricing-plan')"
             >Upgrade Your Plan</b-button>
             <div class="prepare-tool-nav" v-if="show_tool_menu">
               <hr class="seperate-bar" />
@@ -54,10 +54,6 @@
           <router-view></router-view>
         </div>
       </main>
-      <AppAside fixed>
-        <!--aside-->
-        <DefaultAside />
-      </AppAside>
     </div>
     <TheFooter>
       <!--footer-->
@@ -329,7 +325,11 @@ export default {
       this.$refs["welcomemodal"].show();
     }
     this.setOptions();
+    this.$refs.sidebarToggleBtn.toggle();
 
+    // this.$root.on('toggleSidebar', () => {
+    //   this.$refs.sidebarToggleBtn.toggle();
+    // });
   },
   methods: {
     dragTool() {
@@ -414,6 +414,7 @@ export default {
   },
   watch: {
     $route() {
+      this.$refs.sidebarToggleBtn.toggle();
       this.setOptions();
     }
   }

diff --git a/src/containers/PaymentContainer.vue b/src/containers/PaymentContainer.vue
@@ -5,7 +5,9 @@
         <AppLogo />
         <div class="p-3 side-menu">
           <div class="w-100">
-            <b-button block variant="other" v-on:click="gotoStartPage()">Start Now</b-button>
+            <b-button block variant="other" v-on:click="gotoStartPage()">
+              {{ getSelected('doc')=="selected" ? "Start Now" : "Create Template" }}
+            </b-button>
             <b-button
               variant="primary"
               class="d-block d-sm-none"
@@ -211,6 +213,10 @@ export default {
       this.folder_remove_id = index;
       this.renameFolder(this.folders, layer_id);
     });
+    this.$refs.sidebarToggleBtn.toggle();
+    // this.$root.on('toggleSidebar', () => {
+    //   this.$refs.sidebarToggleBtn.toggle();
+    // });
   },
   methods: {
     renameFolder(folders, layer_id) {
@@ -267,6 +273,8 @@ export default {
   },
   watch: {
     $route(to) {
+      
+      this.$refs.sidebarToggleBtn.toggle();
       if (to.fullPath == "/prepare") {
         this.show_tool_menu = true;
       } else {

diff --git a/src/containers/SignContainer.vue b/src/containers/SignContainer.vue
@@ -30,8 +30,8 @@
               <b-button variant="other" class="px-4 px-sm-4" v-on:click="finishSign()">
                 {{ endFlag? 'Finish': 'Next' }}
               </b-button>
-              <div class="doc-item-no" v-if="signStep > 0">
-                {{ signStep }}
+              <div class="doc-item-no" v-if="6-signStep > 0">
+                {{ 6-signStep }}
               </div>
             </div>
           </template>

diff --git a/src/views/document/Prepare.scss b/src/views/document/Prepare.scss
@@ -15,12 +15,17 @@
   margin-bottom: 20px;
 }
 .doc-container {
-  border-radius: 3px;
-  box-shadow: 0 3px 6px 0 rgba(32, 20, 4, 0.05);
   display: flex;
   flex-wrap: wrap;
   font-size: 13px;
-  padding: 0 2px;
+  padding: 20px;
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  // bottom: 0;
+  z-index: 2;
+
   min-height: 200px;
   .doc-control {
     display: flex;
@@ -142,6 +147,7 @@
   border-radius: 3px;
   box-shadow: 0 3px 6px 0 rgba(32, 20, 4, 0.05);
   background-color: #ffffff;
+
   .documents {
     padding: 15px;
     overflow-y: auto;
@@ -150,6 +156,7 @@
       display: flex;
       justify-content: space-between;
       align-items: center;
+      flex-wrap: wrap;
       .actions {
         color: #9ea0a5;
       }

diff --git a/src/views/document/Prepare.vue b/src/views/document/Prepare.vue
@@ -16,14 +16,20 @@
             @changeValue="changePercent"
             class="mb-0 mx-2"
           />
-          <b-button variant="outline-primary">
-            <UserIcon icon="comment.svg" :button="true" />
-          </b-button>
+          <draggable
+            :list="[{ color: 'black', tool_name: 'Comment', tool_icon: 'fa fa-comment'}]"
+            :clone="cloneTool"
+            :group="{ name: 'people', pull: 'clone', put: false }"
+          >
+            <b-button variant="outline-primary">
+              <UserIcon icon="comment.svg" :button="true" />
+            </b-button>
+          </draggable>
         </div>
       </div>
       <hr class="mb-4" />
       <div class="row">
-        <div class="col-md-9 pr-3 pr-sm-0">
+        <div class="col-md-10 pr-3 pr-sm-0">
           <draggable :list="sign_items" class="doc-container" group="people" handle=".move">
             <div v-for="(item, index) in sign_items" :key="index" class="doc-control">
               <div class="doc-item">
@@ -39,25 +45,13 @@
                 </div>
                 <i class="fa fa-times-circle-o control" v-on:click="sign_items.splice(index, 1)"></i>
               </div>
-              <b-popover :target="`popover-${index}`" placement="bottom">
-                <div class="who-fill">
-                  <div class="arrow-popover"></div>
-                  <span>Who fills this out?</span>
-                  <b-form-select
-                    :plain="true"
-                    class="mt-2"
-                    :options="['Roger Waters','Barrett Nash-Will', 'William Jacobson']"
-                    value="Roger Waters"
-                  ></b-form-select>
-                </div>
-              </b-popover>
             </div>
           </draggable>
           <div class="doc-content w-100 mb-5">
             <pdf :src="viewSrc" class="w-100" :page="viewPage"></pdf>
           </div>
         </div>
-        <div class="col-md-3 pl-3">
+        <div class="col-md-2 pl-3">
           <div class="content-container">
             <div class="documents">
               <div class="title">
@@ -97,9 +91,6 @@
                 </div>
               </div>
             </div>
-            <div class="details-right">
-              <i class="fa fa-chevron-right"></i>
-            </div>
           </div>
           <div class="d-flex justify-content-end flex-wrap pt-4">
             <button
@@ -149,6 +140,13 @@ export default {
     });
   },
   methods: {
+    
+    cloneTool(item) {
+      this.$emit("dragTool");
+      return {
+        ...item
+      };
+    },
     changePercent(e) {
       this.percent = e;
     },

diff --git a/src/views/payment/DocumentList.scss b/src/views/payment/DocumentList.scss
@@ -173,3 +173,8 @@
     }
   }
 }
+
+.selected {
+  font-weight: bold;
+  color: #8a6454;
+}