diff --git a/assets/.DS_Store b/assets/.DS_Store new file mode 100644 index 0000000..cd3a2cf Binary files /dev/null and b/assets/.DS_Store differ diff --git a/assets/images/.DS_Store b/assets/images/.DS_Store new file mode 100644 index 0000000..8f04d2e Binary files /dev/null and b/assets/images/.DS_Store differ diff --git a/assets/images/polygon-background.jpg b/assets/images/polygon-background.jpg new file mode 100644 index 0000000..7345b29 Binary files /dev/null and b/assets/images/polygon-background.jpg differ diff --git a/css/components/footer.css b/css/components/footer.css new file mode 100644 index 0000000..45a97a8 --- /dev/null +++ b/css/components/footer.css @@ -0,0 +1,77 @@ + +.footer { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + + width: 100%; + height: 170px; + + background-color: #252631; +} +.footer-brand-container { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + gap: 10px; + height: 100%; + margin-left: 20px; +} +.footer-logo { + object-fit: cover; + width: 100px; + height: 100px; +} +.footer-copyright-text { + font-size: 9px; + font-family: Inter; + color: white; + white-space: pre-line; +} +.footer-credit-container { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + gap: 3px; +} +.footer-credit { + font-size: 13px; + font-family: Inter; + color: white; +} + +.footer-credit-url { + font-size: 13px; + font-family: Inter; + color: #04B2D9; + border-bottom: 1px solid #04B2D9; +} +.footer-credit-url:hover { + font-size: 14px; + cursor: pointer; + transition-duration: 0.4s; +} +/* +.footer-call-to-action-container { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + margin-right: 20px; + border-bottom: 2px solid white; +} +.footer-call-to-action-input { + background-color: rgba(255, 255, 255, 0); + border: 0; + font-family: Inter; + color: white; +} +.footer-call-to-action-button{ + font-size: 14px; + font-family: Inter; + color: white; + border: 2px solid white; +}*/ \ No newline at end of file diff --git a/css/details.css b/css/details.css index a83bfd0..4589726 100644 --- a/css/details.css +++ b/css/details.css @@ -75,7 +75,7 @@ Divide the Details page into 3 main sections: width: 100%; gap: 15px; margin-top: -10px; - margin-bottom: 100px; + margin-bottom: 30px; } .details-body-description { @@ -225,3 +225,9 @@ Divide the Details page into 3 main sections: height: 200px; margin-bottom: 60px; } + +.details-body-disclaimer { + width: 100%; + font-size: 13px; + font-family: Inter; +} \ No newline at end of file diff --git a/index.html b/index.html index f2bf7d3..e693fed 100644 --- a/index.html +++ b/index.html @@ -13,6 +13,7 @@ + diff --git a/src/components/footer.rs b/src/components/footer.rs new file mode 100644 index 0000000..d1cfb75 --- /dev/null +++ b/src/components/footer.rs @@ -0,0 +1,26 @@ +use yew::prelude::*; + +#[function_component(PageFooter)] +pub fn page_footer() -> Html { + html! { +
+ } +} \ No newline at end of file diff --git a/src/components/mod.rs b/src/components/mod.rs index 9ca9619..7ac7367 100644 --- a/src/components/mod.rs +++ b/src/components/mod.rs @@ -3,4 +3,5 @@ pub mod search_filter; pub mod project_card; pub mod media_slideshow; pub mod floating_widget; -pub mod feature; \ No newline at end of file +pub mod feature; +pub mod footer; \ No newline at end of file diff --git a/src/pages/details.rs b/src/pages/details.rs index 0ca34e9..e58e63a 100644 --- a/src/pages/details.rs +++ b/src/pages/details.rs @@ -4,11 +4,10 @@ use thousands::Separable; use uuid::Uuid; use yew::prelude::*; -use crate::{components::{nav_bar::NavigationBar, media_slideshow::MediaSlideshow, floating_widget::FloatingWidget, feature::FeatureItem}, api::backend::get_project_listing}; +use crate::{components::{nav_bar::NavigationBar, media_slideshow::MediaSlideshow, floating_widget::FloatingWidget, feature::FeatureItem, footer::PageFooter}, api::backend::get_project_listing}; #[function_component(DetailsPage)] pub fn details_page(props: &DetailsPageProps) -> Html { - //TODO: query backend let finished_loading = use_state(|| false); let listing_handle: UseStateHandle