Board theme changes based on time of day + weather🎨
Maintainer antworten meist innerhalb von 2 Tagen
Dieses Issue hat noch niemand übernommen.
Bewertung
- Schwierigkeit
- 2/5
- Geschätzter Aufwand
- 1-3 Stunden
- Anfängerfreundlichkeit
- 76/100
- Issue-Typ
- Feature
- Klarheit
- Klar beschrieben
- Aktivitätsstatus
- Aktiv
- Tech-Stack
- javascript, react, vite
- Bereich
- frontend
Rechercherichtung
Beginne mit client/src/pages/Dashboard.jsx, der im Issue genannten Datei, und prüfe, wie das Dashboard derzeit sein Theme anwendet. Implementiere die im Issue beschriebene zeitbasierte Theme-Auswahl und bestätige, dass sich der Akzent für jeden Zeitbereich ändert. Fertig ist es, wenn das Dashboard für die aktuelle Uhrzeit das angegebene Theme verwendet, ohne Pakete hinzuzufügen oder Änderungen am Backend vorzunehmen.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Beschreibung
Board theme changes based on time of day + weather
File: client/src/pages/Dashboard.jsx
Morning = warm sunrise theme
Afternoon = bright productivity theme
Evening = cool focused theme
Night = deep dark theme 💀
INSANE UX fr!!
Fix:
const getMoodTheme = () => {
const hour = new Date().getHours()
if (hour >= 5 && hour < 10) return {
name: 'sunrise',
accent: '#F39C12',
bg: '#110e08',
label: '🌅 Morning'
}
if (hour >= 10 && hour < 17) return {
name: 'focus',
accent: '#2980B9',
bg: '#080f14',
label: '☀️ Focus time'
}
if (hour >= 17 && hour < 21) return {
name: 'evening',
accent: '#E85D75',
bg: '#14080c',
label: '🌆 Evening'
}
return {
name: 'night',
accent: '#7F77DD',
bg: '#0f0f10',
label: '🌙 Night mode'
}
}
// auto apply theme:
useEffect(() => {
const theme = getMoodTheme()
document.documentElement.style
.setProperty('--accent', theme.accent)
}, [])
~20 lines! No packages, no backend 🎯
People will post screenshots of this!! 🔥
- Vorherrschende Sprache
- JavaScript
- Sterne
- 39
- Forks
- 105
- Ø Merge
- 1 T. 17 Std.
- Gemergte PRs (30 T.)
- 33
Entwicklungsumgebung
- Kein Dockerfile und keine Docker-Compose-Datei
- Keine Pull-Request-Vorlage
- Beitragsleitfaden lesen
Erste Schritte
- Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
- Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
- Forken Sie das Repository und arbeiten Sie in einem Branch.
- Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.
Mehr aus anoopcodehack/DevBoard
-
Add smooth horizontal scroll on board 🖱️Evtl. vergeben @Rahul-pamula hat das vor 1 Tag übernommen. Offengood first issue
Schwierigkeit 1/5 1-3 Stunden Anfängerfreundlichkeit 85/100
anoopcodehack/DevBoard#615 · 1 Kommentar ·
Maintainer antworten meist innerhalb von 2 Tagen
-
good first issue
Schwierigkeit 1/5 1-3 Stunden Anfängerfreundlichkeit 90/100
anoopcodehack/DevBoard#614 ·
Maintainer antworten meist innerhalb von 2 Tagen
-
Truncate long custom column names gracefully ✂️Evtl. vergeben @nikhil9verma hat das heute übernommen. Offengood first issue
Schwierigkeit 1/5 Unter einer Stunde Anfängerfreundlichkeit 95/100
anoopcodehack/DevBoard#613 · 2 Kommentare · 1 zugewiesene Person ·
Maintainer antworten meist innerhalb von 2 Tagen
-
good first issue
Schwierigkeit 1/5 Unter einer Stunde Anfängerfreundlichkeit 85/100
anoopcodehack/DevBoard#612 ·
Maintainer antworten meist innerhalb von 2 Tagen
-
enhancement good first issue
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 88/100
anoopcodehack/DevBoard#609 ·
Maintainer antworten meist innerhalb von 2 Tagen
Alle Issues in anoopcodehack/DevBoard
Ähnliche Issues
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 75/100
jfromaniello/url-join#134 ·
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 74/100
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 60/100
quarto-dev/quarto-cli#15042 ·
Maintainer antworten meist innerhalb von 1 Tag
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 68/100
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 62/100
extendr/extendr.github.io#134 ·