Updated layout and localization:

- Improved "Impressum" and "Me" page layouts.
- Replaced placeholder text with actual content on "Me" page.
- Renamed "Projects" to "Projekte" in the burger menu.
This commit is contained in:
2025-06-19 09:28:13 +02:00
parent 849f557e4e
commit 7fdfa133c8
7 changed files with 59 additions and 83 deletions
+19 -13
View File
@@ -4,18 +4,14 @@
<option name="autoReloadType" value="SELECTIVE" />
</component>
<component name="ChangeListManager">
<list default="true" id="15d653a3-00a9-440e-a365-0d5dba6a77a9" name="Changes" comment="Added a picture of me">
<changelist_data name="KrisHD1337" email="kriscerni@gmail.com" automatic="false" />
<list default="true" id="15d653a3-00a9-440e-a365-0d5dba6a77a9" name="Changes" comment="Added proper text for projects and changed localization to german">
<change afterPath="$PROJECT_DIR$/public/img.jpeg" afterDir="false" />
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/app/layout.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/app/layout.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/public/img.png" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/app/impressum/page.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/app/impressum/page.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/app/me/page.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/app/me/page.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/app/page.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/app/page.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/app/privacy/page.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/app/projects/gambling/page.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/app/projects/nuclear-age/page.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/app/projects/page.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/app/projects/porsche/page.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/app/projects/portfolio/page.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/app/projects/stalinium/page.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/components/burger.jsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/burger.jsx" afterDir="false" />
</list>
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -168,7 +164,8 @@
<workItem from="1748416153006" duration="3000" />
<workItem from="1748435208992" duration="1091000" />
<workItem from="1749106848452" duration="6796000" />
<workItem from="1749710145212" duration="2117000" />
<workItem from="1749710145212" duration="7446000" />
<workItem from="1750314584738" duration="3202000" />
</task>
<task id="LOCAL-00001" summary="created a base layout">
<option name="closed" value="true" />
@@ -338,7 +335,15 @@
<option name="project" value="LOCAL" />
<updated>1749107160951</updated>
</task>
<option name="localTasksCounter" value="22" />
<task id="LOCAL-00022" summary="Added proper text for projects and changed localization to german">
<option name="closed" value="true" />
<created>1749713027509</created>
<option name="number" value="00022" />
<option name="presentableId" value="LOCAL-00022" />
<option name="project" value="LOCAL" />
<updated>1749713027509</updated>
</task>
<option name="localTasksCounter" value="23" />
<servers />
</component>
<component name="TypeScriptGeneratedFilesManager">
@@ -366,6 +371,7 @@
<MESSAGE value="Rename About page to Impressum" />
<MESSAGE value="Update project links in burger component and page layout" />
<MESSAGE value="Added a picture of me" />
<option name="LAST_COMMIT_MESSAGE" value="Added a picture of me" />
<MESSAGE value="Added proper text for projects and changed localization to german" />
<option name="LAST_COMMIT_MESSAGE" value="Added proper text for projects and changed localization to german" />
</component>
</project>
BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 MiB

BIN
View File
Binary file not shown.

Before

Width:  |  Height:  |  Size: 163 KiB

+1 -1
View File
@@ -1,5 +1,5 @@
export default function Impressum() {
return <div className={"h-full p-7.5 text-wrap w-screen md:w-2/3"}>
return <div className={"h-full justify-center p-7.5 text-wrap w-screen md:w-1/2"}>
<h1 className={"text-4xl md:text-5xl"}>Impressum und Haftungsausschluss</h1>
<h2 className={"text-2xl md:text-3xl"}>Impressum</h2>
<p className={"text-base md:text-lg"}>
+23 -60
View File
@@ -1,66 +1,29 @@
export default function Me() {
return (
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.
vLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.
<div className="flex flex-col md:flex-row dark:animate-pulse-border-dark animate-pulse-border-light
justify-between md:h-screen h-full items-center border-b-2 border-x-2 border-emerald-800
dark:border-emerald-300 w-screen p-0 m-0">
<section className="order-2 md:order-1 w-full md:w-1/3 p-5 flex justify-center">
<img
className="w-2/3 mx-auto md:w-sm md:pl-20"
src="/img.jpeg"
alt="Bild von Kristian"
/>
</section>
<section className="order-1 md:order-2 flex flex-col items-center w-full md:w-2/3 p-10 pb-0">
<h1 className="text-3xl md:text-6xl dark:animate-pulse-dark animate-pulse-light p-2">Wer bin ich?</h1>
<p className="md:text-2xl text-center">
Mein Name ist Kristian und bin Schüler an der Informatikmittelschule in Hottingen. Ich bin in
der Schweiz am 17.07.2007 geboren und bin zum teil Kroate, aber auch Slowener. Ich
programmiere hauptsächlich Mods und Videospiele. In meiner Freizeit programmiere ich gerne Mods
für Minecraft, was ich auch sehr gerne mit meinen Kollegen spiele. Mein grosses Hobby ist die
Flugsimulation, wo ich hauptsächlich mit zivilen Flugzeugen fliege. Am meisten fliege ich mit
der Airbus a320, fliege ab und zu aber auch grössere Flieger. Mein längster simulierter Flug war
von Zürich nach Kanada, wo ich ca. 8 Stunden mit einer Boeing 787 flog.
</p>
)
</section>
</div>
);
}
+13 -6
View File
@@ -4,13 +4,20 @@ import {Button} from "@/components/ui/button";
export default function Home() {
return (
<div>
<div className="flex dark:animate-pulse-border-dark animate-pulse-border-light justify-between h-screen
items-center border-b-2 border-x-2 border-emerald-800 dark:border-emerald-300 w-screen p-0 m-0">
<section className={"w-1/2 md:w-1/3 p-5 place-content-center"}>
<img className={"w-sm pl-20"} src={"/img.png"} alt={"Bild von Kristian"}/>
<div className="flex flex-col md:flex-row dark:animate-pulse-border-dark animate-pulse-border-light
justify-between h-screen items-center border-b-2 border-x-2 border-emerald-800
dark:border-emerald-300 w-screen p-0 m-0">
<section className="order-2 md:order-1 w-full md:w-1/3 p-5 flex justify-center">
<img
className="w-2/3 mx-auto md:w-sm md:pl-20"
src="/img.jpeg"
alt="Bild von Kristian"
/>
</section>
<section className={"flex flex-col items-center w-1/2 md:w-2/3 left-1/2 md:left-1/3 p-10"}>
<h1 className={"text-3xl md:text-6xl dark:animate-pulse-dark animate-pulse-light p-2"}>Willkommen!</h1>
<section className="order-1 md:order-2 flex flex-col items-center w-full md:w-2/3 p-10">
<h1 className="text-3xl md:text-6xl dark:animate-pulse-dark animate-pulse-light p-2">Willkommen!</h1>
<p className={"md:text-2xl justify-items-center text-center"}>
Mein Name ist Kristian und bin Schüler an der Informatikmittelschule in Hottingen. Ich
programmiere
+1 -1
View File
@@ -26,7 +26,7 @@ export default function Burger() {
<li className={"p-3 border-b-emerald-600 border-2 dark:border-b-emerald-400"}>
<Accordion.Root className="" type={"multiple"}>
<Accordion.Item value={"item-1"}>
<Accordion.Trigger>Projects</Accordion.Trigger>
<Accordion.Trigger>Projekte</Accordion.Trigger>
<Accordion.Content className="flex justify-center flex-col p-2">
<Link className="text-lg p-2" target={"_blank"} href="https://github.com/michi-mk-zh/PrWR-Porsche"
onClick={() => setIsOpen(!isOpen)}>Wirtschaftsgeschichte von Porsche</Link>