Skip to content

NavBAr Update #90

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Vortex-16 merged 3 commits into from
Jan 31, 2026
Merged

NavBAr Update #90

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
73697cb
Ui Update For Navbar
Vortex-16 Jan 31, 2026
02f22ab
Merge remote-tracking branch 'origin/Mine-ThunderClient' into The-Adv…
Vortex-16 Jan 31, 2026
7f5519e
Merge pull request #89 from Vortex-16/The-Advanced-DevTrack(Incomplet…
Vortex-16 Jan 31, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions client/src/App.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import GitHubInsights from './pages/GitHubInsights'
import Showcase from './pages/Showcase'
import PublicProfile from './pages/PublicProfile'
import ResumeBuilder from './pages/ResumeBuilder'
import Roadmap from './pages/Roadmap'
import { preferencesApi } from './services/api'
import useHeartbeat from './hooks/useHeartbeat'
import Lenis from 'lenis'
Expand Down Expand Up @@ -131,6 +132,7 @@ function App() {
}>
<Route path="/dashboard" element={<Dashboard />} />
<Route path="/learning" element={<Learning />} />
<Route path="/roadmap" element={<Roadmap />} />
<Route path="/projects" element={<Projects />} />
<Route path="/chat" element={<Chat />} />
<Route path="/github-insights" element={<GitHubInsights />} />
Expand Down
386 changes: 296 additions & 90 deletions client/src/components/layout/Navbar.jsx
View file
Open in desktop

Large diffs are not rendered by default.

19 changes: 12 additions & 7 deletions client/src/components/ui/DatePicker.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { useState, useRef, useEffect } from 'react'
import { motion, AnimatePresence } from 'framer-motion'
import { Calendar as CalendarIcon, ChevronLeft, ChevronRight } from 'lucide-react'

export default function DatePicker({ value, onChange, label }) {
export default function DatePicker({ value, onChange, label, minDate, disableFuture = false }) {
const [isOpen, setIsOpen] = useState(false)
const [viewDate, setViewDate] = useState(value ? new Date(value) : new Date())
const containerRef = useRef(null)
Expand Down Expand Up @@ -43,7 +43,7 @@ export default function DatePicker({ value, onChange, label }) {
const monthStr = String(newDate.getMonth() + 1).padStart(2, '0')
const dayStr = String(newDate.getDate()).padStart(2, '0')
const dateString = `${yearStr}-${monthStr}-${dayStr}`

onChange(dateString)
setIsOpen(false)
}
Expand All @@ -62,7 +62,7 @@ export default function DatePicker({ value, onChange, label }) {
const todayStr = `${today.getFullYear()}-${String(today.getMonth() + 1).padStart(2, '0')}-${String(today.getDate()).padStart(2, '0')}`

for (let day = 1; day <= daysInMonth; day++) {
// Construct current cell date string for comparison
// Construct current cell date string for comparison
const cellDate = new Date(year, month, day)
const cellYear = cellDate.getFullYear()
const cellMonth = String(cellDate.getMonth() + 1).padStart(2, '0')
Expand All @@ -71,21 +71,26 @@ export default function DatePicker({ value, onChange, label }) {

const isFuture = cellDate > today

// Validation Logic
let isDisabled = false
if (disableFuture && isFuture) isDisabled = true
if (minDate && cellDateStr < minDate) isDisabled = true

const isSelected = value === cellDateStr
const isToday = cellDateStr === todayStr

days.push(
<button
key={day}
onClick={() => !isFuture && handleDateClick(day)}
disabled={isFuture}
onClick={() => !isDisabled && handleDateClick(day)}
disabled={isDisabled}
type="button"
className={`h-8 w-8 rounded-full text-xs font-medium transition-all relative flex items-center justify-center
${isSelected
? 'bg-purple-500 text-white shadow-lg shadow-purple-500/25'
: isToday
? 'bg-white/10 text-white border border-purple-500/50'
: isFuture
: isDisabled
? 'text-slate-700 cursor-not-allowed opacity-30'
: 'text-slate-300 hover:bg-white/10 hover:text-white'
}
Expand All @@ -101,7 +106,7 @@ export default function DatePicker({ value, onChange, label }) {
return (
<div ref={containerRef} className="relative">
{label && <label className="block text-sm text-slate-400 mb-2">{label}</label>}

<button
type="button"
onClick={() => setIsOpen(!isOpen)}
Expand Down
36 changes: 31 additions & 5 deletions client/src/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,21 +51,47 @@
}

/* Custom scrollbar */
/* Global Scrollbar */
::-webkit-scrollbar {
width: 8px;
width: 6px;
height: 6px;
}

::-webkit-scrollbar-track {
background: #0f172a;
background: transparent;
}

::-webkit-scrollbar-thumb {
background: #334155;
border-radius: 4px;
background: rgba(255, 255, 255, 0.1);
border-radius: 99px;
transition: background 0.2s ease;
}

::-webkit-scrollbar-thumb:hover {
background: #475569;
background: rgba(255, 255, 255, 0.2);
}

/* Custom Scrollbar Utility */
.custom-scrollbar {
scrollbar-width: thin;
scrollbar-color: rgba(255, 255, 255, 0.1) transparent;
}

.custom-scrollbar::-webkit-scrollbar {
width: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
background: transparent;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
background-color: rgba(255, 255, 255, 0.1);
border-radius: 20px;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
background-color: rgba(255, 255, 255, 0.2);
}

/* Hide scrollbar for horizontal scroll */
Expand Down
15 changes: 15 additions & 0 deletions client/src/pages/Learning.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -671,6 +671,21 @@ export default function Learning() {
</div>
</div>
</div>

{/* Mobile Cards - Horizontal scroll on small screens */}
<div className="lg:hidden flex flex-col gap-4 mb-8 flex-shrink-0">
{/* Activity + Skills Row */}
<div className="flex flex-col gap-4">
{/* Top Skills - Flexible height */}
<div className="min-h-[220px] h-auto flex-shrink-0">
<TopSkills entries={learningEntries} verifiedSkills={verifiedSkills} />
</div>
{/* LeetCode Full Width - Flexible height */}
<div className="min-h-[220px] h-auto flex-shrink-0">
<LeetCodeStats />
</div>
</div>
</div>
</div>
</div>

Expand Down
Loading
Loading