jQuery UI Widgets Forums Vue jqxWindow align icon in title

This topic contains 2 replies, has 2 voices, and was last updated by  jqwidgetsdev 5 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • jqxWindow align icon in title #122443

    jqwidgetsdev
    Participant

    Hi,

    I am trying to add an icon to align right in JqxWindow, but failing to do so.
    See code below, can you please provide the solution to resolve the problem?

    Thank you.

    <template>
        <JqxWindow
          ref="jqxWindow"
          :width="'100%'"
          :height="600"
          :position="'{ x: 0, y: 0}'"
          :isModal="false"
          :autoOpen="true"
          :draggable="false"
          :showCollapseButton="true"
          :animationType="'combined'"
        >
              <div>
                <div>
                 hello world
                  <div style="float: right">
                    <div><i class="fa fa-question" aria-hidden="true"></i></div>
                  </div>
                </div>
              </div>
              <div>
                 body
              </div>
    
        </JqxWindow>
    </template>
    
      <script type="text/javascript" src="../scripts/blikvm.js"></script>
    <script>
    import JqxWindow from "jqwidgets-scripts/jqwidgets-vue/vue_jqxwindow.vue";
    
    export default {
      name: "App",
      components: {
        JqxWindow,
      },
    };
    </script>
    <style>
    @import "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css";
    </style>
    jqxWindow align icon in title #122446

    Hi,

    Look at this demo: https://codesandbox.io/s/strange-lederberg-f8zx3q?file=/src/App.vue
    I am setting the div which is a child of jqx-window-header to have a width of 100%.
    The header-wrapper will be displayed as flex and with content justified: space-between.

    Best regards,
    Svetoslav Borislavov

    jQWidgets Team
    https://www.jqwidgets.com/

    jqxWindow align icon in title #122449

    jqwidgetsdev
    Participant

    It works like a charm.

    Thanks so much Svetoslav!

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.