Raise awarenes of webi-cli

[wesleycoder]

I missed the part of webi having it's own cli for several hours and despite still finding it useful I was surprised it's not better mentioned on the homepage (at webinstall.dev).

I suggest putting a brief call to action to checkout the cli (https://webinstall.dev/webi) at the first cut of the homepage so everyone can enjoy more of this awesome tool.

What do you think?

I couldn't find a place for where to submit a PR for the homepage, and assumed it's closed source but if it's open I can gladly open a PR if it could help.

[coolaj86]

Yeah, the brand-asset stuff is in a private repo for now (I've had bad experiences in the past with bad-faith "forks" of other projects).

What we have so far is this banner on Mac & Linux:

>>> Welcome to Webi! - modern tools, instant installs.  <<<
    We expect your experience to be absolutely perfect!

    Success? Star it!   https://github.com/webinstall/webi-installers
    Problem? Report it: https://github.com/webinstall/webi-installers/issues
                        (your system is Darwin/arm64 with libc & curl)

Bootstrapping Webi
    Found ~/.local/bin/webi
    Running ~/.local/bin/webi node@20

Installing node ...
    Found  ~/.local/bin
    'node v20.11.0' already installed:
    ~/.local/opt/node => ~/.local/opt/node-v20.11.0

The key part being:

Bootstrapping Webi
    Found ~/.local/bin/webi
    Running ~/.local/bin/webi node@20

Then each page has a line like:

To update or switch versions, run webi node@<tag>.
- (https://webinstall.dev/node/)

And it's on the homepage in the Dev Tools section:

That all said, I'm open to putting stronger call-outs in each of those places.

What do you think they should look like?

[wesleycoder]

For the homepage I was thinking something on this line right on the first cut (below Why webi? section):

<div class="content">
  <h2>Try the <code>webi</code> cli</h2>
  <p>
    With every package we ship a tiny helpful cli that makes it easy to install and update your packages.
    <br />
    It's fast, easy-to-remember, and conflict free.
  </p>
  <p>If you didn't already, <a href="/webi">install <code>webi</code></a> and try it out.</p>
  <p>Try it with <code>webi package@version</code>.</p>
</div>

Maybe we could improve the contrast on the <code> blocks here also.

---

For the package pages I think we could improve the call to action with some styling. The <code> blocks has low contrast with the background I drafted this (I don't know if it fits the theme) the idea is that anyone checking the page can notice it easier and get a glance of the command with the added contrast.

[Edit:] I was thinking that adding a button for the cli on this page would also benefit this:

---

For the cli I missed the meaning of the message. I understood it as just being something needed for the install script to work. We could do something on the lines of:

Bootstrapping Webi cli
    Found `webi` cli at `~/.local/bin/webi`
    You can also use the cli to install future packages or upgrade them.
    Learn more with `webi --help`
    Running `~/.local/bin/webi shfmt@stable`

(instead of backticks we should use shell coloring as we already do ofc)

These are my thougts, what do you think? Does it make sense? Maybe I'm being picky too, I'm known for not noticing things here and there. Sorry if this is consuming time you don't have. I appreciate the dedication on putting all of this together.

[coolaj86]

I really like the idea of adding a [>_ Webi] button, and a Webi CLI section on the homepage.

(we also need to add a BSD button)