Currently no. And the reason for q-transition to exist was to wrap the slide transition as it is now with some JS (can’t be done in CSS alone when you don’t know the exact height of the children). This component will eventually get removed and replaced by a collection of Vue CSS transitions.
Some assumption first: you only want the item list to be scrollable and the rest of the UI to always be visible on screen.
If “no” then add it as part of the layout header (div slot="header").
If “yes” then it requires some thinking. You still need to add it to the header, but you also need to either use Vuex or a simple store of your own to sync what the layout should show based on the page the user is on.
This is just the high level design based on Vue’s own capabilities. Tell me if you need further information.
@Martin yes, known issue. iOS Safari is the new IE in town. Has some serious bugs with fixed positioning (and not only that). Just check links I posted on github issues. Will release the new DataTable component and then I’ll tackle those iOS bugs, so hang in there.
@rstoenescu Then you probably also bumped into topics like quantum mechanics, general relativity, parallel universes, string theory etc.
I only started reading about this a couple of years ago. And though I only scratched the surface, it has put tiny life on earth in a complete different perspective. Very fascinating.
Some more things worth mentioning. I’ll just copy paste my comment on the latest Quasar starter kit / template:
* NOTE! VueRouter "history" mode DOESN'T works for Cordova builds,
* it is only to be used only for websites.
* If you decide to go with "history" mode, please also open /config/index.js
* and set "build.publicPath" to something other than an empty string.
* Example: '/' instead of current ''
* If switching back to default "hash" mode, don't forget to set the
* build publicPath back to '' so Cordova builds work again.
Also, changing the “publicPath” should be carefully considered as it impacts the way you reference static assets.
Aah, I like you are careful at details! The “scroll” CSS class only applies some CSS tweaks to make scrolling smooth on ALL platforms. But it doesn’t make the container scrollable. You have to add some additional CSS like overflow-y: auto besides setting that height and it will work.
EDIT: I’m talking wrong. scroll also adds overflow CSS to your container. So it should work as is!
Yes, you’re right. Lists have their own text color. Will fix this in v0.8. You can however CSS overwrite the “color” property (not through stylus variables) of lists on v0.7 until the improvement arrives in v0.8.