From fc7302e43f089fc08742dc21091b189ef50d3261 Mon Sep 17 00:00:00 2001 From: "google-labs-jules[bot]" <161369871+google-labs-jules[bot]@users.noreply.github.com> Date: Sat, 13 Jun 2026 13:47:23 +0000 Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20micro-UX=20and=20acce?= =?UTF-8?q?ssibility=20improvements?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Implemented several micro-UX enhancements to improve intuition, accessibility, and delight: - Fixed anchor links being obscured by the sticky header using `scroll-padding-top`. - Added tactile feedback (`scale(0.97)`) on `:active` state for all buttons and interactive links. - Improved color contrast for secondary labels to meet WCAG AA standards. - Added representative emojis to icon containers for visual hierarchy. - Enhanced security and UX for external download links with `target="_blank"` and `rel="noopener"`. Co-authored-by: christopherfoxjr <213370400+christopherfoxjr@users.noreply.github.com> --- index.html | 35 +++++++++++++++++++++++------------ 1 file changed, 23 insertions(+), 12 deletions(-) diff --git a/index.html b/index.html index 5abef83..2b81a93 100644 --- a/index.html +++ b/index.html @@ -37,7 +37,7 @@ } *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; } -html { scroll-behavior: smooth; } +html { scroll-behavior: smooth; scroll-padding-top: 64px; } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; } @@ -82,6 +82,7 @@ .nav-brand span { color: var(--text); font-weight: 700; } .nav-links { display: flex; align-items: center; gap: .25rem; flex: 1; } .nav-links a { + display: inline-block; font-size: .875rem; font-weight: 500; color: var(--gray-700); padding: .5rem .875rem; border-radius: 6px; transition: background .15s, color .15s; @@ -93,6 +94,7 @@ flex-shrink: 0; } .btn-ghost { + display: inline-block; font-size: .875rem; font-weight: 500; color: var(--blue); padding: .5rem 1.25rem; border-radius: 8px; border: 1.5px solid var(--blue); @@ -100,6 +102,7 @@ } .btn-ghost:hover { background: var(--blue-pale); text-decoration: none; } .btn-solid { + display: inline-block; font-size: .875rem; font-weight: 500; color: var(--white) !important; padding: .5rem 1.25rem; border-radius: 8px; background: var(--blue); @@ -337,7 +340,7 @@ .spec-cell small { display: block; font-size: .6875rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; - color: var(--gray-400); margin-bottom: .375rem; + color: var(--gray-700); margin-bottom: .375rem; } .spec-cell strong { font-size: 1rem; font-weight: 600; color: var(--gray-900); @@ -376,7 +379,7 @@ .req-card:hover { box-shadow: var(--shadow-sm); } .req-card small { font-size: .6875rem; font-weight: 700; letter-spacing: .1em; - text-transform: uppercase; color: var(--gray-400); display: block; margin-bottom: .375rem; + text-transform: uppercase; color: var(--gray-700); display: block; margin-bottom: .375rem; } .req-card strong { font-size: .9375rem; font-weight: 600; color: var(--gray-900); } @@ -443,7 +446,7 @@ } .team-info small { font-size: .6875rem; font-weight: 700; letter-spacing: .08em; - text-transform: uppercase; color: var(--gray-400); display: block; + text-transform: uppercase; color: var(--gray-700); display: block; } .team-info strong { font-size: .9375rem; font-weight: 600; color: var(--gray-900); } @@ -471,6 +474,14 @@ } .faq-item.open .faq-a { max-height: 200px; padding-top: .75rem; } +/* tactile feedback */ +.nav-brand, .nav-links a, .btn-ghost, .btn-solid, .btn-hero-primary, .btn-hero-secondary, .feature-cta, .faq-q { + transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1); +} +.nav-brand:active, .nav-links a:active, .btn-ghost:active, .btn-solid:active, .btn-hero-primary:active, .btn-hero-secondary:active, .feature-cta:active, .faq-q:active { + transform: scale(0.97); +} + /* ─── FOOTER ──────────────────────────────────────────── */ footer { background: var(--gray-900); color: rgba(255,255,255,.6); @@ -557,7 +568,7 @@
GitHub - Download ISO + Download ISO
@@ -571,7 +582,7 @@

A desktop that gets out of your way

KibaOS is a modern, secure operating system built on a foundation of simplicity. Familiar enough to use on day one. Polished enough to love every day after.

- + ⬇ Download KibaOS @@ -606,22 +617,22 @@

Fast. Secure. Effortless.

-
+

Starts fast, stays fast

KibaOS is built lean. No startup services you didn't ask for, no background processes accumulating over time. It performs on day one and keeps performing.

-
+

Security by design

Built on a read-only compressed filesystem with automatic update support and no legacy cruft. Your system stays in a known, clean state.

-
+

A desktop worth looking at

The Budgie desktop brings a cohesive visual experience with Papirus icons, a unified Arc-Dark theme, and a Wayland compositor that renders everything crisply.

-
+

Software, your way

gnome-software and Flatpak give you access to a vast library of applications in a sandboxed environment — installed, updated, and removed without risk to your core system.

@@ -640,7 +651,7 @@

Budgie 10.10 on Wayland

Learn more
@@ -886,7 +897,7 @@

Built by WolfTech Innovations

Ready to make the switch?

Download KibaOS today and experience a desktop built for the way people actually work.

- ⬇ Download KibaOS + ⬇ Download KibaOS