How to make p-dialogue responsive

Post Reply
nagia
Posts: 23
Joined: 21 Nov 2017, 14:39

02 Feb 2018, 09:00

Hey,
How can I make the p-dialogue to be responsive for both portrait and landscape modes. I have tried [responsive]="true" and setting width in the css media query but nothing seems to work. Can you please help me?

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

09 Feb 2018, 11:01

Can you send me your css and your p-dialog code in html file?

nagia
Posts: 23
Joined: 21 Nov 2017, 14:39

16 Jul 2018, 08:53

Hi, this is my p-dialogue code. I am making a simple login panel which takes user's credentials.

<p-dialog [(visible)]="display" modal="modal" showEffect="fade" width="400" [closable]="false" [draggable]="false" appendTo="body">
<div class="login-panel ui-fluid">
<div class="login-panel-content">
<div class="ui-g form-group" style="margin-bottom: 16px;">
<div class="ui-g-12">
<span class="md-inputfield">
<input type="text" pInputText [(ngModel)]="userNameAs" style="width:100% !important">
<label>Name</label>
</span>
</div>
<div class="ui-g-12">
<span class="md-inputfield">
<input type="password" pInputText [(ngModel)]="passwordAs" style="width:100% !important">
<label>Password</label>
</span>
</div>
</div>
</div>
</div>
<p-footer>
<div class="ui-dialog-buttonpane ui-helper-clearfix">
<button type="button" pButton icon="fa-close" (click)="display=false;logindisplay(false)" label="Cancel"></button>
<button type="button" pButton icon="fa-check" (click)="logInAs()" label="Sign-in"></button>
</div>
</p-footer>
</p-dialog>

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

18 Jul 2018, 11:00

Thank you, we will work on it and get back to you.

nagia
Posts: 23
Joined: 21 Nov 2017, 14:39

07 Aug 2018, 10:15

Hi,
Any update on this?

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

05 Sep 2018, 12:55

Please, could you try with new version?

Post Reply

Return to “Serenity - PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest