Skip to content

Commit

Permalink
Merge branch 'cssUpdate' of https://github.com/asthanegi14/StyleShare
Browse files Browse the repository at this point in the history
…into cssUpdate
  • Loading branch information
asthanegi14 committed Jun 13, 2024
2 parents a4e63e7 + 1195ec7 commit 2c47352
Show file tree
Hide file tree
Showing 41 changed files with 1,406 additions and 208 deletions.
15 changes: 12 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,9 +17,18 @@ Style Share is a collaborative platform designed to streamline the process of cr

## Screenshots

![alt text](./screenshots/image.png)
![alt text](./screenshots/image-1.png)
![alt text](./screenshots/image-2.png)
![alt text](./screenshots/Screenshot_home.png)
![alt text](./screenshots/Screenshot_about.png)
![alt text](./screenshots/Screenshot_login.png)
![alt text](./screenshots/Screenshot_sign.png)
![alt text](./screenshots/Screenshot_post.png)
![alt text](./screenshots/Screenshot_code.png)
![alt text](./screenshots/Screenshot_create_post.png)
![alt text](./screenshots/Screenshot_leaderboard.png)

## Video

https://github.com/root-0101/StyleShare/assets/142779809/99e13fc0-e37f-4cf6-8f77-a90ae1b16044

## Setting Up on your machine

Expand Down
62 changes: 61 additions & 1 deletion frontend/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 2 additions & 1 deletion frontend/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -17,10 +17,11 @@
"clsx": "^2.1.1",
"dompurify": "^3.1.4",
"framer-motion": "^11.2.10",
"lottie-react": "^2.4.0",
"i18next": "^23.11.5",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-hot-toast": "^2.4.1",
"react-i18next": "^14.1.2",
"react-icons": "^5.2.1",
"react-router-dom": "^6.23.1",
"react-share": "^5.1.0",
Expand Down
3 changes: 3 additions & 0 deletions frontend/src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,8 @@ import Favorite from "./pages/Favorite";
import LeaderBoard from "./pages/LeaderBoard";
import CustomizeWithAi from "./pages/CustomizeWithAi";
import ScrollToTopWhenRouteChanges from "./components/ScrollToTopWhenRouteChanges";
import './i18n';
import LanguageDropdown from "./components/LanguageDropdown";
// import axios from "axios";
// axios.defaults.baseURL = "http://localhost:3001/";

Expand All @@ -37,6 +39,7 @@ function App() {
<GoTop/>
<ScrollToTopWhenRouteChanges/>
<div className="min-h-[80vh] mt-12 pt-12">
<LanguageDropdown/>
<Routes>
<Route path="/app" element={<Home />} />
<Route path="/app/posts/:id" element={<Post />} />
Expand Down
127 changes: 64 additions & 63 deletions frontend/src/components/Footer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,78 +5,79 @@ import { loggedInState } from '../store/atoms/auth';
import { CgProfile } from 'react-icons/cg';
import { BsFilePost } from 'react-icons/bs';
import { FaHome } from 'react-icons/fa';
import { useTranslation } from 'react-i18next';

const Footer = () => {

const { t } = useTranslation();
const isLoggedIn = useRecoilValue(loggedInState);
const currentYear = new Date().getFullYear();

return (
<div className='bg-black text-white p-10'>
<div className='md:flex'>
<div className='md:w-1/2'>
<span className="self-center text-2xl font-semibold whitespace-nowrap text-white">
Style Share
</span>
</div>
<div className='md:w-3/4 md:flex'>
<div className='md:w-1/3'>
<p className='text-gray-200 font-bold mt-8 md:mt-0'>Company</p>
<ul className='text-gray-300 py-4'>
<li className='py-1 cursor-pointer'>
<Link to='/app/about'>About Us</Link>
</li>
<li className='py-1 cursor-pointer'>
<Link to='/app/contact-us'>Contact Us</Link>
</li>
</ul>
</div>
<div className='md:w-1/3'>
<p className='text-gray-200 font-bold'>Quick Links</p>
<ul className='text-gray-300 py-4 cursor-pointer'>
<li className='py-1 cursor-pointer'>
<Link className='flex items-center gap-1' to='/app/posts'>
All Posts
<BsFilePost size={20} />
</Link>
</li>
<li className='py-1 cursor-pointer'>
<Link className='flex items-center gap-1' to={isLoggedIn ? '/app/profile' : '/app/signin'}>
User profile
<CgProfile size={20} />
</Link>
</li>
</ul>
return (
<div className='bg-black text-white p-10'>
<div className='md:flex'>
<div className='md:w-1/2'>
<span className="self-center text-2xl font-semibold whitespace-nowrap text-white">
{t('footer.heading')}
</span>
</div>
<div className='md:w-1/3'>
<p className='text-gray-200 font-bold'>Legal Pages</p>
<ul className='text-gray-300 py-4 cursor-pointer'>
<li className='py-1 cursor-pointer'>
<Link to='/app/policy'>Privacy Policy</Link>
</li>
<li className='py-1 cursor-pointer'>
<Link to='/app/policy'>Terms and Conditions</Link>
</li>
<li className='py-1 cursor-pointer'>
<Link to='/app/policy'>Cookie Policy</Link>
</li>
</ul>
<div className='md:w-3/4 md:flex'>
<div className='md:w-1/3'>
<p className='text-gray-200 font-bold mt-8 md:mt-0'>{t('footer.company')}</p>
<ul className='text-gray-300 py-4'>
<li className='py-1 cursor-pointer'>
<Link to='/app/about'>{t('footer.c.l1')}</Link>
</li>
<li className='py-1 cursor-pointer'>
<Link to='/app/contact-us'>{t('footer.c.l2')}</Link>
</li>
</ul>
</div>
<div className='md:w-1/3'>
<p className='text-gray-200 font-bold'>{t('footer.quick')}</p>
<ul className='text-gray-300 py-4 cursor-pointer'>
<li className='py-1 cursor-pointer'>
<Link className='flex items-center gap-1' to='/app/posts'>
{t('footer.q.q1')}
<BsFilePost size={20} />
</Link>
</li>
<li className='py-1 cursor-pointer'>
<Link className='flex items-center gap-1' to={isLoggedIn ? '/app/profile' : '/app/signin'}>
{t('footer.q.q2')}
<CgProfile size={20} />
</Link>
</li>
</ul>
</div>
<div className='md:w-1/3'>
<p className='text-gray-200 font-bold'>{t('footer.legal')}</p>
<ul className='text-gray-300 py-4 cursor-pointer'>
<li className='py-1 cursor-pointer'>
<Link to='/app/policy'>{t('footer.l.le1')}</Link>
</li>
<li className='py-1 cursor-pointer'>
<Link to='/app/policy'>{t('footer.l.le2')}</Link>
</li>
<li className='py-1 cursor-pointer'>
<Link to='/app/policy'>{t('footer.l.le3')}</Link>
</li>
</ul>
</div>
</div>
</div>
</div>
<div className='block w-3/4 m-auto mt-10'>
<div className='flex gap-4 justify-center md:justify-end'>
<a href="https://github.com/VaibhavArora314/StyleShare"><img src={github} alt="github" className='pointer w-14 h-14'/></a>
<Link to='/app'
className="flex items-center justify-center p-2 text-white rounded-full focus:outline-none"
>
<FaHome size={35} />
</Link>
<div className='block w-3/4 m-auto mt-10'>
<div className='flex gap-4 justify-center md:justify-end'>
<a href="https://github.com/VaibhavArora314/StyleShare"><img src={github} alt="github" className='pointer w-14 h-14' /></a>
<Link to='/app'
className="flex items-center justify-center p-2 text-white rounded-full focus:outline-none"
>
<FaHome size={35} />
</Link>
</div>
</div>
<div className='mt-10 text-gray-300 xl:flex justify-center text-md lg:text-xl xl:text-md'>{t('footer.copy1')} {currentYear}{t('footer.copy2')}</div>
</div>
<div className='mt-10 text-gray-300 xl:flex justify-center text-md lg:text-xl xl:text-md'>Copyright {currentYear} @ Style Share</div>
</div>
)
)
}

export default Footer
export default Footer;
34 changes: 16 additions & 18 deletions frontend/src/components/HeroText.tsx
Original file line number Diff line number Diff line change
@@ -1,35 +1,33 @@
"use client";

import { useTranslation } from "react-i18next";
import { TypewriterEffectSmooth } from "./ui/TypeWriter";

export function TypewriterEffectSmoothDemo() {
const { t } = useTranslation();

const words = [
{
text: "👋Welcome",
className:"md:text-3xl lg:text-5xl text-3xl text-white"
text: t("hero.h1"),
className: "md:text-3xl lg:text-5xl text-3xl text-white"
},
{
text: "To",
className:"text-white lg:text-5xl md:text-3xl text-3xl"
text: t("hero.h2"),
className: "text-white lg:text-5xl md:text-3xl text-3xl"
},
{
text: "Style",
className: "text-blue-500 lg:text-5xl md:text-3xl text-3xl",
text: t("hero.h3"),
className: "text-blue-500 lg:text-5xl md:text-3xl text-3xl"
},
{
text: "Share",
className: "text-blue-500 lg:text-5xl md:text-3xl text-3xl",
},

text: t("hero.h4"),
className: "text-blue-500 lg:text-5xl md:text-3xl text-3xl"
}
];

return (
<div className="max-w-screen-xl mx-auto">

<div className=" mx-autofont-bold mb-4">
<TypewriterEffectSmooth words={words} />
</div>
<div className="mx-autofont-bold mb-4">
<TypewriterEffectSmooth words={words} />
</div>


</div>
);
}
39 changes: 39 additions & 0 deletions frontend/src/components/LanguageDropdown.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import { useEffect } from 'react';
import { useTranslation } from 'react-i18next';

const LanguageDropdown = () => {
const { i18n } = useTranslation();

useEffect(() => {
const storedLanguage = localStorage.getItem('i18nextLng') || 'en';
i18n.changeLanguage(storedLanguage);
}, [i18n]);

const handleLanguageChange = (event:any) => {
const selectedLanguage = event.target.value;
i18n.changeLanguage(selectedLanguage);
localStorage.setItem('i18nextLng', selectedLanguage);
};

return (
<div className="mx-1 -my-2 fixed z-50">
<select
onChange={handleLanguageChange}
className="p-1 rounded-md bg-blue-950 backdrop-blur-sm text-gray-100 border-2 border-sky-500"
value={i18n.language}
>
<option value="">Select Language</option>
<option value="en">English</option>
<option value="hi">Hindi</option>
<option value="mh">Marathi</option>
<option value="guj">Gujarati</option>
<option value="wb">Bengali</option>
<option value="tel">Telugu</option>
<option value="tam">Tamil</option>
<option value="ur">Urdu</option>
</select>
</div>
);
};

export default LanguageDropdown;
Loading

0 comments on commit 2c47352

Please sign in to comment.