No margin for toolbar buttons after update to UltimaNG 6.1.1

Post Reply
centai
Posts: 44
Joined: 22 Mar 2012, 12:58

14 Nov 2018, 13:16

I have a simple toolbar with buttons in my application:

Code: Select all

<p-toolbar>
    <div class="ui-toolbar-group-left">

        <button pButton type="button" icon="ui-icon-save" class="green-btn"></button>
        <button pButton type="button" icon="ui-icon-delete" class="orange-btn"></button>
        <button pButton type="button" icon="ui-icon-print" class="pink-btn"></button>
    </div>
</p-toolbar>
After updating to UltimaNG 6.1.1 there is no margin anymore between the buttons:

Image

I noticed before I update from v5 to v6 there was the margin defined in .ui-buttom: margin-right: .1em; which is gone now.

In the showcase it seems to work: https://www.primefaces.org/ultima-ng/#/panels
There is some new CSS, which does not exist in my application although I followed the update documentation and can confirm that layout and theme files are in sync.

Code: Select all

[_nghost-c5] button {
    margin-right: .25em;
}

merve7
Posts: 415
Joined: 12 Sep 2017, 10:44

21 Nov 2018, 10:06

This is changed by design. We will add '.ui-toolbar-separator' class for setting the margin in the new version.
You can add the below code in your .ts file until release;

Code: Select all

    styles: [`
        :host ::ng-deep button {
            margin-right: .25em;
        }
    `]

centai
Posts: 44
Joined: 22 Mar 2012, 12:58

21 Nov 2018, 10:09

Do you know when the new version is going to be released? Will it be based on Angular v7 already?

merve7
Posts: 415
Joined: 12 Sep 2017, 10:44

23 Nov 2018, 12:45

Yes, we will upgrade to Angular 7 and PrimeNG 7 and release in December

centai
Posts: 44
Joined: 22 Mar 2012, 12:58

11 Dec 2018, 13:44

I updated to UltimaNG 7.0.0, but there is no change regarding this. Also the manual style does not work for me.

merve7
Posts: 415
Joined: 12 Sep 2017, 10:44

11 Dec 2018, 14:54

Hi,
Could you send me your code?

Also, we added the overrides folder in src/assets/sass you can use this folder for adding margin or other styles and to define variables. We added to avoid maintenance issues after an update. So, this override folder doesn't change after an update.

Post Reply

Return to “Ultima - PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest