Comments (8)
It's not just svg elements actually.
from prettier-plugin-astro.
Interesting. So that's the rationale behind that. I've only ever observed it in astro since most of my projects use jsx. It still looks very odd to me, and triggers my OCD, but glad to know it's not a bug. Thanks
from prettier-plugin-astro.
I'm having a similar issue (version 0.12.3).
Before formatting:
<span class:list={["uppercase", dark ? "text-ds-white" : "text-ds-night-sky"]}>by <a href={personUrl(author)} class="hover:text-ds-sky-blue transition-colors duration-hover">{author}</a></span>After formatting:
<span class:list={["uppercase", dark ? "text-ds-white" : "text-ds-night-sky"]} >by <a href={personUrl(author)} class="hover:text-ds-sky-blue transition-colors duration-hover">{author}</a ></span >@Princesseuh As you can see from the above, it seems to extend beyond
svg
elements.
As replied right before your comment, this seems like expected behavior to me, with span
being an inline element.
from prettier-plugin-astro.
This is also the same thing as the previous comments, em
is an inline element and so it needs to hugs its children. Though, Prettier format it a bit differently in HTML files in this specific case because the whitespace before can be converted to a new line, which we don't currently do. Nonetheless, at this time, this result is expected.
This issue only affects SVGs elements, everything else are another, unrelated issues. HTML, Astro and Svelte are whitespace sensitive languages, unlike JSX. So the formatting has to and will be different than JSX.
from prettier-plugin-astro.
Hmm, we might be handling SVGs elements wrongly. Not sure if they should all be treated as block elements, will have to investigate! Thank you for creating an issue for this.
from prettier-plugin-astro.
span
is an inline element, as such this is expected behavior, putting the content in a different manner would result in spaces in your page. You can reproduce similar behavior in HTML files
from prettier-plugin-astro.
I'm having a similar issue (version 0.12.3).
Before formatting:
<span class:list={["uppercase", dark ? "text-ds-white" : "text-ds-night-sky"]}>by <a href={personUrl(author)} class="hover:text-ds-sky-blue transition-colors duration-hover">{author}</a></span>
After formatting:
<span class:list={["uppercase", dark ? "text-ds-white" : "text-ds-night-sky"]}
>by <a
href={personUrl(author)}
class="hover:text-ds-sky-blue transition-colors duration-hover">{author}</a
></span
>
@Princesseuh As you can see from the above, it seems to extend beyond svg
elements.
from prettier-plugin-astro.
This is really kind of surprising. I got this after formatting inside my new project and felt there might be something wrongly configured first:
<p>
Umsatzsteuer-Identifikationsnummer gemรคร ยง 27 a Umsatzsteuergesetz: <em
>ausstehend</em
>
</p>
from prettier-plugin-astro.
Related Issues (20)
- ๐ BUG: Prettier for .astro files doesn't work - looks turned off HOT 7
- ๐ BUG: Cannot handle HTML comments inside conditional blocks HOT 1
- ๐ BUG: Syntax Highlighting Lost and Incorrect Rendering When Condensing Code Blocks HOT 5
- ๐ BUG: <script> formatting broken in files containing multi-byte characters HOT 3
- ๐ BUG: Adding components into head tag breaks the astro file layout (view transitions) HOT 1
- ๐ BUG: Unexpected token, expected "}" for no reason HOT 5
- ๐ BUG: Positioning of `<style>` tag is inconsistent depending on the element exported by a component HOT 1
- ๐ BUG: ViewTransitions component breaks `head` tag on format HOT 1
- ๐ BUG: HTML-style `prettier-ignore` comments do not work for script tags
- ๐ BUG: If a specific test fails in a unit test, an unexplained `TypeError` is raised in the next test
- ๐ BUG: prettier fails to find the plugin HOT 4
- ๐ก RFC: Support prose-wrap option for text content in .astro files HOT 4
- ๐ BUG: `bracketSameLine` not working as expected in self-closing tags
- ๐ BUG: Fragment is moved if it wraps a component HOT 1
- ๐ BUG: inserts space between pre and code, breaks file HOT 2
- ๐ BUG: prettier-ignore breaks file HOT 1
- ๐ BUG: Content is deleted when fixing self-closing br tag HOT 1
- ๐ BUG: Error when using `<></>` syntax in a ternary expression HOT 1
- ๐ BUG: HOT 1
- ๐ BUG: adding duplicate import statment HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. ๐๐๐
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google โค๏ธ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from prettier-plugin-astro.