Skip to content
Advertisement

Pug render 2 templates in the same row

Is there a way to render these 2 templates in one line in Pug?

v-flex.compact
          p(id='correspondence-comment-content' v-html='displayContent')
          span
        template(v-if='correspondence.createdBy === currentUser && isTicketEditable')
            a(@click='openEditDialog')
              | Edit
        template
          span
            v-tooltip(top)
              template(#activator='{ on: ontooltip }' #prepend)
                v-btn.float-right(
                  id='copyButton'
                  ref='copyBtn'                    
                  x-small
                  v-on='{...ontooltip}'
                  @click='copyContent'
                )
                  v-icon(small color='grey darken-2' right) $vuetify.icons.faCopy
              span Copy content 

I have been trying with adding span or moving the code around but not able to fix it yet. This code renders but in 2 rows, I essentially want this code in one row.

Any ideas are helpful! Thanks 🙂

Advertisement

Answer

I actually figured this with the help of a colleague Adding a v-flex.compact above the 2 templates worked, as below:

    v-flex.compact
          p(id='correspondence-comment-content' v-html='displayContent')
          span
  v-flex.compact
        template(v-if='correspondence.createdBy === currentUser && isTicketEditable')
            a(@click='openEditDialog')
              | Edit
        template
          span
            v-tooltip(top)
              template(#activator='{ on: ontooltip }' #prepend)
                v-btn.float-right(
                  id='copyButton'
                  ref='copyBtn'                    
                  x-small
                  v-on='{...ontooltip}'
                  @click='copyContent'
                )
                  v-icon(small color='grey darken-2' right) $vuetify.icons.faCopy
              span Copy content 
User contributions licensed under: CC BY-SA
6 People found this is helpful
Advertisement