#Tag · bonfire.cafe

Jan :rust: :ferris: boosted

jnpn

heh, ratatui supports "flexbox" :)

https://ratatui.rs/highlights/v030/

#tui #cli #layout #rust

Ratatui

v0.30.0

jnpn

@jnpn@mastodon.social · 6 days ago

heh, ratatui supports "flexbox" :)

https://ratatui.rs/highlights/v030/

#tui #cli #layout #rust

Ratatui

v0.30.0

alcinnz and 1 other boosted

Ivan Enderlin 🦀

@hywan@floss.social · 2 months ago

Who needs Graphviz when you can build it yourself?, https://spidermonkey.dev/blog/2025/10/28/iongraph-web.html.

SpiderMonkey has replaced Graphviz by a custom graph layout renderer for their internal devtools. This article explains how the algorithm works, step by step (inspired by Sugiyama et al.'s algorithm, used by Graphviz, but simplified and with more constraints).

Pretty neat!

#SpiderMonkey #graph #layout #DevTools #compiler

SpiderMonkey JavaScript/WebAssembly Engine

Who needs Graphviz when you can build it yourself?

Exploring a new layout algorithm for control flow graphs.

Roni Rolle Laukkarinen boosted

Ana Tudor 🐯

@anatudor@mastodon.social · last month

I am begging you, please don't split your heading into two separate `h2` elements with an `img` in between just to have the image in between your heading words.

This is what subgrid was made for!

#CSS #layout #cssLayout #code #coding #web #dev #webDev #webDevelopment

HTML:

```
<!-- ❌ DON'T DO THIS 🚫 -->
<section>
<h2>Classic</h2>
<img src='classic-bar.png' alt=''/>
<h2>Flavour</h2>
</section>

<!-- ✅ DO THIS ✅ -->
<section>
<h2>
<span>Classic</span>
<span>Flavour</span>
</h2>
<img src='classic-bar.png' alt='the classic chocolate bar'/>
</section>
```

CSS:

```
section, h2 { display: grid }

section { grid-template-rows: repeat(3, auto) }

h2 {
grid-area: 1/ 1/ span 3;
grid-template-rows: subgrid;

span:last-child { grid-row: 3 }
}

img { grid-area: 2/ 1 }
``` — HTML: ``` <!-- ❌ DON'T DO THIS 🚫 --> <section> <h2>Classic</h2> <img src='classic-bar.png' alt=''/> <h2>Flavour</h2> </section> <!-- ✅ DO THIS ✅ --> <section> <h2> <span>Classic</span> <span>Flavour</span> </h2> <img src='classic-bar.png' alt='the classic chocolate bar'/> </section> ``` CSS: ``` section, h2 { display: grid } section { grid-template-rows: repeat(3, auto) } h2 { grid-area: 1/ 1/ span 3; grid-template-rows: subgrid; span:last-child { grid-row: 3 } } img { grid-area: 2/ 1 } ```

Ana Tudor 🐯

@anatudor@mastodon.social · last month

I am begging you, please don't split your heading into two separate `h2` elements with an `img` in between just to have the image in between your heading words.

This is what subgrid was made for!

#CSS #layout #cssLayout #code #coding #web #dev #webDev #webDevelopment