oimwiodev/New-Optic
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases 1 Wiki Activity

Restore mobile glass effects

Browse Source
This commit is contained in:
oimwiodev
2026-05-16 23:09:32 +01:00
parent ec9bc7552f
commit cdd6f1b103
3 changed files with 8 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@@ -17,6 +17,7 @@ All notable changes to the New Optic website will be documented in this file.
- Balanced mobile navbar controls so the language switcher, WhatsApp CTA, and menu do not bunch up on the right. - Balanced mobile navbar controls so the language switcher, WhatsApp CTA, and menu do not bunch up on the right.
- Reduced the mobile gap between the reputation section and contact panel. - Reduced the mobile gap between the reputation section and contact panel.
- Let the mobile WhatsApp nav CTA stretch into available navbar space. - Let the mobile WhatsApp nav CTA stretch into available navbar space.
- Restored mobile glass blur and premium highlight layers instead of flattening glass surfaces.
## [1.0.0] - 2026-05-16 ## [1.0.0] - 2026-05-16

25
app/globals.css
View File

@@ -86,7 +86,8 @@ a {
background: rgba(255, 255, 255, 0.68); background: rgba(255, 255, 255, 0.68);
border: 1px solid rgba(255, 255, 255, 0.72); border: 1px solid rgba(255, 255, 255, 0.72);
box-shadow: 0 18px 60px rgba(17, 19, 23, 0.08); box-shadow: 0 18px 60px rgba(17, 19, 23, 0.08);
backdrop-filter: blur(24px); backdrop-filter: blur(24px) saturate(1.22);
-webkit-backdrop-filter: blur(24px) saturate(1.22);
} }
.premium-glass::before { .premium-glass::before {
@@ -172,25 +173,11 @@ a {
display: none; display: none;
} }
.floating-sheen {
animation: none;
opacity: 0;
}
.glass,
[class*="backdrop-blur"] {
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
.glass { .glass {
background: rgba(255, 255, 255, 0.86); background: rgba(255, 255, 255, 0.72);
box-shadow: 0 10px 30px rgba(17, 19, 23, 0.07); box-shadow: 0 14px 34px rgba(17, 19, 23, 0.08);
} backdrop-filter: blur(18px) saturate(1.24);
-webkit-backdrop-filter: blur(18px) saturate(1.24);
.premium-glass::before,
.premium-glass::after {
display: none;
} }
main > section { main > section {

2
components/Navbar.tsx
View File

@@ -49,7 +49,7 @@ export default function Navbar({ locale, onLocaleChange, t, whatsappUrl }: { loc
</div> </div>
<div className="relative z-[3] flex min-w-0 flex-1 items-center gap-1.5 max-[374px]:gap-0.5 sm:gap-2 md:hidden"> <div className="relative z-[3] flex min-w-0 flex-1 items-center gap-1.5 max-[374px]:gap-0.5 sm:gap-2 md:hidden">
<LanguageSwitcher locale={locale} onLocaleChange={onLocaleChange} className="w-[132px] shrink-0 bg-white/80 backdrop-blur-none max-[374px]:w-[106px] max-[374px]:p-0.5" buttonClassName="flex-1 px-0.5 max-[374px]:px-0 max-[374px]:py-1.5 sm:px-3" /> <LanguageSwitcher locale={locale} onLocaleChange={onLocaleChange} className="w-[132px] shrink-0 bg-white/72 backdrop-blur-xl max-[374px]:w-[106px] max-[374px]:p-0.5" buttonClassName="flex-1 px-0.5 max-[374px]:px-0 max-[374px]:py-1.5 sm:px-3" />
<PhysicsButton href={whatsappUrl} external className={`${navCtaClassName} min-w-0 flex-1 px-2.5 py-2 text-[11px] max-[374px]:px-1.5 max-[374px]:py-1.5 max-[374px]:text-[9px] sm:px-5 sm:py-2.5 sm:text-sm`}> <PhysicsButton href={whatsappUrl} external className={`${navCtaClassName} min-w-0 flex-1 px-2.5 py-2 text-[11px] max-[374px]:px-1.5 max-[374px]:py-1.5 max-[374px]:text-[9px] sm:px-5 sm:py-2.5 sm:text-sm`}>
{t.nav.cta} {t.nav.cta}
</PhysicsButton> </PhysicsButton>