Stack Overflow
Stack Overflow

Questions tagged [primeflex]

PrimeFlex is a lightweight responsive CSS utility library to accompany Prime UI libraries and static webpages as well.

PrimeFlex consists of various CSS utilities that can be combined with Prime UI libraries to craft spectacular applications in no time.

  • Utility First. Style classes for commonly used CSS properties.
  • Grid System. Responsive grid system optimized for all screen sizes.
  • Flexbox Utilities. Responsive flexbox based utilities to place and align your content.
  • Spacing. Apply paddings and margins with ease.
  • Elevation. Built-in shadows to define elevation and importance.
  • Font Utilities. Define font properties like size and styling.
  • Sizing. Specify width and height of an element in responsive fashion.
  • Color System. Integrated with the beautiful color palettes of Prime UI library themes.
  • Responsive. Optimized for all screens including desktops, tables and phones.
  • Form Layout. Exclusive layout utilities to create aesthetic forms.
  • Icons. Integration with PrimeIcons featuring over 200 icons.
  • Optimized Size. Minimize the production size by removing unused CSS.

https://www.primefaces.org/primeflex/

32 questions
5
votes
1 answer

Angular PrimeNG. PrimeFlex: input field not behaving as expected

I am working on an Angular 7 application using PrimeNG and Primeflex. While trying to style a form based component, I have trouble with elements not respecting the prime-flex styling (or at least not behaving as I would…
Urs Beeli
  • 746
  • 1
  • 13
  • 30
4
votes
1 answer

How to handle text overflow using Primreact and Primeflex

In my application I have a DataTable component, one column, namely "Note" can contain very long texts. I have defined the column as follows:
user17145524
  • 227
  • 4
  • 10
3
votes
2 answers

Primeng float label overflow management

Here's a basic fiddle of my issue. Is there any way to achieve a text overflow ellipsis just into the input and a full text when the input is focused like screenshot below? I tried primeflex related classes but no one seems to achieve my…
Fseee
  • 2,476
  • 9
  • 40
  • 63
3
votes
3 answers

Primeflex variables $lg

in Primeflex docs, variable $lg (Breakpoint of screens such as notebook monitors) has a default value of 992px. How can I change that? For example, I want to set a default value of 1100px. Please assist I'm using Primeflex 3.0.1
Branka
  • 63
  • 1
  • 6
3
votes
1 answer

Center the whole form vertically and horizontally using PrimeFlex

I'm using PrimeNG along with PrimeFlex. I want to center the whole form vertically and horizontally, excluding sm for phones and preferrably using PrimeFlex classes. I tried the following, which should center it horizontally, but it didn't work…
nop
  • 4,711
  • 6
  • 32
  • 93
2
votes
1 answer

How can I increase the gap of a PrimeFlex grid?

The PrimeFlex gap classes don't seem to work with grid. How do I get this to increase the gap, instead of creating 4 rows?
Johannes Pertl
  • 833
  • 8
  • 23
2
votes
1 answer

PrimeFlex not working properly on Angular version 13

I'm using "@angular/cli": "~13.3.0", "primeflex": "^3.1.3", i've done the installation npm install primeflex --save and then added to angular.json file "node_modules/primeflex/primeflex.css" my Html as follows:
user16129970
2
votes
0 answers

SassError: Unexpected identifier. Updated Primeflex v2 to v3 and got errors in compilation of primeflex

Error: Module build failed (from ./node_modules/sass- loader/dist/cjs.js): SassError: Expected identifier. ╷ 27 │ .text-blue #007bff{ │ ^ ╵ node_modules\primeflex\src\_mixins.scss 27:21 …
Basu Dev Adhikari
  • 104
  • 7
2
votes
3 answers

PrimeFlex not working on Angular Version 13

I have installed primeFlex(Version 3.4.1) on my angular application(Version 13.1). I followed the instructions on their webpage https://primefaces.org/primeng/showcase/#/primeflex but nothing works... in the developer console - isee that their class…
yehonatan yehezkel
  • 1,116
  • 18
  • 28
2
votes
1 answer

Primeflex 3 and angular 12 unable to render

In my browser In primeflex doc And yes i've already installed with the new stack, Angular 12 and Prime flex 3
Vertical and Grid
cumironin
  • 33
  • 1
  • 2
2
votes
3 answers

PrimeFlex not working on Angular Version 12.1.4

I have installed primeFlex(Version 3.0.1) on my angular application(Version 12.1.4). I followed the instructions on their webpage primeflex.com however, was unable to fix the error. I glanced over the network Tab and found that the CSS file was…
Sulav Dahal
  • 129
  • 3
  • 10
2
votes
1 answer

PrimeFlex not applied on PrimeFaces

I tried to setup PrimeFlex (3.0.1) for PrimeFaces (10.0.0). I used css files as provided in dist folder of PrimeFlex repo. Also I followed the instructions given in PrimeFaces ShowCase and used a couple of flexbox options for a first test drive (as…
Greenfly77
  • 165
  • 2
  • 8
1
vote
0 answers

How do I enable Grid layout at primeng dataview

I'm trying to use dataview component from primeng, I've imported the module successfully, installed primeflex and read the documentation but when i try to use the grid layout it doesn't work and only shows the items in a vertical line, I've tried to…
Ahmed Gamal
  • 13
  • 6
1
vote
2 answers

Primeng p-password component width doesn't fit to container

I'm doing a login page with primeng and all works well but specifically the p-password component doesn't fit when even the above input does it.
Ricardo Ruíz Alarcón
  • 85
  • 8
1
vote
0 answers

How to overrides some variables of SCSS(PrimeFlex)?

I'm using PrimeFlex in an angular application, with SCSS everywhere. They mentions here that to customize their own scss values, I should clone their repo, modify the variables, and reference the build result. But since I'm referencing their…
J4N
  • 19,480
  • 39
  • 187
  • 340
1
2 3