Code on bwa of URL snippets

[thomasbnt]

Editing code parts of URL snippets for tiny/small/medium/large badges on BWA page. Because it's more simple to copy that and better design.

Actual :

<Code code={tinyUrlSnippet} lang="html" />

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
astro-badge	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jul 13, 2023 1:33pm

[thomasbnt]

Good rendering

But maybe change the lang="html" by another appropriate lang for... url?

[delucis]

Is the main thing this aims to fix the backticks around the URL? Personally I liked the text wrapping because it lets you see quickly the difference in the URL, whereas with the Code component, you have to scroll to see that.

We can adjust Tailwind to remove the backticks if that's the main aim.

[thomasbnt]

Yeah to suppress backticks!

[delucis]

OK, so we should be able to do this in tailwind.config.cjs based on an example like this:

module.exports = {
  theme: {
    extend: {
      typography(theme) {
        "code::before": {
          content: '""',
        },
        "code::after": {
          content: '""',
        },
      },
    },
  },
}'

[thomasbnt]

OK, so we should be able to do this in tailwind.config.cjs based on an example like this:

module.exports = {
  theme: {
    extend: {
      typography(theme) {
        "code::before": {
          content: '""',
        },
        "code::after": {
          content: '""',
        },
      },
    },
  },
}'

And user-select: all on code could be nice with that.

[delucis]

And user-select: all on code could be nice with that.

Yeah!

[thomasbnt]

And user-select: all on code could be nice with that.

Yeah!

Need help for that, never touched tailwind config :x

[delucis]

Haha, OK well let’s just go with removing the back ticks for now then! We’re working on a redesign soon, so can tackle those other features then. 👍

[thomasbnt]

I close this PR, and for the future design, I creating a new PR ✨😎

[thomasbnt]

Haha, OK well let’s just go with removing the back ticks for now then! We’re working on a redesign soon, so can tackle those other features then. 👍

arg yes of course for back ticks 😆

[delucis]

Hmm, looks like it didn't work in the preview deployment 🤔

[thomasbnt]

Hello! Seems not working with DEFAULT.

[delucis]

Heh, who'd have thought two backticks could be so complicated to deal with 😄

I'm not sure what the fix is I'm afraid although I'd be happy to merge if you can figure it out!

[thomasbnt]

Heh, who'd have thought two backticks could be so complicated to deal with 😄

I'm not sure what the fix is I'm afraid although I'd be happy to merge if you can figure it out!

aha yeah it's just a story of two back ticks 😆 I don't know, I never touched Tailwind before, and if you don't find the solution, I can't help you, you are better than me about this framework 😄

[delucis]

Fair enough — I don't use Tailwind much so not sure why it's so complicated 😅

I guess we can close this PR then and once we have the new design, this will be fixed by that

[thomasbnt]

I guess we can close this PR then and once we have the new design, this will be fixed by that

Yeah no problem! 😎