welcome dialog; order UI facelift

src/components/chart/LimitBuilder.vue

@@ -1,5 +1,5 @@
 <template>
-  <rung-builder :name="(builder.breakout?'Breakout':'Limit')"
+  <rung-builder :name="(builder.breakout?'Breakout':'Limit')+(builder.rungs>1?' Ladder':'')"
                 :description="description"
                 :order="order" :builder="builder"
                 v-model="priceEndpoints" :mode="0" :flip="flipped"
@@ -7,7 +7,7 @@
                 :get-model-value="getModelValue" :set-model-value="setModelValue"
                 :set-values="setPrices" :set-weights="setWeights"
                 :std-width="stdWidth" :build-tranches="buildTranches">
-    <table>
+    <table class="rb">
       <tbody>
       <template v-if="prices.length>1">
         <tr>
@@ -15,11 +15,10 @@
             <v-text-field type="number" v-model="higherPrice" min="0"
                           density="compact" hide-details class="mx-1 my-2" variant="outlined"
                           label="Price"
-                          :color="color" :base-color="color"
                           style="flex: 6em"
             />
           </td>
-          <td class="weight">{{ allocationTexts[higherIndex] }}</td>
+          <td class="weight" style="vertical-align: bottom">{{ allocationTexts[higherIndex] }}</td>
         </tr>
         <tr v-for="i in innerIndexes" class="ml-5">
           <td class="pl-5">{{ prices[i] }}</td>
@@ -31,7 +30,6 @@
           <v-text-field type="number" v-model="lowerPrice" min="0"
                         density="compact" hide-details class="mx-1 my-2" variant="outlined"
                         label="Price"
-                        :color="color" :base-color="color"
                         style="flex: 6em"
           />
         </td>
@@ -71,7 +69,7 @@ builderDefaults(props.builder, {
   priceA: null,
   priceB: null,
   rungs: 1,
-  skew: 0,
+  balance: 0,
   breakout: false,
   color: defaultColor,
   buy: true,
@@ -93,7 +91,7 @@ function buildTranches() {
       fraction: w * MAX_FRACTION,
     })
     const symbol = co.selectedSymbol
-    console.log('symbol', symbol, p)
+    // console.log('symbol', symbol, p)
     applyLinePoint(t, symbol, order.buy, p, builder.breakout)
     tranches.push(t)
   }
@@ -228,5 +226,16 @@ td.weight {
   padding-right: 0.5em;
   text-align: right;
 }
+table.rb {
+  padding: 0;
+  border-spacing: 0;
+  tbody {
+    border: none;
+    padding: 0;
+  }
+  td {
+    vertical-align: top;
+  }
+}
 </style>