wip

public/css/index.css

@@ -1754,6 +1754,10 @@ li {
   top: 50%;
 }
 
+.padding-1 {
+  padding: 5px;
+}
+
 .map-menu-item {
   background-color: var(--darkdark);
   padding: 5px;

src/client/old.js

@@ -13,8 +13,6 @@ Vue.component("l-tooltip", window.Vue2Leaflet.LTooltip);
 Vue.component("l-polyline", window.Vue2Leaflet.LPolyline);
 Vue.component("l-control-scale", window.Vue2Leaflet.LControlScale);
 
-var first_boot = true
-
 const app = new Vue({
   el: "#app",
   data: {
@@ -282,6 +280,7 @@ const app = new Vue({
   watch: {
     journey: {
       handler: function (ndata, odata) {
+        if (this.edit_active)
           this.save_data();
       },
       deep: true,

template/module/journey/map.pug

@@ -17,5 +17,5 @@ l-map(
   include map/restaurants.pug
 
   include map/travel.pug
-
+  template(v-if="edit_active")
     include map/right_menu.pug

template/module/view/nav.pug

@@ -1,11 +1,10 @@
-header.header
+.row.fleft(style="position:absolute;right:0;")
-  .header-inner.container
+  .col-1
-    .input.input-invis
-      input.small(:value="journey.data.name", type="text", disabled="")
-    .row.header-nav.text-big(style="margin-bottom: 0")
-      .col-sm-3
     a(:href="'/short/' + journey.id")
       i.fas.fa-file-contract
-      .col-sm-3
+  .col-1
     a(:href="'/view/' + journey.id")
       i.fas.fa-camera
+  //- .col-1
+  //-   a(:href="'/' + journey.id" v-on:click.prevent="first_step")
+  //-     i.fas.fa-tools

template/module/view/short_leg.pug

@@ -1,37 +1,39 @@
-.container.section
+.col-11.container.section
-  .row.text-center
+  .row.text-center.align.padding-1
-    .input.col-sm-2
+    .input.col-5.col-sm-2
-      input(disabled="", :value="item.title")
+      input(disabled="", placeholder="Unnamed" :value="item.title")
-    .input.col-sm-4
+    .col-sm-1
+    .input.col-6.col-sm-4
       input(
         disabled="",
         placeholder="No Dates",
-        :value="item.date_range ? format_date(item.date_range[0]) + ' - ' + format_date(item.date_range[1]) : ''"
+        :value="item.date_range ? item.date_range[0].toLocal() + ' - ' + item.date_range[1].toLocal() : ''"
       )
-    .input.col-sm-2
+    .col-1.col-sm-2
-      input(disabled="", placeholder="No Hotel", :value="item.hotel.sname")
+    .input.col-5.col-sm-3.text-dark
-  .row.text-center
+      .text(disabled="" placeholder="No Hotel" :value="item.hotel?item.hotel.sname:''") {{item.hotel?item.hotel.sname:'No Hotel'}}
-    .input.col-sm-3(v-if="item.transit")
+  //- .row.text-center
-      div(v-for="(item, idx) in item.transit")
+    .input.col-sm-3(v-if="item.travel")
-        input(disabled="", :value="item.map((v) => v.id).join(', ')")
+      div(v-for="(item, idx) in item.travel")
-  .row.text-center
+        input(disabled="", placeholder="-" :value="item.map((v) => v.id).join(', ')")
-    .input.col-sm-8(v-if="item.places && item.places.restaurants")
+  .row.align.padding-1
+    .input.col-sm-10.text-dark
       .text-small(
         placeholder="No Restaurants",
-        :value="item.places.restaurants.map((v) => v.sname + (v.notes ? '(' + v.notes + ')' : '')).join(', ')",
+        :value="item.places.restaurants.map((v) => v.sname + (v.notes ? '(' + v.notes + ')' : '')).join(', ') || 'No Restaurants'",
         disabled=""
-      )
+      ) {{item.places.restaurants.map((v) => v.sname + (v.notes ? '(' + v.notes + ')' : '')).join(', ') || 'No Restaurants'}}
-  .row.text-center
+  .row.align.padding-1
-    .input.col-sm-8(v-if="item.places && item.places.activities")
+    .input.col-sm-10.text-dark
       .text-small(
         placeholder="No Activities",
-        :value="item.places.activities.map((v) => v.sname + (v.notes ? '(' + v.notes + ')' : '')).join(', ')",
+        :value="item.places.activities.map((v) => v.sname + (v.notes ? '(' + v.notes + ')' : '')).join(', ') || 'No Activites'",
         disabled=""
-      )
+      ) {{item.places.activities.map((v) => v.sname + (v.notes ? '(' + v.notes + ')' : '')).join(', ') || 'No Activites'}}
-  .row.text-center
+  .row.align.padding-1
-    .input.col-sm-8(v-if="item.notes")
+    .input.col-sm-10.text-dark
       .text-small(
         placeholder="No Notes",
-        :value="item.notes",
+        :value="item.notes || 'No Notes'",
         disabled=""
-      )
+      ) {{item.notes || 'No Notes'}}

template/module/view/view_day.pug

@@ -1,19 +1,19 @@
 div(v-for="(e, idx) in journey.data.main", :key="idx")
   .bg-dark.text-white(v-if="journey.sel_leg == idx")
     .container.section
-      .aligner.text-center.text-white.text-huge(style="margin-bottom: 5px")
+      .row
-        .aligner--itemTop.fleft
+        .col-3.fleft.text-center.text-white.text-huge
-          a(href="#prev", v-on:click.prevent="journey.day_prev()")
+          a(v-on:click.prevent="journey.day_prev()")
             i.fas.fa-angle-left
-        span.container
+        .col-6.container.text-center.align
           span.small {{ journey.data.main[idx].title }} {{ journey.sel_day }}
           .text-big.text-gray {{ journey.data.main[idx].day_title[journey.sel_day] }}
-        .aligner--itemEnd.fright
+        .col-3.fright.text-center.text-white.text-huge
-          a(href="#next", v-on:click.prevent="journey.day_next()")
+          a(v-on:click.prevent="journey.day_next()")
             i.fas.fa-angle-right
       .row
-        .col-12.col-sm-12
+        .col-12.col-sm-12(style="aspect-ratio:1.25;")
-          include map.pug
+          include ../journey/map.pug
       .row
-        .col-12.col-sm-12
+        .col-10
-          .container
+          span.small.text-gray {{journey.data.main[idx].note || '...'}}

template/short.pug

@@ -2,9 +2,15 @@ doctype html
 include module/head.pug
 main#app(v-cloak)
   include module/view/nav.pug
+
+  .bg-dark.text-white(v-if="journey && journey.leg_get()")
+    .container
+      .row.align(style="padding-top:45px;")
+        .col-7.col-sm-5.col-md-4.input.text-big
+          input.text-center(v-model="journey.data.name" placeholder="My Journey" type="text" disabled)
   div(
     v-for="(item, idx) in journey.data.main",
-    :class="idx % 2 === 0 ? 'bg-dark text-white' : ''"
+    :class="idx % 2 === 0 ? 'bg-white text-dark' : 'bg-dark text-white'"
   )
     include module/view/short_leg.pug
 include module/foot.pug