mr-2 vs p-mr-2

UI Components for Vue
Post Reply
mglanzs
Posts: 2
Joined: 09 Jan 2022, 20:41

19 Jan 2022, 22:12

Hi there

I'm relatively new to PrimeVue. I use nuxt with the following packages:

packages.json

Code: Select all

  "dependencies": {
    "@nuxt/content": "^1.15.1",
    "@vue/devtools-api": "^6.0.0-beta.21.1",
    "core-js": "^3.19.3",
    "nuxt": "^2.15.8",
    "vue": "^2.6.14",
    "vue-server-renderer": "^2.6.14",
    "vue-template-compiler": "^2.6.14",
    "papaparse": "^5.3.1",
    "webpack": "^4.46.0",
    "primeicons": "5.0.0",
    "primevue": "2.8.0",
    "primeflex": "^3.1.2"
  }, 
nuxt-config.js

Code: Select all

  css: [
    "primevue/resources/primevue.min.css",
    "primeicons/primeicons.css",
    "primeflex/primeflex.css",
    "@/assets/variables.css",
  ],
  primevue: {
      theme: 'arya-blue',
      dark: false,
      ripple: true,
      components: ['InputSwitch','FileUpload', 'Menu', 'Avatar', 'Card', 'InputText', 'Button', 'Chip', 'Column', 'DataTable', 'Menubar', 'Dialog'],
    },
I need to get the very basics flex stuff sorted. When ever I use the example shown they do not work as expected.
As an example

Code: Select all

 mr-2
works for me however the example suggests to use

Code: Select all

p-mr-2
which does not work for me.

I'm not able to get any of the flex stuff to work properly. For example the below code is not showing the expected inline justification between.

Code: Select all

<div class="p-d-flex p-jc-between">
    <div>Item 1</div>
    <div>Item 2</div>
</div>
Can someone please help with guide to what I'm missing?

Thanks
Martin

mglanzs
Posts: 2
Joined: 09 Jan 2022, 20:41

21 Jan 2022, 23:05

Managed to find the answer https://www.primefaces.org/primeflex/

tugce.kucukoglu
Posts: 560
Joined: 23 Oct 2020, 09:28

24 Jan 2022, 12:18

p prefix is removed with PrimeFlex 3.

Post Reply

Return to “PrimeVue”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 3 guests