Thanks for your reply with the examples .( I am sorry I didn’t notice transition property earlier in the document and I think I am getting old )
Juts used simple fade transition with the transition prop .
EDIT: Oh, I see 🙂 I kinda missed the main.js tip…
I am not familiar with Stylus so I thought this is loaded by default. Thanks for the tip!
Even though I try to read up on everything it’s a hit and miss sometimes 🙂
Thank you @rstoenescu for taking time to respond to my question . Good luck . For now I am using the below work around ( Using two <q-layout> tags 🙂 I know this is not the way to do it . But to get the feel of look
You can make your own class to replace .layout-padding. This is the current source for .layout-padding as a starting point for you:
@media only screen and (max-width $layout-small-max)
padding 1.5rem .5rem
padding 0 .5rem
@media only screen and (min-width $layout-medium-min) and (max-width $layout-medium-max)
padding 1.5rem 2rem
padding 0 2rem
@media only screen and (min-width $layout-big-min) and (max-width $layout-big-max)
padding 2.5rem 3rem
padding 0 3rem
@media only screen and (min-width $layout-large-min)
padding 3rem 4rem
padding 0 4rem
In order for you to get access to $layout-* Stylus variables from Quasar, include this in your app <style> tag before it:
Thank You @rstoenescu for making this wonderful framework . I just started using it and noticed the same file size issues .vendor.js - 499 kB and CSS - 253 KB . But as you said definitely it will help if we are able to cherry-pick only the Quasar features .
( In addition to the above size I am going to add JQUERY for Summernote and for SELECT2 plugins , this is making )