From bb3aacf81cce7a77573dea5323c7692c46845caf Mon Sep 17 00:00:00 2001
From: Franklin <franklinblanco@tutanota.com>
Date: Fri, 28 Apr 2023 10:54:59 -0400
Subject: [PATCH] Added eng translations for footer

---
 assets/.DS_Store         | Bin 6148 -> 6148 bytes
 css/footer.css           |  33 +++++++++++++++++++++++++++++----
 css/language-picker.css  |   3 ++-
 css/start.css            |   4 ++++
 locales/en.yml           |  12 +++++++++++-
 locales/es.yml           |  10 ++++++++++
 src/components/footer.rs |  37 +++++++++++++------------------------
 7 files changed, 69 insertions(+), 30 deletions(-)

diff --git a/assets/.DS_Store b/assets/.DS_Store
index cd3a2cf86a516c8064df523e3cb54a7528c4c45a..32a8b8d1ab16b3197d2e975184c5e39a064c1279 100644
GIT binary patch
delta 296
zcmZoMXfc=|#>B`mu~2NHo}wrd0|Nsi1A_nqLn=dYQh9MfQcix-#Er`*8;G#fvoT~c
z<T4~Oq$5iLHS9<#$jK}&F)+Bs$i&RT%Er#Y&cV$Q8=R3}9$b=GQd;bkSQHK7h2-bw
zB*EB;Nnx3(<?#X{&iQ#IiJ5t+MPLn?DXBmuG2xkcDf#72`K5U&#bCX`nL%I~4o(iv
zcmav(YEuIP9R(9JlUf~xYD*&!+t{qOmXkwNS>HM+K07BjFTV@uI3QpI`Unhop)`!@
p-q@qgwwaxSp92^I8#jJup3E<z%L9@H>1Y7r%|0SKm?t){001;2OsfC@

delta 88
zcmZoMXfc=|#>CJzu~2NHo}wrt0|NsP3otOGG8C5u7v<&T=cP|9RA*$|{D4uNZL<JV
n2;*jU4t@@xmd%Vz-<c=#i|BHKbR7U<hRHTO(wk#MmM{YVs8ked

diff --git a/css/footer.css b/css/footer.css
index 4f4e7a2..bcde2f0 100644
--- a/css/footer.css
+++ b/css/footer.css
@@ -1,6 +1,6 @@
 .footer {
     width: 80%;
-    height: 400px;
+    height: 425px;
     margin-top: 150px;
 
     background-color: #00113B;
@@ -48,7 +48,9 @@
     justify-content: end;
     align-items: end;
 
-    width: 100px;
+    gap: 10px;
+
+    width: clamp(100px, 28vw, 185px);
     flex-grow: 0;
     height: 100%;
 }
@@ -57,6 +59,10 @@
     font-family: Poppins;
     font-size: 18px;
     font-weight: 600;
+    
+    width: 100%;
+
+    text-align: start;
 }
 .footer-before-line-second-column-description {
     color: white;
@@ -67,7 +73,7 @@
     opacity: 75%;
     white-space: pre-line;
 
-    text-align: end;
+    text-align: start;
 }
 .footer-line {
     background-color: white;
@@ -90,6 +96,7 @@
     font-size: 11px;
     color: white;
     opacity: 75%;
+    width: 45vw;
 
     text-align: start;
 }
@@ -97,8 +104,26 @@
 .footer-after-line-socials {
     display: flex;
     flex-direction: row;
-    justify-content: space-evenly;
+    justify-content: end;
+    gap: 10px; 
     align-items: center;
 
     width: 100px;
+}
+
+.footer-after-line-social-frame {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    width: 35px;
+    height: 35px;
+    border-radius: 100%;
+    text-decoration: none;
+
+    background-color: #4C40F7;
+    color: white
+}
+.footer-after-line-social-frame :hover {
+    cursor: pointer;
 }
\ No newline at end of file
diff --git a/css/language-picker.css b/css/language-picker.css
index b80f0c3..40aa73d 100644
--- a/css/language-picker.css
+++ b/css/language-picker.css
@@ -18,8 +18,9 @@
     align-items: center;
 }
 .language-picker-container:hover {
-    scale: 1.1;
+    scale: 1.2;
     cursor: pointer;
+    transition-duration: 0.5s;
 }
 
 .language-picker-selected-language-display {
diff --git a/css/start.css b/css/start.css
index 9c2ee35..70b930f 100644
--- a/css/start.css
+++ b/css/start.css
@@ -88,6 +88,8 @@
     display: flex;
     justify-content: center;
     align-items: center;
+    
+    white-space: pre-line;
 }
 
 .start-section-right-column-art-top-right-pill {
@@ -134,6 +136,8 @@
     display: flex;
     justify-content: center;
     align-items: center;
+
+    white-space: pre-line;
 }
 
 .start-section-right-column-subject-1-title {
diff --git a/locales/en.yml b/locales/en.yml
index 60b2090..63b953e 100644
--- a/locales/en.yml
+++ b/locales/en.yml
@@ -29,7 +29,17 @@ start:
     title-third-line: with us
   left-column-description: Our experienced team will create a tailored solution to maximize your business potential.
   left-column-button-text: Get Started >
-  right-column-subject-1-title: >
+  right-column-subject-1-title: |
     Web Design &
     Development
   right-column-subject-2-title: Marketing & Ads
+footer:
+  brand-description: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+  contact-title: Contact
+  contact-info: |
+    Jl KH Samanhudi Metro Atom Plaza Bl AKS 1/11, Dki Jakartaa
+
+    info@yourdomain.com
+    +62 (0) 000 0000 00
+  copyright-text: © 2023 Blanco Lorenzo - All rights reserved
+
diff --git a/locales/es.yml b/locales/es.yml
index 4591d70..12f4bd6 100644
--- a/locales/es.yml
+++ b/locales/es.yml
@@ -35,3 +35,13 @@ start:
   right-column-subject-2-title: >
     Mercadeo &
     Publicidad
+footer:
+  brand-description: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+  contact-title: Contacto
+  contact-info: >
+    Jl KH Samanhudi Metro Atom Plaza Bl AKS 1/11, Dki Jakarta
+
+    info@blancolorenzo.pro
+    
+    +1 809 223 5564
+  copyright-text: © 2023 Blanco Lorenzo - All rights reserved
\ No newline at end of file
diff --git a/src/components/footer.rs b/src/components/footer.rs
index 90ced01..b99ce3d 100644
--- a/src/components/footer.rs
+++ b/src/components/footer.rs
@@ -1,3 +1,4 @@
+use rust_i18n::t;
 use yew::prelude::*;
 
 use super::language_picker::Language;
@@ -9,21 +10,22 @@ pub struct PageFooterProps {
 
 #[function_component(PageFooter)]
 pub fn page_footer(props: &PageFooterProps) -> Html { //TODO: Add t!() everywhere
+    let language = props.language.clone();
     html! {
         <div class={"footer"}>
             <div class={"footer-before-line"}>
                 <div class={"footer-before-line-first-column"}>
                     <img class={"footer-before-line-first-column-logo"} src={"images/blanco-lorenzo-logo-white-transparent.png"}/>
                     <div class={"footer-before-line-first-column-paragraph"}>
-                        {"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."}
+                        {t!("footer.brand-description",  locale = language.locale())}
                     </div>
                 </div>
                 <div class={"footer-before-line-second-column"}>
                     <div class={"footer-before-line-second-column-title"}>
-                        {"Contact"}
+                        {t!("footer.contact-title",  locale = language.locale())}
                     </div>
                     <div class={"footer-before-line-second-column-description"}>
-                        {"Jl KH Samanhudi Metro Atom Plaza Bl AKS 1/11, Dki Jakarta\n\ninfo@yourdomain.com\n\n+62 (0) 000 0000 00"}
+                        {t!("footer.contact-info",  locale = language.locale())}
                     </div>
                 </div>
             </div>
@@ -32,31 +34,18 @@ pub fn page_footer(props: &PageFooterProps) -> Html { //TODO: Add t!() everywher
 
             <div class={"footer-after-line"}>
                 <div class={"footer-after-line-copyright"}>
-                    {"© 2023 Blanco Lorenzo - Todos los derechos Reservados"}
+                    {t!("footer.copyright-text",  locale = language.locale())}
                 </div>
                 <div class={"footer-after-line-socials"}>
                     //TODO: Add all logos with href links
-                    {"a"}
+                    <a class="footer-after-line-social-frame" href={"https://instagram.com"}>
+                        <i class="fa-brands fa-instagram"></i>
+                    </a>
+                    <a class="footer-after-line-social-frame" href={"https://twitter.com"}>
+                        <i class="fa-brands fa-twitter"></i>
+                    </a>
                 </div>
             </div>
-
-            /*
-            <div class={"footer-call-to-action-container"}>
-                <input placeholder={"AAA"} class={"footer-call-to-action-input"}/>
-                <div class={"footer-call-to-action-button"}>
-                {"Subscríbete"}
-                </div>
-            </div>
-            */
-
         </div>
     }
-}
-
-/*
-                <div class={"footer-copyright-text"}>{"© 2023 Blanco Lorenzo - Todos los derechos Reservados"}</div>
-                <div class={"footer-credit-container"}>
-                    <div class={"footer-credit"}>{"Powered by"}</div>
-                    <div class={"footer-credit-url"}>{"Blanco Studios"}</div>
-                </div>
- */
\ No newline at end of file
+}
\ No newline at end of file