diff --git a/leptos_components/src/components/buttons.rs b/leptos_components/src/components/buttons.rs index ea59ac7..40d10fd 100644 --- a/leptos_components/src/components/buttons.rs +++ b/leptos_components/src/components/buttons.rs @@ -1,5 +1,4 @@ use leptos::prelude::*; -use leptos::logging; pub enum ButtonStyle { Primary, @@ -25,7 +24,7 @@ pub fn Button( let mut stylestring = ""; match style_type { ButtonStyle::Primary => { - stylestring = "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"; + stylestring = "transition ease-in-out delay-150 hover:scale-110 border-2 py-2 px-4 rounded"; }, ButtonStyle::Secondary => { stylestring = "bg-gray-300 hover:bg-gray-500 text-black font-semibold py-2 px-4 rounded"; @@ -43,7 +42,6 @@ pub fn Button( stylestring = "bg-[#0a0c1b] hover:bg-[#171d3a] text-white font-bold py-2 px-4 rounded shadow-lg transition duration-300 ease-in-out transform hover:scale-105"; } } - logging::log!("{}", stylestring); view! { } diff --git a/leptos_components/src/components/card.rs b/leptos_components/src/components/card.rs new file mode 100644 index 0000000..ca0397c --- /dev/null +++ b/leptos_components/src/components/card.rs @@ -0,0 +1,30 @@ +use leptos::prelude::*; + +pub enum CardStyle { + Primary, +} + + +// Horizontal Card +#[component] +pub fn HCard<'a>( + #[prop(optional)] + style: Option, + img_path: &'a str, + +) -> impl IntoView { + let style_type; + if style.is_none() { + style_type = CardStyle::Primary; + } else { + style_type = style.unwrap(); + } + let mut stylestring = ""; + match style_type { + CardStyle::Primary => { + stylestring = "font-sans text-2xl"; + } + } + view! { + } +} \ No newline at end of file diff --git a/leptos_components/src/components/mod.rs b/leptos_components/src/components/mod.rs index 5f96a44..86eb084 100644 --- a/leptos_components/src/components/mod.rs +++ b/leptos_components/src/components/mod.rs @@ -1 +1,3 @@ -pub mod buttons; \ No newline at end of file +pub mod buttons; +pub mod text; +pub mod card; \ No newline at end of file diff --git a/leptos_components/src/components/text.rs b/leptos_components/src/components/text.rs new file mode 100644 index 0000000..c4311b5 --- /dev/null +++ b/leptos_components/src/components/text.rs @@ -0,0 +1,97 @@ +use leptos::prelude::*; + +pub enum TextStyle { + Primary +} + +#[component] +pub fn H1( + #[prop(optional)] + style: Option, + children: Children, +) -> impl IntoView { + let style_type; + if style.is_none() { + style_type = TextStyle::Primary; + } else { + style_type = style.unwrap(); + } + let mut stylestring = ""; + match style_type { + TextStyle::Primary => { + stylestring = "font-sans text-2xl"; + } + } + view! { +

{children()}

+ } +} + +#[component] +pub fn H2( + #[prop(optional)] + style: Option, + children: Children, +) -> impl IntoView { + let style_type; + if style.is_none() { + style_type = TextStyle::Primary; + } else { + style_type = style.unwrap(); + } + let mut stylestring = ""; + match style_type { + TextStyle::Primary => { + stylestring = "font-sans text-xl"; + } + } + view! { +

{children()}

+ } +} + +#[component] +pub fn H3( + #[prop(optional)] + style: Option, + children: Children, +) -> impl IntoView { + let style_type; + if style.is_none() { + style_type = TextStyle::Primary; + } else { + style_type = style.unwrap(); + } + let mut stylestring = ""; + match style_type { + TextStyle::Primary => { + stylestring = "font-sans text-lg"; + } + } + view! { +

{children()}

+ } +} + +#[component] +pub fn P( + #[prop(optional)] + style: Option, + children: Children, +) -> impl IntoView { + let style_type; + if style.is_none() { + style_type = TextStyle::Primary; + } else { + style_type = style.unwrap(); + } + let mut stylestring = ""; + match style_type { + TextStyle::Primary => { + stylestring = "font-serif text-base"; + } + } + view!{ +

{children()}

+ } +} \ No newline at end of file diff --git a/website/Cargo.toml b/website/Cargo.toml index 6fedfed..af7f8e0 100644 --- a/website/Cargo.toml +++ b/website/Cargo.toml @@ -65,7 +65,7 @@ tailwind-input-file = "style/tailwind.css" # The assets-dir cannot have a sub directory with the same name/path as site-pkg-dir. # # Optional. Env: LEPTOS_ASSETS_DIR. -assets-dir = "public" +assets-dir = "assets" # The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup. site-addr = "127.0.0.1:5000" diff --git a/website/assets/founder_portrait.jpg b/website/assets/founder_portrait.jpg new file mode 100644 index 0000000..1b28df4 Binary files /dev/null and b/website/assets/founder_portrait.jpg differ diff --git a/website/assets/static_css.css b/website/assets/static_css.css new file mode 100644 index 0000000..261b086 --- /dev/null +++ b/website/assets/static_css.css @@ -0,0 +1,4 @@ +body{ + background-color: #0C120C; + color: #E4FDE1; +} \ No newline at end of file diff --git a/website/src/app.rs b/website/src/app.rs index 3c47e3c..ad0277a 100644 --- a/website/src/app.rs +++ b/website/src/app.rs @@ -1,11 +1,10 @@ use leptos::prelude::*; use leptos_meta::{provide_meta_context, MetaTags, Stylesheet, Title}; use leptos_router::{ - components::{Route, Router, Routes}, - StaticSegment, + components::{Route, Router, Routes}, path, StaticSegment }; -use leptos_components::components::buttons::Button; -use leptos_components::components::buttons::ButtonStyle; +use leptos_components::components::buttons::{Button, ButtonStyle}; +use leptos_components::components::text::{H1, H2, H3, P}; pub fn shell(options: LeptosOptions) -> impl IntoView { view! { @@ -35,14 +34,16 @@ pub fn App() -> impl IntoView { // id=leptos means cargo-leptos will hot-reload this stylesheet + + // sets the document title - + <Title text="My Portfolio"/> // content for this welcome page <Router> <main> <Routes fallback=|| "Page not found.".into_view()> - <Route path=StaticSegment("") view=HomePage/> + <Route path=path!("/") view=HomePage/> </Routes> </main> </Router> @@ -52,13 +53,16 @@ pub fn App() -> impl IntoView { /// Renders the home page of your application. #[component] fn HomePage() -> impl IntoView { - // Creates a reactive value to update the button - let count = RwSignal::new(0); - let on_click = move |_| *count.write() += 1; - view! { - <h1>"Welcome to Leptos!"</h1> - <button on:click=on_click>"Click Me: " {move || count.get()}</button> - <Button style=ButtonStyle::Cyberpunk on:click=on_click>"Click Me: " {move || count.get()}</Button> + <div class="flex flex-row min-h-screen justify-center items-center"> + <img class="max-w-lg rounded" src="/founder_portrait.jpg" /> + <div class="flex flex-col m-4 p-2 items-start max-w-lg"> + <H1>Hi!</H1> + <H2>"I'm Liam Fitzpatrick."</H2> + <P>"I'm an engineer with expertise in modeling, simulation, and process improvement. I have a proven ability + to develop innovative solutions, optimize complex systems, and lead successful projects. I have some of my experiences + projects outlined on this website. If you want to hire me or ask questions about my projects reach out to me "<a href="mailto:liam.fitzpatrick@live.com">here</a></P> + </div> + </div> } } diff --git a/website/style/main.scss b/website/style/main.scss index e4538e1..6a42b21 100644 --- a/website/style/main.scss +++ b/website/style/main.scss @@ -1,4 +1,7 @@ body { font-family: sans-serif; text-align: center; -} \ No newline at end of file + color: #E4FDE1; + background-color: #4D3F64; +} +