From 23b2ee04460872be0da878ccc9028ee0a63f18ee Mon Sep 17 00:00:00 2001 From: dadobos Date: Fri, 6 Jan 2023 19:02:19 +0100 Subject: [PATCH] changed layout, cleanup --- public/index.html | 2 +- src/components/main-card/MainCard.jsx | 19 +--- src/data/Data.jsx | 96 +++++++------------ .../header/navigation/Navigation.jsx | 8 +- src/pages/blog/Blog.jsx | 9 ++ src/pages/blog/index.js | 1 + src/pages/games/Games.jsx | 9 -- src/pages/games/index.js | 1 - src/pages/landing/Landing.jsx | 22 +++-- src/pages/projects/Projects.jsx | 9 +- src/routes/Routes.js | 6 +- 11 files changed, 76 insertions(+), 106 deletions(-) create mode 100644 src/pages/blog/Blog.jsx create mode 100644 src/pages/blog/index.js delete mode 100644 src/pages/games/Games.jsx delete mode 100644 src/pages/games/index.js diff --git a/public/index.html b/public/index.html index 4a58fcd..2319cfe 100644 --- a/public/index.html +++ b/public/index.html @@ -4,7 +4,7 @@ diff --git a/src/components/main-card/MainCard.jsx b/src/components/main-card/MainCard.jsx index 2099d83..c700435 100644 --- a/src/components/main-card/MainCard.jsx +++ b/src/components/main-card/MainCard.jsx @@ -11,17 +11,13 @@ import { useTheme } from '@mui/material/styles'; import { Tilt } from './Tilt'; -// import { VioletColorWheel, SeaGreenCrayola } from 'themes/Colors'; - const MainCard = ({ imageURL, title, description, url }) => { const theme = useTheme(); - // const shadowColor = - // theme.palette.mode === 'dark' ? SeaGreenCrayola : VioletColorWheel; + const options = { reverse: true, speed: 1200, - easing: 'cubic-bezier(.09,.67,.54,.76)' - // reset: false, + easing: 'cubic-bezier(.09,.67,.54,.76)', }; return ( @@ -35,10 +31,6 @@ const MainCard = ({ imageURL, title, description, url }) => { mx: 'auto', color: theme.palette.text.secondary, backgroundColor: theme.palette.background.paper, - // '&:hover': { - // transition: 'all .7s ease', - // boxShadow: `1px 1px 20px 10px ${shadowColor}`, - // }, }}> { image={imageURL} alt={title} /> + {{ description } !== '' && ( + {description} + )} { {title} - - {{ description } !== '' && ( - {description} - )} diff --git a/src/data/Data.jsx b/src/data/Data.jsx index d0edf27..124fe80 100644 --- a/src/data/Data.jsx +++ b/src/data/Data.jsx @@ -1,65 +1,10 @@ -export const FreeCodeCampData = [ - { - // videoURL: - // 'https://res.cloudinary.com/dadobos/video/upload/v1653827756/web/TechnicalDocumentationPage_h03qkv', - imageURL: - 'https://res.cloudinary.com/dadobos/image/upload/v1653827744/web/TechnicalDocumentationPage_pbudut', - title: 'Technical Documentation', - description: '', - url: 'https://codepen.io/diaid/full/PoopdWd', - }, - { - // videoURL: - // 'https://res.cloudinary.com/dadobos/video/upload/v1653827749/web/TributePage_iarfpr', - imageURL: - 'https://res.cloudinary.com/dadobos/image/upload/v1653827749/web/TributePage_hpxmr6', - title: 'Tribut Page', - description: '', - url: 'https://codepen.io/diaid/full/MWWeorj', - }, - { - // videoURL: - // 'https://res.cloudinary.com/dadobos/video/upload/v1653827744/web/SurveyForm_g0ornr', - imageURL: - 'https://res.cloudinary.com/dadobos/image/upload/v1653827742/web/SurveyForm_upho4b', - title: 'Survey Form', - description: '', - url: 'https://codepen.io/diaid/full/jOOMBeL', - }, - { - // videoURL: - // 'https://res.cloudinary.com/dadobos/video/upload/v1653827744/web/ProductLandingPage_fqwfjg', - imageURL: - 'https://res.cloudinary.com/dadobos/image/upload/v1653827745/web/ProductLandingPage_hebmnn', - title: 'Product Landing Page', - description: '', - url: 'https://codepen.io/diaid/full/GRRrKLW', - }, - { - // videoURL: - // 'https://res.cloudinary.com/dadobos/video/upload/v1653827745/web/PersonalPortofolio_nibw6t', - imageURL: - 'https://res.cloudinary.com/dadobos/image/upload/v1653827743/web/PersonalPortofolio_exblcg', - title: 'Personal Portofolio', - description: '', - url: 'https://codepen.io/diaid/full/YzzVgwK', - }, -]; - -export const CSSData = [ +export const ReactData = [ { imageURL: - 'https://res.cloudinary.com/dadobos/image/upload/v1653843087/web/AnchorTagHideComponents_vie5jq.png', - title: 'Anchor Tag Hide Components', + 'https://res.cloudinary.com/dadobos/image/upload/v1673023170/web/uxfuyzap5kbs1si34g29.png', + title: 'Online Shop', description: '', - url: 'https://codepen.io/diaid/full/MWOOogX', - }, - { - imageURL: - 'https://res.cloudinary.com/dadobos/image/upload/v1653845210/web/RadioHideComponents_dvxpgw.png', - title: 'Radio Hide Components', - description: '', - url: 'https://codepen.io/diaid/full/qBVdgWW', + url: 'https://dadobos.github.io/online-shop/', }, ]; @@ -96,5 +41,36 @@ export const VueData = [ title: 'World Countries', description: '', url: 'https://dadobos.github.io/worldcountries/', - } + }, +]; + +export const CSSData = [ + { + imageURL: + 'https://res.cloudinary.com/dadobos/image/upload/v1673027279/web/msvc649ua0gahqegu31o.png', + title: 'Anchor Tag Hide Components', + description: '', + url: 'https://codepen.io/diaid/full/MWOOogX', + }, + { + imageURL: + 'https://res.cloudinary.com/dadobos/image/upload/v1673027279/web/dprvsa15ocx3l34dxogo.png', + title: 'Radio Hide Components', + description: '', + url: 'https://codepen.io/diaid/full/qBVdgWW', + }, + { + imageURL: + 'https://res.cloudinary.com/dadobos/image/upload/v1673025125/web/anidcin5lbxo2hced5i4.png', + title: 'Rounded Paragraph', + description: '', + url: 'https://codepen.io/diaid/full/QWxOgVm', + }, + { + imageURL: + 'https://res.cloudinary.com/dadobos/image/upload/v1673027940/web/z9qn4wstdtzpr4cf5xtx.png', + title: 'Responsive Table', + description: '', + url: 'https://codepen.io/diaid/full/xxJRGMB', + }, ]; diff --git a/src/layouts/main/components/header/navigation/Navigation.jsx b/src/layouts/main/components/header/navigation/Navigation.jsx index 5238989..7e441d0 100644 --- a/src/layouts/main/components/header/navigation/Navigation.jsx +++ b/src/layouts/main/components/header/navigation/Navigation.jsx @@ -55,13 +55,13 @@ const Navigation = () => { activeIndex: 1, }, { - name: 'Games', - link: '/games', + name: 'Best Practices', + link: '/best-practices', activeIndex: 2, }, { - name: 'Best Practices', - link: '/best-practices', + name: 'Blog', + link: '/blog', activeIndex: 3, }, { diff --git a/src/pages/blog/Blog.jsx b/src/pages/blog/Blog.jsx new file mode 100644 index 0000000..fbb319f --- /dev/null +++ b/src/pages/blog/Blog.jsx @@ -0,0 +1,9 @@ +import React from 'react'; + +const Blog = () => { + return ( +
Blog ...in progress
+ ); +}; + +export default Blog; diff --git a/src/pages/blog/index.js b/src/pages/blog/index.js new file mode 100644 index 0000000..2cb34c7 --- /dev/null +++ b/src/pages/blog/index.js @@ -0,0 +1 @@ +export {default} from './Blog' \ No newline at end of file diff --git a/src/pages/games/Games.jsx b/src/pages/games/Games.jsx deleted file mode 100644 index 14b1037..0000000 --- a/src/pages/games/Games.jsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; - -const Games = () => { - return ( -
Games ...in progress
- ); -}; - -export default Games; diff --git a/src/pages/games/index.js b/src/pages/games/index.js deleted file mode 100644 index 99a9f51..0000000 --- a/src/pages/games/index.js +++ /dev/null @@ -1 +0,0 @@ -export {default} from './Games' \ No newline at end of file diff --git a/src/pages/landing/Landing.jsx b/src/pages/landing/Landing.jsx index a992097..cf113bf 100644 --- a/src/pages/landing/Landing.jsx +++ b/src/pages/landing/Landing.jsx @@ -1,7 +1,7 @@ import React from 'react'; import { Grid, Typography, Divider } from '@mui/material'; import About from '../about'; -import Games from '../games'; +import Blog from '../blog'; import BestPractices from '../best-practices'; import Projects from '../projects'; @@ -17,15 +17,7 @@ const Home = () => { - - - Games - - - - - - + Best Practices @@ -36,6 +28,16 @@ const Home = () => { + + + Blog + + + + + + + diff --git a/src/pages/projects/Projects.jsx b/src/pages/projects/Projects.jsx index 281feeb..5613870 100644 --- a/src/pages/projects/Projects.jsx +++ b/src/pages/projects/Projects.jsx @@ -1,14 +1,15 @@ import React from 'react'; -import { FreeCodeCampData, JavaData, WebsitesData, VueData } from 'data/Data'; +import { ReactData, JavaData, WebsitesData, VueData } from 'data/Data'; import MainAccordion from 'components/main-accordion/MainAccordion'; const Projects = () => { return ( <> - - - + {/* */} + + + ); }; diff --git a/src/routes/Routes.js b/src/routes/Routes.js index 3618b44..bebcf0e 100644 --- a/src/routes/Routes.js +++ b/src/routes/Routes.js @@ -9,7 +9,7 @@ import LandingLayout from '../layouts/landing'; const Home = lazy(() => import('../pages/landing')); const About = lazy(() => import('../pages/about')); const Projects = lazy(() => import('../pages/projects')); -const Games = lazy(() => import('../pages/games')); +const Blog = lazy(() => import('../pages/blog')); const BestPractices = lazy(() => import('../pages/best-practices')); export const CustomRoutes = () => { @@ -45,10 +45,10 @@ export const CustomRoutes = () => { /> - + } />