mirror of
https://github.com/Hilbis/Hilbish
synced 2025-07-01 08:42:04 +00:00
38 lines
11 KiB
HTML
38 lines
11 KiB
HTML
<!doctype html>
|
|
<html class="bg-stone-50 dark:bg-neutral-900 text-black dark:text-white"><head><meta content="width=device-width, initial-scale=1.0" name="viewport"><link href="https://rosettea.github.io/Hilbish/versions/new-website/tailwind.css" rel="stylesheet"><title>Hilbish</title><meta content="#ff89dd" name="theme-color"><meta content="https://rosettea.github.io/Hilbish/versions/new-website/hilbish-flower.png" property="og:image"><meta content="Hilbish" property="og:title"><meta content="Hilbish" property="og:site_name"><meta content="website" property="og:type"><meta content="Something Unique. Hilbish is the new interactive shell for Lua fans. Extensible, scriptable, configurable: All in Lua." property="og:description"><meta content="Something Unique. Hilbish is the new interactive shell for Lua fans. Extensible, scriptable, configurable: All in Lua." name="description"><meta content="Lua,Shell,Hilbish,Linux,zsh,bash" name="keywords"><meta content="https://rosettea.github.io/Hilbish/versions/new-website" property="og:url"></head><body class="min-h-screen flex flex-col"><nav class="bg-stone-100/80 dark:bg-neutral-950/80 flex justify-around sticky items-center top-0 w-full z-50 border-b border-b-zinc-300 backdrop-blur-md h-12"><div class="flex my-auto px-2"><div><a class="flex items-center gap-1" href="/"><img class="h-8" src="https://rosettea.github.io/Hilbish/versions/new-website/hilbish-flower.png"><span class="self-center text-3xl font-medium">Hilbish</span></a></div></div><div class="flex gap-3"><a href="https://rosettea.github.io/Hilbish/versions/new-website/install"><span class="inline-flex text-light dark:text-pink-300 dark:hover:text-pink-200 text-pink-600 hover:text-pink-500 hover:underline">Install</span></a><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs"><span class="inline-flex text-light dark:text-pink-300 dark:hover:text-pink-200 text-pink-600 hover:text-pink-500 hover:underline">Docs</span></a><a href="https://rosettea.github.io/Hilbish/versions/new-website/blog"><span class="inline-flex text-light dark:text-pink-300 dark:hover:text-pink-200 text-pink-600 hover:text-pink-500 hover:underline">Blog</span></a></div></nav><div class="flex-auto flex flex-col overflow-none"><div class="sm:hidden h-10 flex py-2 px-4 border-b border-b-zinc-300 w-full gap-2 backdrop-blur-sm bg-zinc-300/50 dark:bg-zinc-800/50"><label class="cursor-pointer" for="sidebar-toggle"><tag><svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" class="fill-white"><path d="M120-240v-80h240v80H120Zm0-200v-80h480v80H120Zm0-200v-80h720v80H120Z"/></svg></tag></label><span class="font-bold">Improving Hilbish's Branding</span></div><div class="h-full sm:flex grid"><input class="peer hidden" id="sidebar-toggle" type="checkbox"><div class="p-4 sm:border-r sm:border-r-zinc-300 col-start-1 row-start-1 bg-neutral-100 dark:bg-neutral-950 basis-2/10 transition-transform duration-300 -translate-x-full peer-checked:translate-x-0 sm:translate-x-0 z-30"><ul class="text-lg flex flex-col gap-2"><li class="font-bold"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs">Introduction</a></li><li class="font-bold"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/getting-started">Getting Started</a></li><li class="font-bold"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/faq">Frequently Asked Questions</a></li><li class="font-bold"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/features">Features</a></li><ul class="pl-4"><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/completions">Completions</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/features/notifications">Notification</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/features/opts">Options</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/features/runner-mode">Runner Mode</a></li></ul><li class="font-bold"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/hooks">Signals</a></li><ul class="pl-4"><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/hooks/command">Command</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/hooks/hilbish">Hilbish</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/hooks/signal">Signal</a></li></ul><li class="font-bold"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/lunacolors">Lunacolors</a></li><li class="font-bold"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/api">API</a></li><ul class="pl-4"><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/api/bait">Module bait</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/api/commander">Module commander</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/api/fs">Module fs</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/api/hilbish">Module hilbish</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/api/readline">Module readline</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/api/snail">Module snail</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/api/terminal">Module terminal</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/api/yarn">Module yarn</a></li></ul><li class="font-bold"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/nature">Nature</a></li><ul class="pl-4"><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/nature/dirs">Module dirs</a></li><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/nature/doc">Module doc</a></li></ul><li class="font-bold"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/vim-mode">Vim Mode</a></li><ul class="pl-4"><li class="mb-2"><a href="https://rosettea.github.io/Hilbish/versions/new-website/docs/vim-mode/actions">Actions</a></li></ul></ul></div><main class="mb-4 h-full overflow-y-auto basis-7/7 col-start-1 row-start-1 transition-all duration-300 peer-checked:filter peer-checked:blur-sm peer-checked:bg-black/30 px-4 pt-2"><h1 class="my-3 font-bold text-4xl">Improving Hilbish's Branding</h1><p>Happy birthday Hilbish! As of last month, Hilbish is now 2 years old.
|
|
Unfortunately I missed the official date, but I will still make a more
|
|
focused post on the date (19st).</p><p>I decided to fix up this website and Hilbish's logo, so that can
|
|
be thought of as something for the 2 years milestone?</p><h1 class="my-2 text-neutral-800 dark:text-neutral-300 font-bold text-4xl" id="Logo-Hilbish's-old-logo-was..-not-that-good.-It-definitely-functioned-as-a-logo-but-the-yellow-part-of-it-looked-ugly-(sorry-old-logo).">Logo
|
|
Hilbish's old logo was.. not that good. It definitely functioned
|
|
as a logo, but the yellow part of it looked ugly (sorry old logo).</h1><p><img src="https://safe.kashima.moe/4c6e9q484pcy.png" width=256>
|
|
<br></p><p>You would have definitely seen the new logo, since it is currently
|
|
in use on the navigation bar and footer. Here it is in a bigger view:
|
|
|
|
<img src="https://safe.kashima.moe/oy72vpev2yi4.png" width=256>
|
|
<br>
|
|
|
|
# Website
|
|
Ever since this website was first made, from the release of v2.0, it has
|
|
been doing it's job of being a website good enough, but there were a few issues.</p><h1 class="my-2 text-neutral-800 dark:text-neutral-300 font-bold text-4xl" id="Padding-Padding-is-very-important-The-edges-of-your-screen-need-space-to-do-nothing-after-all.-On-mobile-or-screens-small-enough-there-would-not-be-enough-space-for-the-auto-margin-to-fill-and-since-there-was-no-padding-besides-that-it-means-things-would-look-a-bit-cramped.-This-was-simple-to-fix.">Padding
|
|
Padding is very important! The edges of your screen need space to do nothing,
|
|
after all. On mobile or screens small enough, there would not be enough space
|
|
for the auto margin to fill, and since there was no padding besides that,
|
|
it means things would look a bit cramped. This was simple to fix.</h1><p>Here it is before:
|
|
<img alt="Before" src="https://safe.kashima.moe/nupzzalt2oa4.png"></p><p>and after:
|
|
<img alt="After" src="https://safe.kashima.moe/r0ox4nazfi0q.png"></p><h1 class="my-2 text-neutral-800 dark:text-neutral-300 font-bold text-4xl" id="Docs-Navigation-On-the-docs-page-the-pages-are-on-the-left-on-desktop.-Since-phones-are-too-small-to-have-this-content-on-the-side-it-stays-at-the-top.-This-is-a-bit-counter-intuitive-since-it-brings-in-extra-scrolling-when-navigating-to-every-page-for-docs-and-just-doesn't-look-that-good.">Docs Navigation
|
|
On the docs page, the pages are on the left on desktop. Since
|
|
phones are too small to have this content on the side, it stays at the top.
|
|
This is a bit counter intuitive since it brings in extra scrolling
|
|
when navigating to every page for docs and just doesn't look that good.</h1><p>A few months ago I made it collapse with the site wide navigation, but it
|
|
was not hidden by default. So a few improvements were made:
|
|
- Make the doc navigation hidden by default on mobile, just like site wide navigation
|
|
- Make doc navigation have the same look as site wide navigation</p><p>Here's a before:
|
|
<img alt src="https://safe.kashima.moe/krn0a6qwegdj.png"></p><p>and after:
|
|
<img alt src="https://safe.kashima.moe/sk11ighz47yb.png"></p><p>Looks a lot better now.</p><h1 class="my-2 text-neutral-800 dark:text-neutral-300 font-bold text-4xl" id="Other-Changes-If-you-haven't-noticed-I-have-made-other-changes-to-the-website.-This-includes:---Borders-Something-this-simple-makes-the-website-look-a-lot-better-especially-on-mobile.---More-padding-and-margin-everywhere.-Home-doc-pages-blog-post-listing.">Other Changes
|
|
If you haven't noticed, I have made other changes to the website.
|
|
This includes:
|
|
- Borders! Something this simple makes the website look a lot better, especially on mobile.
|
|
- More padding and margin everywhere. Home, doc pages, blog post listing.</h1></main></div></div><footer class="py-4 px-6 flex flex-row justify-around border-t border-t-zinc-300"><div class="flex flex-col"><a class="flex items-center gap-1" href="https://rosettea.github.io/Hilbish/versions/new-website"><img class="h-24" src="https://rosettea.github.io/Hilbish/versions/new-website/hilbish-flower.png"><span class="self-center text-6xl">Hilbish</span></a><span class="text-xl">The Moon-powered shell!</span><span class="text-light text-neutral-500">MIT License, copyright sammyette 2025</span></div><div class="flex flex-col"><a href="https://github.com/Rosettea/Hilbish" target="_blank"><span class="inline-flex text-light dark:text-pink-300 dark:hover:text-pink-200 text-pink-600 hover:text-pink-500 hover:underline"><tag><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M13.5 6H5.25A2.25 2.25 0 0 0 3 8.25v10.5A2.25 2.25 0 0 0 5.25 21h10.5A2.25 2.25 0 0 0 18 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25" />
|
|
</svg>
|
|
</tag>GitHub</span></a></div></footer></body></html> |