tudattr/athome
1
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

Added personal picture and added Author component

Browse Source 
Signed-off-by: Tuan-Dat Tran <tuan-dat.tran@tudattr.dev>
This commit is contained in:
Tuan-Dat Tran
2024-07-25 03:39:53 +02:00
parent 3fb233ebcc
commit 4a18e432b2
13 changed files with 217 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/mod.rs
View File

@@ -80,7 +80,7 @@ pub fn Card(prop: CardProp) -> Element {
div {
class: "pb-4",
div {
class: "flex justify-between",
class: "justify-between",
Picture {src: "{prop.picture}"},
}
}
@@ -112,11 +112,11 @@ pub fn UnderConstruction() -> Element {
rsx! {
div {
class:"rounded flex justify-between w-full p-4 border-b border-gray-200 bg-gray-50 dark:bg-gray-700 dark:border-gray-600 my-8",
class:"rounded justify-between w-full p-4 border-b border-gray-200 bg-gray-50 dark:bg-gray-700 dark:border-gray-600 my-8",
div {
class:"flex items-center mx-auto",
class:"items-center mx-auto",
p {
class:"flex items-center text-sm font-normal text-gray-500 dark:text-gray-400",
class:"items-center text-sm font-normal text-gray-500 dark:text-gray-400",
span { { translate!(i18, "components.under_construction") } }
}
}

2
src/cv.rs
View File

@@ -29,7 +29,7 @@ fn Introduction() -> Element {
class: "flex",
img {
class: "rounded-full w-16 h-16 mx-16",
src: "/pictures/portrait.webp"
src: "/pictures/headshot.webp"
}
P { { translate!(i18, "cv.introduction") }}
}

48
src/home.rs
View File

@@ -6,34 +6,34 @@ use dioxus_sdk::{i18n::use_i18, translate};
pub fn Home() -> Element {
let i18 = use_i18();
rsx! {
Card {
name: translate!(i18, "home.card.name"),
gender: translate!(i18, "home.card.gender"),
picture: "/pictures/comfy.webp",
div {
class: "py-4",
div {
class: "container mx-auto p-4 flex items-center justify-center max-w-md w-full",
Card {
name: translate!(i18, "home.card.name"),
gender: translate!(i18, "home.card.gender"),
picture: "/pictures/headshot.webp",
div {
class: "mb-2",
P { { translate!(i18, "home.card.l1") } },
P { { translate!(i18, "home.card.l2") } },
P { { translate!(i18, "home.card.l3") },
Link {
to: "https://git.tudattr.dev/explore/repos",
new_tab: true,
class: "inline-flex items-center font-medium hover:underline",
"gitea"},
{ translate!(i18, "home.card.l3_1") }
class: "py-4",
div {
class: "mb-2",
P { { translate!(i18, "home.card.l1") } },
P { { translate!(i18, "home.card.l2") } },
P { { translate!(i18, "home.card.l3") },
Link {
to: "https://git.tudattr.dev/explore/repos",
new_tab: true,
class: "items-center font-medium hover:underline",
"gitea"},
{ translate!(i18, "home.card.l3_1") }
},
},
},
},
Link {
to: "mailto:tuan-dat.tran@tudattr.dev",
class: "w-fit relative inline-flex items-center justify-center p-1 mb-2 me-2 overflow-hidden text-sm font-medium text-gray-900 rounded-lg group bg-gradient-to-br from-green-400 to-blue-600 group-hover:from-green-400 group-hover:to-blue-600 hover:text-white dark:text-white w-fill",
p {
class: "p-1",
Link {
to: "mailto:tuan-dat.tran@tudattr.dev",
class: "text-gray-900 bg-gradient-to-br from-green-400 to-blue-600 group-hover:from-green-400 group-hover:to-blue-600 hover:text-white rounded-full shadow-lg py-4 px-4",
{ translate!(i18, "home.card.contact_button") }
}
}
},
},
}
}
}

1
src/layout/footer.rs
View File

@@ -8,6 +8,7 @@ pub fn Footer() -> Element {
rsx! {
div {
class: "container mx-auto",
// ToolsUsed {},
footer {
class:"bg-white rounded-lg shadow dark:bg-gray-800",

22
src/layout/header.rs
View File

@@ -9,21 +9,25 @@ pub fn Header() -> Element {
rsx! {
nav {
div {
class: "flex items-center justify-between p-4 space-x-8",
Link {
to: Route::Home {},
class: "justify-start",
img { src:"/pictures/ClackCat_t.webp", class:"rounded-full h-8", alt:"TuDatTr Logo" },
},
// class: "justify-between p-4 space-x-8",
class: "container mx-auto p-4",
ul {
class:"flex space-x-8",
class:"flex flex-col justify-between sm:flex-row justify-center space-y-2 sm:space-y-0 sm:space-s-4",
li {
Link {
to: Route::Home {},
class: "rounded-md shadow-sm",
img { src:"/pictures/ClackCat_t.webp", class:"rounded-full h-8", alt:"TuDatTr Logo" },
},
},
li { HeaderLink { url: Route::Home {}, text: translate!(i18, "headers.home")} },
li { HeaderLink { url: Route::CV {}, text: translate!(i18, "headers.cv") } },
li { HeaderLink { url: Route::PublicationsProjects {}, text: translate!(i18, "headers.publications_projects") } },
li { HeaderLink { url: Route::Consulting {}, text: translate!(i18, "headers.consulting") } },
li { HeaderLink { url: Route::Impressum {}, text: translate!(i18, "headers.about") } },
li { LanguageButtonGroup {} },
},
LanguageButtonGroup { },
}
}
}
@@ -38,7 +42,7 @@ fn LanguageButtonGroup() -> Element {
rsx! {
div {
class: "inline-flex rounded-md shadow-sm",
class: "rounded-md shadow-sm justify-end",
button { class: "px-4 py-2 text-sm font-medium text-gray-900 bg-white border border-gray-200 rounded-s-lg hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:ring-2 focus:ring-blue-700 focus:text-blue-700 dark:bg-gray-800 dark:border-gray-700 dark:text-white dark:hover:text-white dark:hover:bg-gray-700 dark:focus:ring-blue-500 dark:focus:text-white", onclick: change_to_english, label { { translate!(i18, "headers.language_buttons.english") } } },
button { class: "px-4 py-2 text-sm font-medium text-gray-900 bg-white border border-gray-200 rounded-e-lg hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:ring-2 focus:ring-blue-700 focus:text-blue-700 dark:bg-gray-800 dark:border-gray-700 dark:text-white dark:hover:text-white dark:hover:bg-gray-700 dark:focus:ring-blue-500 dark:focus:text-white", onclick: change_to_german, label { { translate!(i18, "headers.language_buttons.german") } } }
}

13
src/layout/mod.rs
View File

@@ -10,15 +10,12 @@ use header::Header;
pub fn Layout() -> Element {
rsx! {
div {
class: "flex justify-center ",
div {
class: "max-w-screen-xl flex-col" ,
Header {},
Body {
Outlet::<Route> {},
}
Footer {},
class: "flex flex-col min-h-screen" ,
Header {},
Body {
Outlet::<Route> {},
}
Footer {},
}
}
}

4
src/main.rs
View File

@@ -75,7 +75,7 @@ fn App() -> Element {
fn PageNotFound(route: Vec<String>) -> Element {
rsx! {
div {
class: "h-screen flex items-center justify-center",
class: "h-screen items-center justify-center",
img {
class: "size-auto",
src: "https://raw.githubusercontent.com/SAWARATSUKI/ServiceLogos/main/404Notfound/NotFound.png"
@@ -92,7 +92,7 @@ pub struct BodyProp {
pub fn Body(prop: BodyProp) -> Element {
rsx! {
div {
class: "my-4 flex justify-center",
class: "flex-grow container mx-auto p-4",
{prop.children}
}
}

35
src/publications.rs
View File

@@ -60,6 +60,7 @@ fn Publications() -> Element {
}
}
fn Publication(prop: PublicationProp) -> Element {
let pattern = "T.-D. Tran";
rsx! {
Link {
class:"block max-w-sm p-6 bg-white border border-gray-200 rounded-lg shadow hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700",
@@ -71,8 +72,11 @@ fn Publication(prop: PublicationProp) -> Element {
},
span { class: "text-lg text-gray-900 dark:text-white", "{prop.conference}" },
p {
class:"font-normal text-gray-700 dark:text-gray-400",
"{prop.authors}",
class:"font-normal text-gray-700 dark:text-gray-400 italic",
Authors {
authors: "{prop.authors}",
pattern: "{pattern}",
},
}
p {
class:"font-normal text-gray-700 dark:text-gray-400",
@@ -125,6 +129,8 @@ struct ProjectProp {
}
fn Project(prop: ProjectProp) -> Element {
let pattern = "T.-D. Tran";
rsx! {
Link {
class:"block max-w-sm p-6 bg-white border border-gray-200 rounded-lg shadow hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700",
@@ -137,7 +143,10 @@ fn Project(prop: ProjectProp) -> Element {
p { class: "text-lg text-gray-900 dark:text-white", "{prop.kind}" },
p {
class:"font-normal text-gray-700 dark:text-gray-400",
"{prop.authors}",
Authors {
authors: "{prop.authors}",
pattern: "{pattern}",
},
}
p {
class:"font-normal text-gray-700 dark:text-gray-400",
@@ -146,3 +155,23 @@ fn Project(prop: ProjectProp) -> Element {
}
}
}
#[derive(Clone, PartialEq, Props)]
struct AuthorProp {
authors: String,
pattern: String,
}
fn Authors(prop: AuthorProp) -> Element {
if let Some(start) = prop.authors.find(&prop.pattern) {
let end = start + prop.pattern.len();
let left = &prop.authors[..start];
let middle = &prop.authors[start..end];
let right = &prop.authors[end..];
rsx! {
"{left}" , b { "{middle}" }, "{right}",
}
} else {
rsx! { "{prop.authors}" }
}
}