-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* fixed drawer bug * add check for PRs * add typescript adapt needed changes * add ColorModeContext WIP * add zsuatnd as store for refs fix bugs * fix type bug from styled-components fix typo * fix scroll * add badge * add animation fix typo modify README modify footer * update packages update version number for coming release * fix scroll down indicator border width * Add translation and add missing projects (#4) * update to react 18 (#5) upgraded all packages fix job description
- Loading branch information
Showing
21 changed files
with
12,711 additions
and
32,635 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,35 @@ | ||
| import i18n from 'i18next'; | ||
| import { initReactI18next } from 'react-i18next'; | ||
| import LanguageDetector from 'i18next-browser-languagedetector'; | ||
| import Backend from 'i18next-http-backend'; | ||
|
|
||
| import translationDE from './translation_de.json'; | ||
| import translationEN from './translation_en.json'; | ||
|
|
||
| // translations | ||
| const resources = { | ||
| en: { | ||
| translation: translationEN, | ||
| }, | ||
| de: { | ||
| translation: translationDE, | ||
| }, | ||
| }; | ||
|
|
||
| i18n | ||
| .use(Backend) | ||
| // detect user language | ||
| .use(LanguageDetector) | ||
| // pass the i18n instance to react-i18next. | ||
| .use(initReactI18next) | ||
| // init i18next | ||
| .init({ | ||
| fallbackLng: 'de', | ||
| debug: true, | ||
| interpolation: { | ||
| escapeValue: false, // not needed for react as it escapes by default | ||
| }, | ||
| resources, | ||
| }); | ||
|
|
||
| export default i18n; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,36 @@ | ||
| { | ||
| "welcome.title": "Wilkommen", | ||
| "welcome.title2.1": "zu meinem", | ||
| "welcome.title2.2": "Portfolio", | ||
| "welcome.title.author": "von Philipp Alber", | ||
| "welcome.subtitle.job1": "Full-Stack Entwickler und UI/UX Designer", | ||
| "nav.about-me": "Über mich", | ||
| "nav.projects": "Projekte", | ||
| "nav.source": "Technologien", | ||
| "nav.contact": "Kontakt", | ||
| "about-me.title": "Über mich:", | ||
| "about-me.introduction": "Hallo 👋 Ich bin Philipp", | ||
| "about-me.age": "Ich bin {{age}} Jahre alt und studiere Informatik an der ", | ||
| "about-me.uni": "Eberhard Karls Universität", | ||
| "about-me.uni.location": " in Tübingen.", | ||
| "about-me.description1": "Seit ich 16 bin, programmiere ich leidenschaftlich Websites. Mit den Jahren habe ich durch verschiedenste Projekte immer mehr Erfahrungen in Programmiersprachen und der Entwicklung von Web-Applikationen gesammelt.", | ||
| "about-me.description2": "Außerhalb meiner IDE findet man mich auch gerne auf dem Fussballfeld oder der Skipiste mit meinen Freunden.", | ||
| "projects.title": "Meine Projekte", | ||
| "projects.description": "Übersicht über eine Auswahl von Projekten, an denen ich aktiv mitgewirkt habe.", | ||
| "projects.legends.private": "Privates Projekt", | ||
| "projects.legends.github": "Link zum GitHub Repository (Open-Source)", | ||
| "projects.legends.website": "Link zur Projekt-Website", | ||
| "projects.orderButler.title": "OrderButler", | ||
| "projects.orderButler.description": "Der Order-Butler ist eine Software, um interne Betriebabläufe beim Bewerten von Pokemon Karten zu unterstützten. Dabei arbeiten wir mit einem Digitalen Laufzettel, welcher durch einen QR-Code mit der Bestellung verknüpft wird.", | ||
| "projects.HLM.title": "Heuberger Live Ticker App & Manager (HLM)", | ||
| "projects.HLM.description": "Die Heuberger Live Ticker App ist, wie der Name schon sagt, eine Liver-Ticker App für das lokale Fussballtunier auf dem Heuberg. Der Manager agiert dabei als Tunierleitungssoftware und verwaltet alle Daten, welche von den Gästen mit Hilfe der App abgerufen werden können.", | ||
| "projects.portfolio.title": "Portfolio", | ||
| "projects.portfolio.description": "Ein interaktives Porftfolio, welches die Person und deren Projekte schlicht und stilvoll darstellt. Portfolio dient dabei als perfekte Ergänzung zum herkömmlichen Lebenslauf.", | ||
| "projects.pollenBot.title": "Pollen Bot für Discord", | ||
| "projects.pollenBot.description": "Pollen Bot ist ein Discord Bot, der Pollenfluginformationen per API des DWD einholt und verarbeitet. Die Informationen werden dann in einem Discord-Channel angezeigt.", | ||
| "source.title": "Technologien", | ||
| "source.description": "Diese Website wurde unter anderem mit folgenden Paketen 📂 enwickelt:", | ||
| "source.description2": "Alle Pakete und den kompletten Quellcode findet ihr auf ", | ||
| "error.title": "Etwas ist schiefgelaufen", | ||
| "error.description": "Bitte laden Sie die Seite erneut." | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,36 @@ | ||
| { | ||
| "welcome.title": "Welcome", | ||
| "welcome.title2.1": "to my", | ||
| "welcome.title2.2": "portfolio", | ||
| "welcome.title.author": "by Philipp Alber", | ||
| "welcome.subtitle.job1": "Full-Stack Developer and UI/UX Designer", | ||
| "nav.about-me": "About me", | ||
| "nav.projects": "Projects", | ||
| "nav.source": "Technologies", | ||
| "nav.contact": "Contact", | ||
| "about-me.title": "About Me:", | ||
| "about-me.introduction": "Hello 👋 I'm Philipp", | ||
| "about-me.age": "I am {{age}} years old and I study computer science at ", | ||
| "about-me.uni": "Eberhard Karls University", | ||
| "about-me.uni.location": " at Tübingen.", | ||
| "about-me.description1": "Since I was 16, I have been passionate about programming websites. Over the years, I have gained more and more experience in programming languages and web application development through various projects.", | ||
| "about-me.description2": "Outside of my IDE, you can also find me enjoying the soccer field or on the ski slope with my friends.", | ||
| "projects.title": "My Projects", | ||
| "projects.description": "Overview of a selection of projects I have been actively involved in.", | ||
| "projects.legends.private": "Private project", | ||
| "projects.legends.github": "Link to GitHub repository (open source)", | ||
| "projects.legends.website": "Link to project website", | ||
| "projects.orderButler.title": "OrderButler", | ||
| "projects.orderButler.description": "The Order Butler is a software to support internal operations when evaluating Pokemon cards. In doing so, we work with a Digital Route Sheet, which is linked to the order by a QR code.", | ||
| "projects.HLM.title": "Heuberger Live Ticker App & Manager (HLM)", | ||
| "projects.HLM.description": "The Heuberger Live Ticker App is, as the name suggests, a liver ticker app for the local football tournament on the Heuberg. The manager acts as the tournament management software and manages all data, which can be accessed by guests using the app.", | ||
| "projects.portfolio.title": "Portfolio", | ||
| "projects.portfolio.description": "An interactive portfolio that presents the person and their projects in a simple and stylish way. Portfolio serves as a perfect complement to the traditional resume.", | ||
| "projects.pollenBot.title": "Pollen Bot for Discord", | ||
| "projects.pollenBot.description": "Pollen Bot is a Discord bot that retrieves and processes pollen information via API from the DWD. The information is then displayed in a Discord channel.", | ||
| "source.title": "Technologies", | ||
| "source.description": "This website was developed using the following packages 📂 among others:", | ||
| "source.description2": "All packages and the complete source code can be found on ", | ||
| "error.title": "Something went wrong", | ||
| "error.description": "Please reload the page" | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,61 @@ | ||
| import TranslateIcon from '@mui/icons-material/Translate'; | ||
| import { IconButton, ListItemIcon, ListItemText, Menu, MenuItem, MenuList } from '@mui/material'; | ||
| import React from 'react'; | ||
| import Flag from 'react-world-flags'; | ||
| import i18n from '../assets/translations/i18n'; | ||
|
|
||
| export type SupportedLanguages = 'en' | 'de'; | ||
|
|
||
| interface Languages { | ||
| code: SupportedLanguages; | ||
| isoCountryCode: string; | ||
| name: string; | ||
| } | ||
|
|
||
| const languages: Languages[] = [ | ||
| { | ||
| code: 'en', | ||
| name: 'English', | ||
| isoCountryCode: '826', | ||
| }, | ||
| { | ||
| code: 'de', | ||
| name: 'Deutsch', | ||
| isoCountryCode: '276', | ||
| }, | ||
| ]; | ||
|
|
||
| export const LanguagesSwitch = (): React.ReactElement => { | ||
| const changeLanguage = (lng: SupportedLanguages) => { | ||
| i18n.changeLanguage(lng); | ||
| handleClose(); | ||
| }; | ||
| const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null); | ||
| const open = Boolean(anchorEl); | ||
| const openMenu = (event: React.MouseEvent<HTMLButtonElement>) => { | ||
| setAnchorEl(event.currentTarget); | ||
| }; | ||
| const handleClose = () => { | ||
| setAnchorEl(null); | ||
| }; | ||
|
|
||
| return ( | ||
| <> | ||
| <IconButton onClick={openMenu}> | ||
| <TranslateIcon /> | ||
| </IconButton> | ||
| <Menu anchorEl={anchorEl} open={open} onClose={handleClose}> | ||
| <MenuList> | ||
| {languages.map((language) => ( | ||
| <MenuItem key={language.code} onClick={() => changeLanguage(language.code)}> | ||
| <ListItemIcon> | ||
| <Flag code={language.isoCountryCode} height="15" /> | ||
| </ListItemIcon> | ||
| <ListItemText>{language.name}</ListItemText> | ||
| </MenuItem> | ||
| ))} | ||
| </MenuList> | ||
| </Menu> | ||
| </> | ||
| ); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.