├── src ├── styles │ ├── Home.css │ ├── SocialLinks.css │ ├── app.css │ ├── Form.css │ ├── InfoMe.css │ ├── clouds.css │ ├── Navbar.css │ ├── Menu.css │ ├── Passion.css │ ├── WhoMe.css │ ├── Projects.css │ ├── Skills.css │ ├── Cards.css │ ├── Header.css │ └── Works.css ├── images │ ├── about.jpg │ ├── contact.jpg │ ├── covid.PNG │ ├── mapty.PNG │ ├── myphoto.jpg │ ├── recipe.PNG │ ├── reile.jpg │ ├── space.PNG │ ├── unicef.PNG │ ├── bookstore.PNG │ ├── budgeapp.PNG │ ├── budgetapp.PNG │ ├── pokemons.PNG │ ├── project4.jpg │ ├── project5.jpg │ ├── project6.jpg │ ├── project7.jpg │ ├── project8.jpg │ ├── projecta2.jpg │ ├── projects.jpg │ ├── projects3.jpg │ ├── covidproject.PNG │ ├── skills │ │ ├── css1.png │ │ ├── html1.png │ │ ├── jest.png │ │ ├── rails.png │ │ ├── ruby1.png │ │ ├── postgres.png │ │ ├── Untitled design.png │ │ ├── tailwindcss.svg │ │ ├── js.svg │ │ ├── react.svg │ │ ├── sass.svg │ │ ├── design-skills.svg │ │ ├── book-open.svg │ │ └── tech.svg │ ├── rentmedesktop.PNG │ ├── spacetraveler.PNG │ ├── exit.svg │ ├── moon.svg │ ├── moon (1).svg │ ├── cloud2.svg │ ├── cloud3.svg │ ├── b_cloud01.svg │ ├── b_cloud02.svg │ ├── cloud1.svg │ ├── moonlight.svg │ └── star.svg ├── index.js ├── component │ ├── cloud2.js │ ├── cloud3.js │ ├── SocialLinks.js │ ├── Home.js │ ├── FormContact.js │ ├── Form.js │ ├── Projects.js │ ├── Cards.js │ ├── InfoMe.js │ ├── WhoMe.js │ ├── Works.js │ ├── ContactMe.js │ ├── Menu.js │ ├── About.js │ ├── Navbar.js │ ├── Header.js │ ├── Passion.js │ ├── porjectsData.js │ └── Skills.js └── app.js ├── .babelrc ├── .gitignore ├── .stylelintrc.json ├── .eslintrc.json ├── MIT.md ├── package.json ├── .github └── workflows │ └── linters.yml ├── public └── index.html └── README.md /src/styles/Home.css: -------------------------------------------------------------------------------- 1 | 2 | .wrap { 3 | scroll-behavior: smooth; 4 | } 5 | -------------------------------------------------------------------------------- /src/images/about.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/about.jpg -------------------------------------------------------------------------------- /src/images/contact.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/contact.jpg -------------------------------------------------------------------------------- /src/images/covid.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/covid.PNG -------------------------------------------------------------------------------- /src/images/mapty.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/mapty.PNG -------------------------------------------------------------------------------- /src/images/myphoto.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/myphoto.jpg -------------------------------------------------------------------------------- /src/images/recipe.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/recipe.PNG -------------------------------------------------------------------------------- /src/images/reile.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/reile.jpg -------------------------------------------------------------------------------- /src/images/space.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/space.PNG -------------------------------------------------------------------------------- /src/images/unicef.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/unicef.PNG -------------------------------------------------------------------------------- /src/images/bookstore.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/bookstore.PNG -------------------------------------------------------------------------------- /src/images/budgeapp.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/budgeapp.PNG -------------------------------------------------------------------------------- /src/images/budgetapp.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/budgetapp.PNG -------------------------------------------------------------------------------- /src/images/pokemons.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/pokemons.PNG -------------------------------------------------------------------------------- /src/images/project4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/project4.jpg -------------------------------------------------------------------------------- /src/images/project5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/project5.jpg -------------------------------------------------------------------------------- /src/images/project6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/project6.jpg -------------------------------------------------------------------------------- /src/images/project7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/project7.jpg -------------------------------------------------------------------------------- /src/images/project8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/project8.jpg -------------------------------------------------------------------------------- /src/images/projecta2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/projecta2.jpg -------------------------------------------------------------------------------- /src/images/projects.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/projects.jpg -------------------------------------------------------------------------------- /src/images/projects3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/projects3.jpg -------------------------------------------------------------------------------- /src/images/covidproject.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/covidproject.PNG -------------------------------------------------------------------------------- /src/images/skills/css1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/skills/css1.png -------------------------------------------------------------------------------- /src/images/skills/html1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/skills/html1.png -------------------------------------------------------------------------------- /src/images/skills/jest.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/skills/jest.png -------------------------------------------------------------------------------- /src/images/skills/rails.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/skills/rails.png -------------------------------------------------------------------------------- /src/images/skills/ruby1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/skills/ruby1.png -------------------------------------------------------------------------------- /src/images/rentmedesktop.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/rentmedesktop.PNG -------------------------------------------------------------------------------- /src/images/spacetraveler.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/spacetraveler.PNG -------------------------------------------------------------------------------- /src/images/skills/postgres.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/skills/postgres.png -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | "@babel/preset-react" 4 | ], 5 | "plugins": ["@babel/plugin-syntax-jsx"] 6 | } -------------------------------------------------------------------------------- /src/images/skills/Untitled design.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Reem-lab/portfolio/HEAD/src/images/skills/Untitled design.png -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './app'; 4 | 5 | ReactDOM.render( 6 | 7 | 8 | , 9 | document.getElementById('root'), 10 | ); 11 | -------------------------------------------------------------------------------- /src/component/cloud2.js: -------------------------------------------------------------------------------- 1 | import img1 from '../images/b_cloud02.svg'; 2 | import img2 from '../images/b_cloud01.svg'; 3 | import '../styles/clouds.css'; 4 | 5 | const Cloud2 = () => ( 6 |
7 | cloud2-img 8 | cloud1-img 9 |
10 | ); 11 | 12 | export default Cloud2; 13 | -------------------------------------------------------------------------------- /src/styles/SocialLinks.css: -------------------------------------------------------------------------------- 1 | .social-links--site { 2 | display: flex; 3 | gap: 15px; 4 | justify-content: center; 5 | align-items: center; 6 | } 7 | 8 | .anchor-link { 9 | color: #fff; 10 | } 11 | 12 | .anchor-link:hover { 13 | color: #b3b3b3; 14 | } 15 | 16 | .social-icon--footer { 17 | width: 50px; 18 | height: 35px; 19 | margin-right: 5px; 20 | cursor: pointer; 21 | } 22 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /src/component/cloud3.js: -------------------------------------------------------------------------------- 1 | import img3 from '../images/cloud1.svg'; 2 | import img4 from '../images/cloud2.svg'; 3 | import img5 from '../images/cloud3.svg'; 4 | import '../styles/clouds.css'; 5 | 6 | const Cloud3 = () => ( 7 |
8 | cloud-black1 9 | cloud-black2 10 | cloud-black3 11 |
12 | ); 13 | 14 | export default Cloud3; 15 | -------------------------------------------------------------------------------- /.stylelintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["stylelint-config-standard"], 3 | "plugins": ["stylelint-scss", "stylelint-csstree-validator"], 4 | "rules": { 5 | "at-rule-no-unknown": [ 6 | true, 7 | { 8 | "ignoreAtRules": ["tailwind", "apply", "variants", "responsive", "screen"] 9 | } 10 | ], 11 | "scss/at-rule-no-unknown": [ 12 | true, 13 | { 14 | "ignoreAtRules": ["tailwind", "apply", "variants", "responsive", "screen"] 15 | } 16 | ], 17 | "csstree/validator": true 18 | }, 19 | "ignoreFiles": ["build/**", "dist/**", "**/reset*.css", "**/bootstrap*.css", "**/*.js", "**/*.jsx"] 20 | } -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true, 5 | "jest": true 6 | }, 7 | "parser": "@babel/eslint-parser", 8 | "parserOptions": { 9 | "ecmaFeatures": { 10 | "jsx": true 11 | }, 12 | "ecmaVersion": 2018, 13 | "sourceType": "module" 14 | }, 15 | "extends": ["airbnb", "plugin:react/recommended"], 16 | "plugins": ["react"], 17 | "rules": { 18 | "react/jsx-filename-extension": ["warn", { "extensions": [".js", ".jsx"] }], 19 | "react/react-in-jsx-scope": "off", 20 | "import/no-unresolved": "off", 21 | "no-shadow": "off" 22 | }, 23 | "ignorePatterns": [ 24 | "dist/", 25 | "build/" 26 | ] 27 | } -------------------------------------------------------------------------------- /src/images/exit.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /src/styles/app.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Montserrat:ital,wght@0,100;0,200;0,300;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Poppins:wght@400;600;800;900&family=Roboto+Mono:wght@400;600;700&display=swap'); 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | box-sizing: border-box; 7 | } 8 | 9 | body { 10 | font-family: 'Montserrat', sans-serif; 11 | background-color: #040f1b; 12 | color: #fff; 13 | } 14 | 15 | .app { 16 | background: url('../images/moonlight.svg') no-repeat fixed 100%; 17 | background-position-x: 399px; 18 | background-position-y: -320px; 19 | position: relative; 20 | overflow: hidden; 21 | } 22 | -------------------------------------------------------------------------------- /src/app.js: -------------------------------------------------------------------------------- 1 | import { Routes, Route, BrowserRouter as Router } from 'react-router-dom'; 2 | // import Navbar from './component/Navbar'; 3 | import Home from './component/Home'; 4 | import './styles/app.css'; 5 | import Projects from './component/Projects'; 6 | import InfoMe from './component/InfoMe'; 7 | import Form from './component/Form'; 8 | 9 | function App() { 10 | return ( 11 |
12 | 13 | {/* */} 14 | 15 | } /> 16 | } /> 17 | } /> 18 | } /> 19 | 20 | 21 |
22 | ); 23 | } 24 | 25 | export default App; 26 | -------------------------------------------------------------------------------- /src/component/SocialLinks.js: -------------------------------------------------------------------------------- 1 | import { AiOutlineTwitter, AiFillGithub, AiFillLinkedin } from 'react-icons/ai'; 2 | import { FaAngellist } from 'react-icons/fa'; 3 | import '../styles/SocialLinks.css'; 4 | 5 | const SocialLinks = () => ( 6 |
7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | ); 21 | 22 | export default SocialLinks; 23 | -------------------------------------------------------------------------------- /MIT.md: -------------------------------------------------------------------------------- 1 | ## Copyright 2022, [Reem Janina] 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy of this [portfolio] and associated documentation files, to deal in the [portfolio] without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the [portfolio], and to permit persons to whom the [portfolio] is furnished to do so, subject to the following conditions: 4 | 5 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the [portfolio]. 6 | 7 | THE [portfolio] IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE [portfolio] OR THE USE OR OTHER DEALINGS IN THE [portfolio]. -------------------------------------------------------------------------------- /src/images/moon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/images/moon (1).svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/component/Home.js: -------------------------------------------------------------------------------- 1 | // // import Fullpage,{ FullPageSections, 2 | // FullpageSection, FullpageNavigation } from '@ap.cx/react-fullpage'; 3 | import Header from './Header'; 4 | import Works from './Works'; 5 | import Navbar from './Navbar'; 6 | import '../styles/Home.css'; 7 | import About from './About'; 8 | import ContactMe from './ContactMe'; 9 | 10 | const Home = () => ( 11 |
12 | {/* 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | */} 30 | 31 |
32 | 33 | 34 | 35 |
36 | ); 37 | 38 | export default Home; 39 | -------------------------------------------------------------------------------- /src/component/FormContact.js: -------------------------------------------------------------------------------- 1 | import '../styles/Form.css'; 2 | 3 | const FormContact = () => ( 4 |
5 |
6 |
7 |

01

8 |

Let's Contact ✉

9 |
10 |
11 | 12 | 13 |