sortedcord/mi-sitio-personal
1
1
Fork 0
Code Issues 4 Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Added a low power mode

Browse Source 
- added a lower power mode that reduces cpu load by disabling hero animations
This commit is contained in:
Aditya Gupta
2026-02-23 07:44:53 +05:30
parent 8f1215f9d4
commit 246e1c7688
4 changed files with 37 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/NavigationBar.tsx
View File

@@ -1,6 +1,11 @@
import { Github, Mail, Terminal } from 'lucide-react';
import { Cpu, Github, Mail, Terminal } from 'lucide-react';
export function NavigationBar() {
type NavigationBarProps = {
cpuModeEnabled: boolean;
onCpuModeToggle: () => void;
};
export function NavigationBar({ cpuModeEnabled, onCpuModeToggle }: NavigationBarProps) {
return (
<nav className="flex flex-col sm:flex-row justify-between items-start sm:items-center border-b-2 border-dashed border-(--border-main) pb-4 gap-4">
<div className="flex items-center gap-2 text-sm text-(--text-muted) relative group">
@@ -13,7 +18,20 @@ export function NavigationBar() {
</div>
</div>
<div className="flex items-center gap-6">
<div className="flex items-center gap-6 flex-wrap">
<button
type="button"
onClick={onCpuModeToggle}
className="flex items-center gap-2 text-(--text-muted) hover:text-(--text-main) transition-colors"
aria-pressed={cpuModeEnabled}
aria-label="Toggle low CPU mode"
>
<Cpu className={`w-4 h-4 ${cpuModeEnabled ? 'text-(--color-accent)' : ''}`} />
<span className="font-sketch text-lg">cpu_sav</span>
<span className={`relative inline-flex h-5 w-9 items-center rounded-full border transition-colors ${cpuModeEnabled ? 'bg-(--color-accent) border-(--color-accent)' : 'bg-(--bg-surface) border-(--border-main)'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full transition-colors ${cpuModeEnabled ? 'translate-x-4 bg-(--bg-base)' : 'translate-x-1 bg-(--color-accent)'}`} />
</span>
</button>
<a href="#" className="font-sketch text-lg hover:text-(--text-main) transition-colors flex items-center gap-2 group"><Github className="w-4 h-4 group-hover:-translate-y-1 transition-transform" /> github</a>
<a href="#" className="font-sketch text-lg hover:text-(--text-main) transition-colors flex items-center gap-2 group"><Mail className="w-4 h-4 group-hover:-translate-y-1 transition-transform" /> contact</a>
</div>