q-separator with left closing and right opening

user_1497720 0
Viewed 314

From the example here: https://quasar.dev/vue-components/separator#usage You can see that using <q-separator inset="item" /> we can get separator with left opening and right closing (it's the original separator in the attached image) Is there away to do the opposite (left closing and right opening) as highlighted in the red line below? enter image description here

quasar quasar-framework
1 Answers

From what I see there is no design/option to make it in the left.

Looking at the code though, it just uses margin-left and margin-right:

enter image description here

So if you want it from the left you can swap the values to:

.q-separator--horizontal-item-inset {
  margin-left: 0;
  margin-right: 72px;
}

See codepen example

user_63851840
Related