New component embed gif

ilse-langnar · Aug 1, 2022 · 7ca9da2 · 7ca9da2
1 parent 622ef8a
commit 7ca9da2
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 3 deletions.
diff --git a/docs/feature-component-embed.gif b/docs/feature-component-embed.gif
diff --git a/javascript/web/src/App.vue b/javascript/web/src/App.vue
@@ -297,6 +297,12 @@ code {
     background-color: var( --secondary-background-color );
     padding: var( --padding );
     border-radius: var( --border-radius );
+    max-height: 400px;
+    overflow: auto;
+    margin-left: 50px;
+    width: 90%;
+    box-shadow:0 4px 6px rgba(0,0,0,0.1);
+    padding: var( --padding );
 }
 
 /*========Markdown========*/

diff --git a/javascript/web/src/components/Kanban.vue b/javascript/web/src/components/Kanban.vue
@@ -16,9 +16,13 @@
         .loop( v-for="( item, index ) in boards" :key="index" @dragenter.prevent @dragover.prevent )
             .card( v-for="( card, card_index ) in item.cards" :key=" 'card-' + card_index" draggable @dragenter.prevent @dragover.prevent @drop.prevent="on_drop($event, card, item)" style="height: auto; " )
                 input.input.centered( v-if="card_index === 0" v-model="item.name" )
+
                 img.is-pulled-right( v-if="card_index === 0" src="@/assets/images/point.svg")
-                input.input( v-model="card.tagless" @blur="on_input_blur(card)" @keydown.enter="on_input_enter(card)" )
-                input.input( v-model="item.new_card" placeholder="Add a card ..." @keydown.enter="add_card(item, item.new_card)" )
+
+                Note( :note="card" :options="{ 'is_tagless': true, 'hideBullet': true, style: 'padding: 4px; font-size: 14px;' }" )
+
+                // input.input( v-if="card_index === item.cards.length - 1" v-model="item.new_card" placeholder="Add a card ..." @keydown.enter="add_card(item, item.new_card)" )
+            input.input.card( v-model="item.new_card" placeholder="Add a card ..." @keydown.enter="add_card(item, item.new_card)" style="width: 95%;" )
     br
 
 
@@ -198,6 +202,9 @@ export default {
 </script>
 <style scoped>
 
+.kanban {
+}
+
 .kanban .wrapper {
     display: flex;
     flex-direction: row;
@@ -216,6 +223,7 @@ export default {
     margin-top: 1px;
     border-radius: var( --border-radius );
     box-shadow: #485361 0px 5px 15px;
+    height: fit-content;
 }
 
 .kanban .wrapper .loop input {

diff --git a/javascript/web/src/components/Note.vue b/javascript/web/src/components/Note.vue
@@ -10,7 +10,7 @@
         // show mode
         .markdown( v-show="!inote.is_editable" v-html="get_html(options.is_tagless ? inote.tagless : inote.content )" @click="on_focus($event, inote)" :id="inote.id" @drop.prevent="add_file" @dragover.prevent )
 
-    Component.component-embed( v-if="get_component()" :component="get_component()" style="display: block; overflow: hidden; margin-left: 50px; width: 90%; box-shadow:0 4px 6px rgba(0,0,0,0.1); padding: var( --padding );  " )
+    Component.component-embed( v-if="get_component()" :component="get_component()" )
 
 </template>
 <script>