Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Beautiful formatting when using vue, pug, tailwind #414

Closed
vcharov opened this issue Sep 13, 2022 · 4 comments
Closed

Beautiful formatting when using vue, pug, tailwind #414

vcharov opened this issue Sep 13, 2022 · 4 comments
Assignees
Labels
type: feature request Functionality that introduces a new feature

Comments

@vcharov
Copy link

vcharov commented Sep 13, 2022

Hi. It would be great to be able to customize formatting for cases like this, it greatly improves code readability

Input:

TransitionRoot.side-menu(
  class=["fixed inset-0 pt-14 bg-purple", "md:absolute md:top-0 md:left-0 md:inset-auto md:pt-0 md:shrink-0 md:w-[206px] md:h-full"]
  :show="mainLayoutStore.isOpenMenu"
  as="aside"
  enter="transition lg:transition-none"
  enter-from="opacity-0 md:-translate-x-[206px]"
  enter-to="opacity-100 md:translate-x-0"
  leave="transition delay-300 md:delay-0 lg:transition-none"
  leave-from="opacity-100 md:translate-x-0"
  leave-to="opacity-0 md:-translate-x-[206px]"
)

Output:

TransitionRoot.side-menu(
  class=["fixed inset-0 pt-14 bg-purple", "md:absolute md:top-0 md:left-0 md:inset-auto md:pt-0 md:shrink-0 md:w-[206px] md:h-full"]
  :show="mainLayoutStore.isOpenMenu"
  as="aside"
  enter="transition lg:transition-none"
  enter-from="opacity-0 md:-translate-x-[206px]"
  enter-to="opacity-100 md:translate-x-0"
  leave="transition delay-300 md:delay-0 lg:transition-none"
  leave-from="opacity-100 md:translate-x-0"
  leave-to="opacity-0 md:-translate-x-[206px]"
)

Expected behavior:

TransitionRoot.side-menu(
  class=[
    "fixed inset-0 pt-14 bg-purple", 
    "md:absolute md:top-0 md:left-0 md:inset-auto md:pt-0 md:shrink-0 md:w-[206px] md:h-full"
  ]
  :show="mainLayoutStore.isOpenMenu"
  as="aside"
  enter="transition lg:transition-none"
  enter-from="opacity-0 md:-translate-x-[206px]"
  enter-to="opacity-100 md:translate-x-0"
  leave="transition delay-300 md:delay-0 lg:transition-none"
  leave-from="opacity-100 md:translate-x-0"
  leave-to="opacity-0 md:-translate-x-[206px]"
)

That is, the desired behavior is to allow line breaks in this case:
Handlarfinans – ModulesLayoutsMainSideMenu vue 2022-09-13 08 43 17

@Shinigami92
Copy link
Member

As described in #413 => PR welcome
Try your luck
Many before you have failed on that topic, maybe you have more luck
But the parser of pug itself doesn't help at all, so you would need to write everything yourself

@Shinigami92 Shinigami92 added the type: feature request Functionality that introduces a new feature label Sep 13, 2022
@vcharov
Copy link
Author

vcharov commented Sep 13, 2022

you took me back to my issues

@Shinigami92
Copy link
Member

you took me back to my issues

I know
I assume there is a language barrier here

The parser of pug does not support your requested feature.

@vcharov
Copy link
Author

vcharov commented Sep 13, 2022

Thanks

@vcharov vcharov closed this as completed Sep 13, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
type: feature request Functionality that introduces a new feature
Projects
None yet
Development

No branches or pull requests

2 participants