Added Legal Pages

package.json

@@ -21,6 +21,7 @@
     "react-icons": "^5.2.1",
     "react-router-dom": "^6.23.1",
     "react-scripts": "5.0.1",
+    "styled-components": "^6.1.11",
     "web-vitals": "^4.1.1"
   },
   "scripts": {

src/App.js

@@ -15,6 +15,9 @@ import Pricing from "./Components/footer_section/Pricing/pricing";
 import MyProjects from "./Components/menu_section/my_projects/MyProjects";
 import NewProject from "./Components/menu_section/new_project/NewProject";
 import Error from "./Components/404_page/Error";
+import Licensing from "./Components/footer_section/Legal/Licensing";
+import TermsConditions from "./Components/footer_section/Legal/TermsandConditions";
+import PrivacyPolicy from "./Components/footer_section/Legal/PrivacyPolicy";
 
 function App() {
   return (
@@ -32,6 +35,11 @@ function App() {
           <Route path="/faq" element={<FAQPage />} /> 
           <Route path="/services" element={<Services />} />
           <Route path="/contacts" element={<ContactUs />} />
+          <Route path="/termsandconditions" element={<TermsConditions />} />
+
+          <Route path="/privacypolicy" element={<PrivacyPolicy />} />
+
+          <Route path="/licensing" element={<Licensing />} />
 
           <Route path="/readmore/:id" element={<Readmore/>}/>
 

src/Components/CreateAccount.css

@@ -46,9 +46,7 @@ body {
   }
   p{
     font-family: "Roboto", sans-serif;
-    text-align: center;
     margin-top:.5vw;
-    font-size: x-large;
   }
   p span{
     color: #78a9fa;

src/Components/Footer.js

@@ -32,9 +32,9 @@ const Footer = () => {
           <div className='footer-2'>
             <p className='footer-section-title'>Legal</p>
             <ul className='footer-links'>
-              <li className='footer-link'>Privacy Policy</li>
-              <li className='footer-link'>Terms and Conditions</li>
-              <li className='footer-link'>Licensing</li>
+              <a href="/privacypolicy"><li className='footer-link'>Privacy Policy</li></a>
+              <a href="/termsandconditions"><li className='footer-link'>Terms and Conditions</li></a>
+              <a href="/licensing"><li className='footer-link'>Licensing</li></a>
             </ul>
           </div>
         </div>

src/Components/Login.css

@@ -62,7 +62,6 @@ body {
   }
   p{
     font-family: "Roboto", sans-serif;
-    text-align: center;
     margin-top:.5vw;
   }
   p span{

src/Components/footer_section/Legal/Licensing.js

@@ -0,0 +1,99 @@
+import styled from "styled-components";
+
+const LicenseContainer = styled.div`
+  margin: auto;
+  max-width: 75%;
+  overflow: auto;
+  padding: 20px;
+  border-radius: 5px;
+  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
+  margin-top: 20px;
+  font-size: 16px;
+  line-height: 1.6;
+  font-family: "Open Sans", sans-serif;
+  text-align: justify;
+  @media (max-width: 768px) {
+    max-width: 90%;
+    padding: 15px;
+    font-size: 14px;
+  }
+  @media (max-width: 480px) {
+    max-width: 95%;
+    padding: 10px;
+    font-size: 12px;
+    padding-bottom: 5rem; /* Ensure enough space for the bottom bar */
+  }
+`;
+
+const Title = styled.h2`
+  margin-bottom: 20px;
+  font-weight: 700;
+  text-align: center;
+  font-size: 28px;
+  color: #ff21bc;
+`;
+
+const SubTitle = styled.h3`
+  margin-bottom: 20px;
+  font-weight: 700;
+  font-size: 22px;
+  color: #ff21bc;
+`;
+
+const Content = styled.p`
+  margin-bottom: 20px;
+`;
+
+const StyledUl = styled.ul`
+  margin-bottom: 20px;
+  list-style-type: disc;
+  padding-left: 20px;
+`;
+
+const StyledLi = styled.li`
+  margin-bottom: 20px;
+  list-style-type: disc;
+  margin-left: 20px;
+`;
+
+const Strong = styled.strong`
+  font-weight: bold;
+`;
+
+const Licensing = () => {
+  return (
+    <LicenseContainer>
+        <Title>Licensing Information</Title><br/>
+        <Content><Strong>Last Updated:</Strong> 08-06-2024</Content>
+        <SubTitle>Introduction</SubTitle>
+        <Content>Welcome to UniCollab! This page provides information about the licensing of our collaborative platform, which allows students from different universities and colleges to collaborate, innovate, and elevate their projects.</Content>
+        <SubTitle>License Grant</SubTitle>
+        <Content>UniCollab grants you a limited, non-exclusive, non-transferable, revocable license to use our platform for personal and educational purposes, subject to your compliance with these terms.</Content>
+        <SubTitle>Restrictions</SubTitle>
+        <Content>You agree not to:
+            <StyledUl> <br/>
+                <StyledLi>Copy, modify, or create derivative works of our platform;</StyledLi>
+                <StyledLi>Distribute, transmit, or publicly display any part of the platform;</StyledLi>
+                <StyledLi>Reverse engineer, decompile, or disassemble the platform;</StyledLi>
+                <StyledLi>Use the platform for any commercial purposes without prior written consent from UniCollab;</StyledLi>
+                <StyledLi>Remove or alter any proprietary notices on the platform.</StyledLi>
+            </StyledUl>
+        </Content>
+        <SubTitle>Intellectual Property</SubTitle>
+        <Content>All intellectual property rights in the platform and its content are owned by UniCollab or its licensors. Your use of the platform does not grant you any ownership rights to the content.</Content>
+        <SubTitle>Third-Party Content</SubTitle>
+        <Content>Our platform may include third-party content or links to third-party websites. UniCollab does not endorse or assume any responsibility for third-party content.</Content>
+        <SubTitle>License Termination</SubTitle>
+        <Content>UniCollab reserves the right to terminate your license to use the platform at any time, without notice, if you breach these terms or engage in prohibited activities.</Content>
+        <SubTitle>Changes to Licensing Terms</SubTitle>
+        <Content>We reserve the right to modify or replace these licensing terms at any time. It is your responsibility to review these terms periodically for changes.</Content>
+        <SubTitle>Contact Us</SubTitle>
+        <Content style={{ marginBottom: '5rem' }}>If you have any questions or concerns about these licensing terms, please contact us at: <br/><br/>
+        <Strong>Email: </Strong><a href="mailto:[email protected]" style={{color: 'cyan'}}>[email protected]</a><br/>
+        <Strong>Contact: </Strong>+91 99323 32321
+        </Content>
+    </LicenseContainer>
+  )
+}
+
+export default Licensing;