Some stylin'

coolreader18 · coolreader18 · commit e35e0cdec933 · 2019-03-18T20:18:17.000-05:00
diff --git a/src/nico/src/nico/components/Block.vue b/src/nico/src/nico/components/Block.vue
@@ -1,7 +1,7 @@
 <template lang="pug">
   draggable.dragArea(tag="ul" :list="children" :group="group" :clone="onClone")
     li(v-for="child in children")
-      div(v-if="child.type === 'if'")
+      div.if(v-if="child.type === 'if'")
         | if {{ child.condition }}
         Block.child(:children="child.children")
       div(v-else-if="child.type === 'callMars'")
@@ -49,13 +49,19 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .child {
   margin-left: 20px;
 }
 .dragArea {
   outline: 1px dotted;
   min-height: 20px;
-  padding-bottom: 50px;
+  padding: 10px;
+}
+.if {
+  > .dragArea {
+    padding-bottom: 20px;
+  }
+  padding-bottom: 15px;
 }
 </style>
diff --git a/src/nico/src/nico/components/BlockEditor.vue b/src/nico/src/nico/components/BlockEditor.vue
@@ -1,9 +1,10 @@
 <template lang="pug">
   .d-flex
-    .flex-grow-2
+    .flex-grow-2.m-3
       h6.font-weight-bold Control Flow
       Block(:children="controlFlow" :clone="true")
-    .flex-grow-2
+      // mw-35 just for displaying blocksRoot
+    .flex-grow-2.m-3.mw-35
       h6.font-weight-bold Nico
       Block(:children="nicoFuncs" :clone="true")
       | {{ blocksRoot }}
@@ -39,3 +40,9 @@ export default {
   },
 }
 </script>
+
+<style scoped>
+.mw-35 {
+  max-width: 35%;
+}
+</style>
diff --git a/src/nico/src/nico/components/BlockParamEditor.vue b/src/nico/src/nico/components/BlockParamEditor.vue
@@ -3,7 +3,7 @@
     .d-inline(v-if="type.type === 'str'")
       input(v-bind:value="value" v-on:input="$emit('input', $event.target.value)")
     .d-inline(v-if="type.type === 'num'")
-      input.w-25(
+      input.num(
         type="number"
         v-bind:value="value"
         v-on:input="$emit('input', Number($event.target.value))"
@@ -25,3 +25,12 @@ export default {
   },
 }
 </script>
+
+<style scoped>
+.num {
+  width: 75px;
+  outline: solid 1px;
+  margin: 0 5px;
+}
+</style>
+
