├── .gitignore ├── README.md ├── package-lock.json ├── package.json ├── public ├── favicon.ico ├── index.html ├── logo192.png ├── logo512.png ├── manifest.json └── robots.txt ├── src ├── App.scss ├── App.test.tsx ├── App.tsx ├── components │ ├── BackToTopButton │ │ ├── BackToTopButton.scss │ │ └── BackToTopButton.tsx │ ├── Comments │ │ ├── Comments.scss │ │ └── Comments.tsx │ ├── CreatePost │ │ ├── CreatePost.scss │ │ └── CreatePost.tsx │ ├── EditComment │ │ ├── EditComment.scss │ │ └── EditComment.tsx │ ├── GridPost │ │ ├── GridPost.scss │ │ └── GridPost.tsx │ ├── HomeSideBar │ │ ├── HomeSideBar.scss │ │ └── HomeSideBar.tsx │ ├── Imprint │ │ ├── Imprint.scss │ │ └── Imprint.tsx │ ├── LoginModal │ │ ├── LoginModal.scss │ │ └── LoginModal.tsx │ ├── PostedComment │ │ ├── PostedComment.scss │ │ └── PostedComment.tsx │ ├── SortBar │ │ ├── SortBar.scss │ │ └── SortBar.tsx │ ├── SubredditHeadline │ │ ├── SubredditHeadline.scss │ │ └── SubredditHeadline.tsx │ └── SubredditSideBar │ │ ├── SubredditSideBar.scss │ │ └── SubredditSideBar.tsx ├── containers │ ├── Grid │ │ ├── Grid.scss │ │ └── Grid.tsx │ ├── Home │ │ ├── Home.scss │ │ └── Home.tsx │ ├── NavBar │ │ ├── NavBar.scss │ │ └── NavBar.tsx │ ├── ProfilePage │ │ ├── ProfilePage.scss │ │ └── ProfilePage.tsx │ ├── SubmitPage │ │ ├── SubmitPage.scss │ │ └── SubmitPage.tsx │ ├── SubredditPage │ │ ├── SubredditPage.scss │ │ └── SubredditPage.tsx │ └── individualPost │ │ ├── individualPost.scss │ │ └── individualPost.tsx ├── custom.d.ts ├── declarations.d.ts ├── index.scss ├── index.tsx ├── logo.svg ├── react-app-env.d.ts ├── reportWebVitals.ts ├── resources │ ├── fonts │ │ ├── bentonsansbook.otf │ │ ├── bentonsansregular.otf │ │ ├── ibmplexsans.ttf │ │ ├── ibmplexsanslight.ttf │ │ ├── ibmplexsansregular.ttf │ │ ├── notosans-bold.ttf │ │ ├── notosans-regular.ttf │ │ └── notosans.ttf │ └── images │ │ ├── Communities │ │ ├── announcements │ │ │ ├── banner.jpg │ │ │ └── icon.PNG │ │ ├── apexlegends │ │ │ ├── 56.png │ │ │ ├── 58.png │ │ │ ├── 59.png │ │ │ ├── 60.png │ │ │ ├── Icon.png │ │ │ └── banner.jpg │ │ ├── astronomy │ │ │ ├── 72.png │ │ │ ├── 73.png │ │ │ ├── 74.png │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── baking │ │ │ ├── 66.png │ │ │ ├── 67.png │ │ │ ├── 68.png │ │ │ ├── 69.png │ │ │ ├── 70.png │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── books │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── crypto │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── finance │ │ │ ├── 24.png │ │ │ ├── 25.png │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── genshinimpact │ │ │ ├── 10.png │ │ │ ├── 11.png │ │ │ ├── 12.png │ │ │ ├── 13.png │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── leagueoflegends │ │ │ ├── 5.png │ │ │ ├── 6.png │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── learnprogramming │ │ │ ├── banner.jpg │ │ │ └── icon.PNG │ │ ├── movies │ │ │ ├── 2.png │ │ │ ├── 3.png │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── nasa │ │ │ ├── 46.png │ │ │ ├── 48.png │ │ │ ├── 50.png │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── nba │ │ │ ├── 15.PNG │ │ │ ├── 17.PNG │ │ │ ├── 19.PNG │ │ │ ├── Icon.png │ │ │ └── banner.jpg │ │ ├── placeholder.png │ │ ├── programmerHumor │ │ │ ├── 27.png │ │ │ ├── 29.png │ │ │ ├── 30.png │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── sports │ │ │ ├── 77.png │ │ │ ├── 78.png │ │ │ ├── 80.png │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── todayilearned │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ └── wallstreetbets │ │ │ ├── 41.png │ │ │ ├── 43.png │ │ │ ├── 45.png │ │ │ ├── banner.jpg │ │ │ └── icon.png │ │ ├── add.PNG │ │ ├── addphoto.png │ │ ├── ads.png │ │ ├── all.PNG │ │ ├── apple.svg │ │ ├── avatar1.PNG │ │ ├── avatar10.PNG │ │ ├── avatar10_head.png │ │ ├── avatar1_head.png │ │ ├── avatar2.PNG │ │ ├── avatar2_head.png │ │ ├── avatar3.PNG │ │ ├── avatar3_head.png │ │ ├── avatar4.PNG │ │ ├── avatar4_head.png │ │ ├── avatar5.PNG │ │ ├── avatar5_head.png │ │ ├── avatar6.PNG │ │ ├── avatar6_head.png │ │ ├── avatar7.PNG │ │ ├── avatar7_head.png │ │ ├── avatar8.PNG │ │ ├── avatar8_head.png │ │ ├── avatar9.PNG │ │ ├── avatar9_head.png │ │ ├── avatartesla.PNG │ │ ├── avatartesla_head.png │ │ ├── awards.png │ │ ├── banner.png │ │ ├── banner2.PNG │ │ ├── bannerTopCommunities.png │ │ ├── bannerTopCommunities2.png │ │ ├── bannerTopCommunities3.png │ │ ├── base_variants │ │ ├── default1.png │ │ ├── default10.png │ │ ├── default11.png │ │ ├── default12.png │ │ ├── default13.png │ │ ├── default14.png │ │ ├── default15.png │ │ ├── default2.png │ │ ├── default3.png │ │ ├── default4.png │ │ ├── default5.png │ │ ├── default6.png │ │ ├── default7.png │ │ ├── default8.png │ │ └── default9.png │ │ ├── bell.PNG │ │ ├── best_notselected.png │ │ ├── best_selected.png │ │ ├── betauser.png │ │ ├── bluesettings.png │ │ ├── bold.png │ │ ├── bulleted.png │ │ ├── cake.png │ │ ├── cakeblack.png │ │ ├── chat.PNG │ │ ├── check.png │ │ ├── checkblack.png │ │ ├── clip.png │ │ ├── close.PNG │ │ ├── coin.png │ │ ├── commenter.png │ │ ├── comments.png │ │ ├── cross.png │ │ ├── cross.svg │ │ ├── dots.png │ │ ├── downvote.png │ │ ├── downvoteHover.png │ │ ├── downvoted.png │ │ ├── dropdown.svg │ │ ├── einstellungen.png │ │ ├── erkunden.png │ │ ├── expand.png │ │ ├── expand.svg │ │ ├── expandblack.png │ │ ├── expandgrey.png │ │ ├── eye.png │ │ ├── favorite.svg │ │ ├── favorited.PNG │ │ ├── fiveyearclub.png │ │ ├── flair.PNG │ │ ├── fouryearclub.png │ │ ├── gold.png │ │ ├── google.svg │ │ ├── heading.png │ │ ├── helpful.png │ │ ├── helpfulgold.png │ │ ├── hexagon.png │ │ ├── hilfecenter.png │ │ ├── home.png │ │ ├── homeavatar.png │ │ ├── homebanner.png │ │ ├── hot_notselected.png │ │ ├── hot_selected.png │ │ ├── img.PNG │ │ ├── infos_grey.png │ │ ├── inline.png │ │ ├── italic.png │ │ ├── karma.PNG │ │ ├── karma_blue.png │ │ ├── kicgzh7qcmy41.jpg │ │ ├── layout.png │ │ ├── link.PNG │ │ ├── live.PNG │ │ ├── loading.gif │ │ ├── loginbackground.png │ │ ├── logout.png │ │ ├── more.PNG │ │ ├── more_white.PNG │ │ ├── moregrey.png │ │ ├── new_notselected.png │ │ ├── new_selected.png │ │ ├── newuser.png │ │ ├── noti_check.png │ │ ├── noti_settings.png │ │ ├── numbered.png │ │ ├── onedayclub.png │ │ ├── pen.svg │ │ ├── pencil.png │ │ ├── people.png │ │ ├── performance.png │ │ ├── photograph.png │ │ ├── platinum.png │ │ ├── plusone.png │ │ ├── plusone.webp │ │ ├── popular.PNG │ │ ├── popularcomment.png │ │ ├── popularpost.png │ │ ├── post.png │ │ ├── poster.png │ │ ├── premium.png │ │ ├── premium2.png │ │ ├── preview1.PNG │ │ ├── preview10.PNG │ │ ├── preview11.PNG │ │ ├── preview2.PNG │ │ ├── preview3.PNG │ │ ├── preview4.PNG │ │ ├── preview5.PNG │ │ ├── preview6.PNG │ │ ├── preview7.PNG │ │ ├── preview8.PNG │ │ ├── preview9.PNG │ │ ├── profile.png │ │ ├── quote.png │ │ ├── recent.png │ │ ├── reddit.svg │ │ ├── redditlogo.png │ │ ├── redditlogo.svg │ │ ├── rediquette.png │ │ ├── registrieren.png │ │ ├── remove.png │ │ ├── report.png │ │ ├── richtlinien.png │ │ ├── rocket.png │ │ ├── save.png │ │ ├── saved.png │ │ ├── search.svg │ │ ├── sevenyearclub.png │ │ ├── share.png │ │ ├── shirt.png │ │ ├── silver.png │ │ ├── sixyearclub.png │ │ ├── spoiler.png │ │ ├── star.svg │ │ ├── stonks.png │ │ ├── stonks.webp │ │ ├── strikethrough.png │ │ ├── superheart.png │ │ ├── superscript.png │ │ ├── talk.png │ │ ├── tbn70x69n2m91.webp │ │ ├── threeyearclub.png │ │ ├── top.png │ │ ├── top_notselected.png │ │ ├── top_selected.png │ │ ├── trinity.png │ │ ├── twoyearclub.png │ │ ├── typeimage.png │ │ ├── typeimage_selected.png │ │ ├── typelink.png │ │ ├── typelink_selected.png │ │ ├── typelist.png │ │ ├── typepoll.png │ │ ├── typetalk.png │ │ ├── typetext.png │ │ ├── typetext_selected.png │ │ ├── unfavorited.PNG │ │ ├── upvote.png │ │ ├── upvoteHover.png │ │ ├── upvoted.png │ │ ├── user.png │ │ ├── user.svg │ │ ├── vibing.png │ │ ├── weitereinfos.png │ │ ├── werbung.png │ │ └── wholesome.png ├── setupTests.ts ├── styles │ └── global │ │ ├── _functions.scss │ │ ├── _mixins.scss │ │ └── _variables.scss ├── types │ ├── types.json │ └── types.ts └── utils │ ├── bestOrder.ts │ ├── hotOrder.ts │ ├── newOrder.ts │ ├── postArray.ts │ ├── subredditArray.ts │ ├── topOrder.ts │ └── userArray.ts └── tsconfig.json /.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 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |

⚛️ React Reddit Clone

2 | 3 | ![](/src/resources/images/banner.png) 4 |

5 | Reddit Clone built with React & Typescript 6 |

7 | 8 | ## Short Description 📋 9 | A Reddit Clone built with TypeScript, React and SCSS. Additional to the famous infinite scrolling home page I also implemented subreddits, individual post pages, comments and nested comments, post submission, profile pages and various dropdown menu's, including the search bar and notifications. Users can join and leave subreddits, add/remove them to/from their favorites, can like posts and comments or create some on their own. A detailed feature list can be found at the end of this document. 10 | 11 | ## Demo 🔴 12 | ⚛️ [Live Demo](https://gianlucajahn.github.io/typescript-reddit-clone) available. Click "Live Demo" to open it. 13 | 14 | ## Showcase 🎬 15 | You can see images of the project in user interaction below. The user starts on the home page, signs up with a new account, selects a subreddit and much more. Detailed descriptions can be found right beneath the images. These images only showcase the most elementary user interactions.

16 | 17 | ![](/src/resources/images/preview1.PNG) 18 | The clone's home page, posts are sorted by "Hot". 19 | ![](/src/resources/images/preview2.PNG) 20 | The user is using the sign up modal to create an account. 21 | ![](/src/resources/images/preview3.PNG) 22 | The user is viewing the r/genshinimpact subreddit page. 23 | ![](/src/resources/images/preview4.PNG) 24 | The user is creating a new post in the r/genshinimpact subreddit, including a picture. 25 | ![](/src/resources/images/preview5.PNG) 26 | The user is viewing the r/movies subreddit page. 27 | ![](/src/resources/images/preview6.PNG) 28 | The user just created their first post in r/movies. 29 | ![](/src/resources/images/preview7.PNG) 30 | The user is viewing their profile page. 31 | ![](/src/resources/images/preview8.PNG) 32 | The user views a post in the r/astronomy subreddit and writes a comment. 33 | ![](/src/resources/images/preview9.PNG) 34 | The user is viewing the r/crypto subreddit page. 35 | ![](/src/resources/images/preview10.PNG) 36 | The user is replying to a comment under a post in r/crypto. 37 | ![](/src/resources/images/preview11.PNG) 38 | The user is viewing the r/wallstreetbets subreddit page, opening two dropdown menu's. 39 | 40 | ## Performance ⏱ 41 | I let [Google Lighthouse](https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk?hl=de) run over my application to check for it's **performance, accessibility, use of best practices and SEO optimization**. You can view the results right below this paragraph. 42 | 43 | ![Google Lighthouse Performance Results](/src/resources/images/performance.png) 44 | 45 | ## Features ✨ 46 | - Pixel perfect UI/UX 47 | - Subreddit join, leave and favoriting 48 | - Upvoting, downvoting and saving posts 49 | - Adding custom posts, including either text or images 50 | - Upvoting and downvoting comments 51 | - Writing comments and nested comments 52 | - Editing your own comments and nested comments after submission 53 | - Profile Pages with different sections 54 | - a working karma system 55 | - Following, adding and reporting other users 56 | - Switchable color themes for subreddits 57 | - Various dropdown menu's 58 | - Search functionality 59 | 60 | ## Technologies Used 💻 61 | - TypeScript 62 | - React 63 | - React Router Dom 64 | - SCSS 65 | - Git 66 | 67 | ## What I learned 📚 68 | - Working with a strongly typed language like TypeScript and learning to type to minimize bugs/errors 69 | - Organizing a bigger codebase descriptively and maintaining efficiency of the end product 70 | - Manipulating objects in state and working with optional parameters and props in TypeScript 71 | 72 | ## Motivation 73 | My motivations in building this project was moving on with what I learned about JavaScript and React, jumping into a newer technology - TypeScript, in this case - and working on a big codebase on my own. This project currently consists of just a bit more than 24,000 lines of code, so while still not being a corporate size project, I learned how to structure sizeable codebases effectively. My next endeavour will be working with backends, possibly utilizing Next.js in the process. 74 | 75 | ## Credits 76 | 🟠 [Reddit.com](https://www.reddit.com/): Since this is a clone built for educational purposes only, all rights and credits go to Reddit Inc. 77 | 78 | All rights to all concepts, designs, services and ideas in this web app belong to Reddit/Reddit Inc. This is just a clone built with TypeScript for educational purposes to learn the underlying programming language. I am not in any way connected to Reddit and neither is this web app. Neither me nor this web app are affiliated with Reddit. If you are an owner of the copyrighted material, please let me know if you have any issues with this and I'll take the page down immediately. 79 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "typescript-reddit-clone", 3 | "version": "0.1.0", 4 | "private": true, 5 | "homepage": "https://gianlucajahn.github.io/typescript-reddit-clone/", 6 | "dependencies": { 7 | "@testing-library/jest-dom": "^5.16.5", 8 | "@testing-library/react": "^13.3.0", 9 | "@testing-library/user-event": "^13.5.0", 10 | "@types/jest": "^27.5.2", 11 | "@types/node": "^16.11.51", 12 | "@types/react": "^18.0.17", 13 | "@types/react-dom": "^18.0.6", 14 | "javascript-time-ago": "^2.5.9", 15 | "moment": "^2.29.4", 16 | "react": "^18.2.0", 17 | "react-confetti": "^6.1.0", 18 | "react-dom": "^18.2.0", 19 | "react-router-dom": "^6.3.0", 20 | "react-scripts": "5.0.1", 21 | "react-time-ago": "^7.2.1", 22 | "react-toastify": "^9.1.1", 23 | "react-use": "^17.4.0", 24 | "typescript": "^4.7.4", 25 | "web-vitals": "^2.1.4" 26 | }, 27 | "scripts": { 28 | "predeploy": "npm run build", 29 | "deploy": "gh-pages -d build", 30 | "start": "react-scripts start", 31 | "build": "react-scripts build", 32 | "test": "react-scripts test", 33 | "eject": "react-scripts eject" 34 | }, 35 | "eslintConfig": { 36 | "extends": [ 37 | "react-app", 38 | "react-app/jest" 39 | ] 40 | }, 41 | "browserslist": { 42 | "production": [ 43 | ">0.2%", 44 | "not dead", 45 | "not op_mini all" 46 | ], 47 | "development": [ 48 | "last 1 chrome version", 49 | "last 1 firefox version", 50 | "last 1 safari version" 51 | ] 52 | }, 53 | "devDependencies": { 54 | "gh-pages": "^4.0.0" 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/public/favicon.ico -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 13 | 14 | 15 | 16 | TypeScript Reddit Clone 17 | 18 | 19 | 20 |
21 | 22 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/public/logo192.png -------------------------------------------------------------------------------- /public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/public/logo512.png -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /src/App.scss: -------------------------------------------------------------------------------- 1 | 2 | 3 | @media (prefers-reduced-motion: no-preference) { 4 | .App-logo { 5 | animation: App-logo-spin infinite 20s linear; 6 | } 7 | } 8 | 9 | .App-link { 10 | color: #61dafb; 11 | } 12 | 13 | @keyframes App-logo-spin { 14 | from { 15 | transform: rotate(0deg); 16 | } 17 | to { 18 | transform: rotate(360deg); 19 | } 20 | } 21 | 22 | -------------------------------------------------------------------------------- /src/App.test.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { render, screen } from '@testing-library/react'; 3 | import App from './App'; 4 | 5 | test('renders learn react link', () => { 6 | render(); 7 | const linkElement = screen.getByText(/learn react/i); 8 | expect(linkElement).toBeInTheDocument(); 9 | }); 10 | -------------------------------------------------------------------------------- /src/components/BackToTopButton/BackToTopButton.scss: -------------------------------------------------------------------------------- 1 | // CSS 2 | .back-to-top { 3 | background-color: #0079d3; 4 | padding: 4px 12px 5px 12px; 5 | border: 1px solid transparent; 6 | border-radius: 9999px; 7 | position: sticky; 8 | width: 120px; 9 | top: 898px; 10 | align-self: center; 11 | font-family: "Noto Sans Bold"; 12 | color: white; 13 | font-size: 14px; 14 | cursor: pointer; 15 | 16 | &:hover { 17 | background-color: #1086e0; 18 | } 19 | 20 | &:active { 21 | background-color: #016fc4; 22 | } 23 | } -------------------------------------------------------------------------------- /src/components/BackToTopButton/BackToTopButton.tsx: -------------------------------------------------------------------------------- 1 | // Imports 2 | import React, { MouseEventHandler } from 'react'; 3 | // CSS Imports 4 | import './BackToTopButton.scss'; 5 | 6 | export interface BackToTopButtonProps { 7 | 8 | } 9 | 10 | const returnToTop = (e: React.MouseEvent) => { 11 | window.scrollTo({top: 0, behavior: 'smooth'}); 12 | } 13 | 14 | export default function BackToTopButton (props: BackToTopButtonProps) { 15 | return ( 16 | 19 | ); 20 | } 21 | -------------------------------------------------------------------------------- /src/components/Comments/Comments.scss: -------------------------------------------------------------------------------- 1 | // CSS 2 | .comment-container { 3 | background-color: red; 4 | width: 740px; 5 | display: flex; 6 | flex-direction: column; 7 | box-sizing: border-box; 8 | background-color: white; 9 | padding: 12px 6px; 10 | 11 | .submit-comment { 12 | margin-top: 7px; 13 | padding-left: 42px; 14 | 15 | .submit-header { 16 | font-family: "Noto Sans Regular"; 17 | color: #060606; 18 | font-size: 12px; 19 | } 20 | 21 | .comment-box { 22 | width: 652px; 23 | min-width: 652px; 24 | min-height: 139px; 25 | max-width: 652px; 26 | height: 139px; 27 | border: 1px solid #edeff1; 28 | border-bottom-left-radius: 0px; 29 | border-bottom-right-radius: 0px; 30 | box-sizing: border-box; 31 | border-bottom: none; 32 | border-radius: 4px; 33 | padding: 9px 16px; 34 | font-family: "Noto Sans Regular"; 35 | font-size: 14px; 36 | outline: none; 37 | } 38 | 39 | .button-bar { 40 | background-color: #f6f7f8; 41 | width: 652px; 42 | padding-left: 7px; 43 | box-sizing: border-box; 44 | border: 1px solid #edeff1; 45 | border-radius: 4px; 46 | padding-top: 2px; 47 | border-top: none; 48 | margin-top: -3px; 49 | display: flex; 50 | gap: 1px; 51 | 52 | .line { 53 | width: 1px; 54 | height: 30px; 55 | left: 702px; 56 | position: absolute; 57 | background-color: #edeff1; 58 | } 59 | 60 | .text-settings { 61 | padding: 3px 6px; 62 | border: 1px solid transparent; 63 | border-radius: 4px; 64 | background-color: transparent; 65 | cursor: pointer; 66 | position: relative; 67 | 68 | &:hover { 69 | background-color: #d0d1d2; 70 | } 71 | 72 | &:hover::after { 73 | position: absolute; 74 | margin: 0 auto; 75 | left: -12px; 76 | bottom: 36px; 77 | padding: 5px 10px 5px 10px; 78 | border-radius: 4px; 79 | background-color: black; 80 | color: white; 81 | content: attr(aria-label); 82 | } 83 | 84 | &:active { 85 | background-color: #b2b2b3; 86 | } 87 | 88 | .setting-icon { 89 | height: 21px; 90 | } 91 | } 92 | 93 | .markdown { 94 | margin-left: 9px; 95 | align-self: center; 96 | cursor: pointer; 97 | height: 24px; 98 | border: 1px solid transparent; 99 | display: flex; 100 | align-items: center; 101 | padding-bottom: 3px; 102 | border-radius: 9999px; 103 | padding-left: 7px; 104 | padding-right: 7px; 105 | 106 | p { 107 | font-size: 12px; 108 | font-family: "Noto Sans Bold"; 109 | } 110 | } 111 | 112 | #markdown { 113 | background-color: transparent; 114 | 115 | &:hover { 116 | background-color: #d0d1d2; 117 | } 118 | 119 | &:active { 120 | background-color: #b2b2b3; 121 | } 122 | } 123 | 124 | .submit { 125 | height: 24px; 126 | padding-left: 19px; 127 | padding-right: 21px; 128 | margin-bottom: 1px; 129 | margin-right: 8px; 130 | cursor: not-allowed; 131 | border: none; 132 | 133 | &:hover { 134 | box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.125); 135 | } 136 | 137 | &:active { 138 | box-shadow: inset 0 0 100px 100px rgba(0, 0, 0, 0.125); 139 | } 140 | } 141 | 142 | .spoiler { 143 | margin-right: 15px; 144 | } 145 | } 146 | } 147 | } 148 | 149 | .hoverArea { 150 | margin-top: 5px; 151 | width: 652px; 152 | border: 1px solid transparent; 153 | border-radius: 4px; 154 | } 155 | 156 | .sorter { 157 | display: flex; 158 | align-items: center; 159 | padding-left: 42px; 160 | margin-top: 23px; 161 | font-family: "IBM"; 162 | font-size: 11px; 163 | cursor: pointer; 164 | 165 | .dropdown { 166 | height: 22px; 167 | padding-bottom: 1px; 168 | } 169 | } 170 | 171 | .divider { 172 | margin-top: 6px; 173 | height: 1px; 174 | width: 652px; 175 | margin-left: 42px; 176 | background-color: #edeff1; 177 | margin-bottom: 24px; 178 | } 179 | 180 | #content { 181 | font-family: "Noto Sans Regular"; 182 | color: #060606; 183 | font-size: 14px; 184 | padding: 0; 185 | margin: 0; 186 | } 187 | 188 | .nestedComment { 189 | display: flex; 190 | 191 | .comment-line { 192 | margin-top: 6px; 193 | margin-left: 12px; 194 | width: 2px; 195 | cursor: pointer; 196 | } 197 | 198 | .second-row-line { 199 | margin-top: 18px; 200 | margin-left: 22px; 201 | width: 2px; 202 | cursor: pointer; 203 | } 204 | } -------------------------------------------------------------------------------- /src/components/Comments/Comments.tsx: -------------------------------------------------------------------------------- 1 | // Imports 2 | import React, { MouseEventHandler, useEffect, useState, Dispatch, SetStateAction } from 'react'; 3 | // Type Imports 4 | import { Post, Subreddit, Comment } from '../../types/types'; 5 | // SVG Imports 6 | import { ReactComponent as Dropdown } from "../../resources/images/dropdown.svg"; 7 | // Component Imports 8 | import EditComment from '../EditComment/EditComment'; 9 | import PostedComment from '../PostedComment/PostedComment'; 10 | // CSS Imports 11 | import './Comments.scss'; 12 | 13 | 14 | export interface CommentsProps { 15 | userName: string, 16 | currentSub: Subreddit | undefined, 17 | mainComment: string, 18 | randomIntToString: string, 19 | writeComment: any, 20 | currentEditedComment: string, 21 | currentPost: Post, 22 | loginStatus: boolean, 23 | writeNestedComment: any, 24 | editComment: any, 25 | editNestedComment: any, 26 | setIndex: Dispatch>, 27 | navToProfile: MouseEventHandler | undefined, 28 | navToUserProfile: MouseEventHandler | undefined, 29 | submitNestedComment: MouseEventHandler, 30 | submitComment: MouseEventHandler, 31 | handleLikeComment: MouseEventHandler, 32 | handleNestedComment: MouseEventHandler 33 | } 34 | 35 | export default function Comments (props: CommentsProps) { 36 | const { 37 | userName, 38 | currentSub, 39 | mainComment, 40 | writeComment, 41 | currentEditedComment, 42 | currentPost, 43 | loginStatus, 44 | randomIntToString, 45 | writeNestedComment, 46 | editComment, 47 | editNestedComment, 48 | navToProfile, 49 | navToUserProfile, 50 | setIndex, 51 | submitNestedComment, 52 | submitComment, 53 | handleLikeComment, 54 | handleNestedComment 55 | } = props; 56 | 57 | // Local state 58 | const [focussed, setFocussed] = useState(false); 59 | const [hovered, setHovered] = useState({ 60 | upvote: false, 61 | downvote: false 62 | }); 63 | const [boxId, setBoxId] = useState(0); 64 | const [hoveredComments, setHoveredComments] = useState([ 65 | { 66 | upvote: false, 67 | downvote: false 68 | }, 69 | { 70 | upvote: false, 71 | downvote: false 72 | }, 73 | { 74 | upvote: false, 75 | downvote: false 76 | }, 77 | { 78 | upvote: false, 79 | downvote: false 80 | }, 81 | { 82 | upvote: false, 83 | downvote: false 84 | }, 85 | { 86 | upvote: false, 87 | downvote: false 88 | }, 89 | { 90 | upvote: false, 91 | downvote: false 92 | } 93 | ]) 94 | const basicCommentHoverState = [ 95 | { 96 | upvote: false, 97 | downvote: false, 98 | }, 99 | { 100 | upvote: false, 101 | downvote: false 102 | }, 103 | { 104 | upvote: false, 105 | downvote: false 106 | }, 107 | { 108 | upvote: false, 109 | downvote: false 110 | }, 111 | { 112 | upvote: false, 113 | downvote: false 114 | }, 115 | { 116 | upvote: false, 117 | downvote: false 118 | }, 119 | { 120 | upvote: false, 121 | downvote: false 122 | } 123 | ]; 124 | 125 | // Reset comment hover states on login/logout 126 | useEffect(() => { 127 | setHoveredComments(basicCommentHoverState); 128 | }, [loginStatus]) 129 | 130 | // Handle comment hover events 131 | const handleHoverComment = (e: React.MouseEvent) => { 132 | const target = e.currentTarget; 133 | const idString = target.classList[0]; 134 | const id = parseInt(idString); 135 | if (target.id === "upvote") { 136 | const newHoverState = { 137 | upvote: !hoveredComments[id].upvote, 138 | downvote: hoveredComments[id].downvote 139 | }; 140 | const newHoveredArray = [...hoveredComments]; 141 | const exchange = newHoveredArray.map((state, i) => { 142 | if (i === id) { 143 | state = newHoverState; 144 | return state; 145 | } else { 146 | return state; 147 | } 148 | }); 149 | setHoveredComments(exchange); 150 | } else if (target.id === "downvote") { 151 | const newHoverState = { 152 | upvote: hoveredComments[id].upvote, 153 | downvote: !hoveredComments[id].downvote 154 | }; 155 | const newHoveredArray = [...hoveredComments]; 156 | const exchange = newHoveredArray.map((state, i) => { 157 | if (i === id) { 158 | state = newHoverState; 159 | return state; 160 | } else { 161 | return state; 162 | } 163 | }); 164 | setHoveredComments(exchange); 165 | } 166 | } 167 | 168 | return ( 169 |
170 |
171 |

Comment as {userName !== "" ? userName : "User"}

172 | 173 | 188 |
189 | 190 |
191 |
192 |

Sort By: Best

193 | 197 |
198 | 199 |
200 | 201 | {currentPost.comments.map((comment, i) => { 202 | return 229 | })} 230 |
231 |
232 | ); 233 | } 234 | -------------------------------------------------------------------------------- /src/components/CreatePost/CreatePost.scss: -------------------------------------------------------------------------------- 1 | // Imports 2 | @import "../../styles/global/variables"; 3 | 4 | .createPostMenu { 5 | display: flex; 6 | background-color: white; 7 | border: 1px solid #ccc; 8 | margin-bottom: 16px; 9 | padding: 6px; 10 | border-radius: 4px; 11 | box-sizing: border-box; 12 | width: $contentWidth; 13 | height: 58px; 14 | padding: 0px 8px 0px 61px; 15 | align-items: center; 16 | position: relative; 17 | 18 | .avatar { 19 | height: 54px; 20 | position: absolute; 21 | top: -9%; 22 | left: 1.2%; 23 | cursor: pointer; 24 | } 25 | 26 | input { 27 | color: $svgColor; 28 | font-family: 'Benton Sans Book'; 29 | background-color: #F6F7F8; 30 | border: 1px solid #EDEFF1; 31 | border-radius: 4px; 32 | height: 36px; 33 | width: 467px; 34 | margin-bottom: 2px; 35 | padding-left: 16px; 36 | font-size: 15px; 37 | margin-right: 8px; 38 | 39 | &:hover { 40 | border: 1px solid $blue; 41 | background-color: #fff; 42 | } 43 | &:focus { 44 | border: 1px solid $blue; 45 | background-color: #fff; 46 | outline: none; 47 | } 48 | } 49 | 50 | button.imagePost, 51 | button.linkPost { 52 | cursor: pointer; 53 | display: flex; 54 | justify-content: center; 55 | align-items: center; 56 | height: 38px; 57 | width: 38px; 58 | border: 1px transparent; 59 | border-radius: 4px; 60 | background-color: transparent; 61 | position: relative; 62 | font-size: 0.7185em; 63 | &:hover { 64 | background-color: rgba(26,26,27,0.1); 65 | } 66 | 67 | .icon { 68 | height: 20px; 69 | } 70 | } 71 | } -------------------------------------------------------------------------------- /src/components/CreatePost/CreatePost.tsx: -------------------------------------------------------------------------------- 1 | // Imports 2 | import React, { MouseEventHandler } from 'react'; 3 | // Hook Imports 4 | import { useNavigate } from 'react-router-dom'; 5 | // CSS Imports 6 | import './CreatePost.scss'; 7 | 8 | export interface CreatePostProps { 9 | randomIntToString: string, 10 | userName: string, 11 | loginStatus: boolean, 12 | navToSubmit: MouseEventHandler 13 | } 14 | 15 | export default function CreatePost (props: CreatePostProps) { 16 | const { 17 | randomIntToString, 18 | userName, 19 | loginStatus, 20 | navToSubmit, 21 | } = props; 22 | 23 | return ( 24 |
25 | avatar 26 | 27 | 30 | 33 |
34 | ); 35 | } 36 | -------------------------------------------------------------------------------- /src/components/EditComment/EditComment.scss: -------------------------------------------------------------------------------- 1 | // CSS 2 | .hoverArea { 3 | border: 1px solid transparent; 4 | border-radius: 4px; 5 | 6 | .comment-box { 7 | height: 139px; 8 | border: 1px solid #edeff1; 9 | border-bottom-left-radius: 0px; 10 | border-bottom-right-radius: 0px; 11 | box-sizing: border-box; 12 | border-bottom: none; 13 | color: #060606; 14 | border-radius: 4px; 15 | padding: 9px 16px; 16 | font-family: "Noto Sans Regular"; 17 | font-size: 14px; 18 | outline: none; 19 | } 20 | 21 | .comment-box::placeholder { 22 | color: #878a8c; 23 | } 24 | 25 | .button-bar { 26 | background-color: #f6f7f8; 27 | padding-left: 7px; 28 | box-sizing: border-box; 29 | border: 1px solid #edeff1; 30 | border-radius: 4px; 31 | padding-top: 2px; 32 | border-top: none; 33 | margin-top: -3px; 34 | justify-content: space-between; 35 | display: flex; 36 | gap: 1px; 37 | 38 | .line { 39 | width: 1px; 40 | height: 30px; 41 | left: 702px; 42 | position: absolute; 43 | background-color: #edeff1; 44 | } 45 | 46 | .text-settings { 47 | padding: 3px 6px; 48 | border: 1px solid transparent; 49 | border-radius: 4px; 50 | background-color: transparent; 51 | cursor: pointer; 52 | position: relative; 53 | 54 | &:hover { 55 | background-color: #d0d1d2; 56 | } 57 | 58 | &:hover::after { 59 | position: absolute; 60 | margin: 0 auto; 61 | left: -12px; 62 | bottom: 36px; 63 | padding: 5px 10px 5px 10px; 64 | border-radius: 4px; 65 | background-color: black; 66 | color: white; 67 | content: attr(aria-label); 68 | } 69 | 70 | &:active { 71 | background-color: #b2b2b3; 72 | } 73 | 74 | .setting-icon { 75 | height: 21px; 76 | } 77 | } 78 | 79 | .markdown { 80 | margin-left: 9px; 81 | align-self: center; 82 | cursor: pointer; 83 | height: 24px; 84 | border: 1px solid transparent; 85 | display: flex; 86 | align-items: center; 87 | padding-bottom: 3px; 88 | border-radius: 9999px; 89 | padding-left: 7px; 90 | padding-right: 7px; 91 | 92 | p { 93 | font-size: 12px; 94 | font-family: "Noto Sans Bold"; 95 | } 96 | } 97 | 98 | .btn { 99 | background-color: transparent; 100 | 101 | &:hover { 102 | background-color: #d0d1d2; 103 | } 104 | 105 | &:active { 106 | background-color: #b2b2b3; 107 | } 108 | 109 | * { 110 | pointer-events: none; 111 | } 112 | } 113 | 114 | .end { 115 | height: 32px; 116 | align-items: center; 117 | display: flex; 118 | } 119 | 120 | #markdown { 121 | background-color: transparent; 122 | 123 | &:hover { 124 | background-color: #d0d1d2; 125 | } 126 | 127 | &:active { 128 | background-color: #b2b2b3; 129 | } 130 | } 131 | 132 | .submit { 133 | height: 24px; 134 | padding-left: 19px; 135 | padding-right: 21px; 136 | margin-bottom: 1px; 137 | margin-right: 8px; 138 | cursor: not-allowed; 139 | border: none; 140 | 141 | &:hover { 142 | box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.125); 143 | } 144 | 145 | &:active { 146 | box-shadow: inset 0 0 100px 100px rgba(0, 0, 0, 0.125); 147 | } 148 | } 149 | 150 | .spoiler { 151 | margin-right: 15px; 152 | } 153 | } 154 | } -------------------------------------------------------------------------------- /src/components/GridPost/GridPost.scss: -------------------------------------------------------------------------------- 1 | // Imports 2 | @import "../../styles/global/variables"; 3 | 4 | // General 5 | * { 6 | padding: 0; 7 | margin: 0; 8 | } 9 | 10 | // CSS 11 | .gridPost { 12 | border: 1px solid #ccc; 13 | background-color: white; 14 | 15 | &:hover { 16 | border: 1px solid #898989; 17 | } 18 | 19 | .upper { 20 | width: $contentWidth; 21 | box-sizing: border-box; 22 | border-radius: 5px; 23 | background-color: white; 24 | display: flex; 25 | cursor: pointer; 26 | } 27 | 28 | .left { 29 | width: 41px; 30 | box-sizing: border-box; 31 | padding: 6px; 32 | display: flex; 33 | flex-direction: column; 34 | justify-content: flex-start; 35 | align-items: center; 36 | border: 1px solid transparent; 37 | border-top-left-radius: 5px; 38 | border-bottom-left-radius: 5px; 39 | 40 | .upvote-btn, 41 | .downvote-btn { 42 | cursor: pointer; 43 | padding: 2px 2px 1px 2px; 44 | background-color: transparent; 45 | 46 | &:hover { 47 | background-color: #e1e2e3; 48 | border-radius: 4px; 49 | } 50 | } 51 | 52 | .upvote-btn { 53 | border: 1px solid transparent; 54 | 55 | .upvote { 56 | height: 20px; 57 | width: 19px; 58 | } 59 | } 60 | 61 | .downvote-btn { 62 | border: 1px solid transparent; 63 | 64 | .downvote { 65 | height: 20px; 66 | width: 19px; 67 | } 68 | } 69 | 70 | .votes { 71 | font-family: "IBM Regular"; 72 | font-size: 0.75em; 73 | padding-bottom: 5px; 74 | } 75 | } 76 | 77 | .right { 78 | display: flex; 79 | flex-direction: column; 80 | gap: 8px; 81 | 82 | .header { 83 | display: flex; 84 | gap: 4px; 85 | padding: 9px 2px 0px 10px; 86 | 87 | .subIcon { 88 | height: 21px; 89 | width: 21px; 90 | } 91 | 92 | .subName { 93 | font-family: "IBM"; 94 | padding-top: 2px; 95 | font-size: 12px; 96 | color: #1c1c1c; 97 | 98 | &:hover { 99 | text-decoration: underline; 100 | } 101 | } 102 | 103 | .author, 104 | .creationDate { 105 | color: #787C7E; 106 | padding-top: 2px; 107 | font-size: 0.71em; 108 | font-family: "IBM Light"; 109 | 110 | span { 111 | &:hover { 112 | text-decoration: underline; 113 | } 114 | } 115 | } 116 | 117 | .creationDate { 118 | cursor: default; 119 | } 120 | 121 | .awards { 122 | margin-left: 3px; 123 | display: flex; 124 | gap: 5px; 125 | cursor: default; 126 | 127 | .award { 128 | padding-top: 2px; 129 | height: 18px; 130 | width: 18px; 131 | cursor: default; 132 | } 133 | } 134 | } 135 | 136 | .headline { 137 | display: flex; 138 | flex-direction: column; 139 | padding: 0px 0px 0px 10px; 140 | 141 | .headline-text { 142 | font-size: 18px; 143 | font-family: "IBM Regular"; 144 | color: #222222; 145 | margin-right: 10px; 146 | 147 | button { 148 | border: 1px solid transparent; 149 | border-radius: 9999px; 150 | padding: 0px 9px 1px 9px; 151 | color: white; 152 | font-family: "IBM"; 153 | font-size: 0.65em; 154 | padding-bottom: 2px; 155 | margin-left: 5px; 156 | position: absolute; 157 | cursor: pointer; 158 | 159 | &:hover { 160 | box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.1); 161 | } 162 | } 163 | } 164 | 165 | button { 166 | border: 1px solid transparent; 167 | border-radius: 4px; 168 | padding: 0px 9px 1px 9px; 169 | color: white; 170 | font-family: "IBM"; 171 | font-size: 0.65em; 172 | padding-bottom: 2px; 173 | margin-top: 3px; 174 | cursor: pointer; 175 | 176 | &:hover { 177 | box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.1); 178 | } 179 | } 180 | } 181 | 182 | .content { 183 | display: flex; 184 | margin-top: 5px; 185 | 186 | p.src { 187 | font-size: 14px; 188 | padding-left: 10px; 189 | font-family: "Noto Sans Regular"; 190 | color: #1c1c1c; 191 | line-height: 1.5; 192 | } 193 | 194 | img.src { 195 | justify-self: center; 196 | } 197 | } 198 | 199 | .footer { 200 | display: flex; 201 | gap: 10px; 202 | margin-bottom: 5px; 203 | padding-left: 10px; 204 | 205 | .footer-div { 206 | display: flex; 207 | padding: 6px 5px 7px 5px; 208 | border: 1px solid transparent; 209 | border-radius: 3px; 210 | align-items: center; 211 | gap: 6px; 212 | 213 | &:hover { 214 | background-color: #e7e7e7; 215 | } 216 | 217 | h4 { 218 | color: #878A8C; 219 | font-size: 12px; 220 | font-family: "IBM"; 221 | } 222 | 223 | img { 224 | width: 18px; 225 | height: max-content; 226 | } 227 | } 228 | 229 | .people { 230 | display: flex; 231 | align-items: center; 232 | justify-content: center; 233 | gap: 6px; 234 | cursor: default; 235 | margin-left: 130px; 236 | padding-bottom: 1px; 237 | 238 | .people-icon { 239 | height: 23px; 240 | } 241 | 242 | .people-count { 243 | padding-bottom: 2px; 244 | font-size: 12px; 245 | color: #7C7C7C; 246 | font-family: "Noto Sans Regular"; 247 | cursor: text; 248 | } 249 | } 250 | } 251 | } 252 | } 253 | 254 | .save-div { 255 | 256 | * { 257 | pointer-events: none; 258 | } 259 | } -------------------------------------------------------------------------------- /src/components/HomeSideBar/HomeSideBar.tsx: -------------------------------------------------------------------------------- 1 | // Imports 2 | import React, { useState, MouseEventHandler } from 'react'; 3 | // Component Imports 4 | import Imprint from '../Imprint/Imprint'; 5 | import BackToTopButton from '../BackToTopButton/BackToTopButton'; 6 | // Type Imports 7 | import { Subreddits } from '../../types/types'; 8 | // CSS Imports 9 | import './HomeSideBar.scss'; 10 | 11 | export interface HomeSideBarProps { 12 | subreddits: Subreddits, 13 | topSubreddits: Subreddits, 14 | loginStatus: boolean, 15 | loginModalState: string 16 | setLoginModalState: any, 17 | handleSubMembership: React.MouseEventHandler, 18 | enablePremium: MouseEventHandler, 19 | handleNavigate: MouseEventHandler, 20 | navToSubmit: MouseEventHandler, 21 | } 22 | 23 | export default function HomeSideBar (props: HomeSideBarProps) { 24 | const { 25 | subreddits, 26 | topSubreddits, 27 | loginStatus, 28 | setLoginModalState, 29 | loginModalState, 30 | handleSubMembership, 31 | enablePremium, 32 | handleNavigate, 33 | navToSubmit, 34 | } = props; 35 | 36 | // Local state 37 | const [viewAll, setViewAll] = useState(false); 38 | 39 | // Set visibility on subreddit list 40 | const handleView = (e: React.MouseEvent) => { 41 | setViewAll(!viewAll); 42 | } 43 | 44 | return ( 45 |
46 | 47 |
48 |
49 | banner 50 |

Today's Top Growing Communities

51 |
52 | 53 |
54 | {subreddits.map((subreddit, i) => { 55 | if (viewAll && i > 9) { 56 | return; 57 | } else if (viewAll === false && i > 4) { 58 | return; 59 | } 60 | return
65 |

{i + 1}

66 | top 67 | 68 | logo 69 |

{"r/" + subreddit.title}

70 | 71 | 77 |
78 | })} 79 | 80 | 81 |
82 | 83 | 84 | 85 | 86 |
87 |
88 |
89 | 90 |
91 |
92 | premium 93 |
94 |

Reddit Premium

95 |

The best Reddit experience, with monthly Coins

96 |
97 |
98 | 99 | 100 |
101 | 102 |
103 | banner 104 | avatar 105 |

Home

106 |

Your personal Reddit frontpage. Come here to check in with your favorite communities.

107 | 108 | 109 | 110 |
111 | 112 | 113 | 114 |
115 | ); 116 | } 117 | 118 | -------------------------------------------------------------------------------- /src/components/Imprint/Imprint.scss: -------------------------------------------------------------------------------- 1 | // CSS 2 | .imprint-container { 3 | margin-top: 1px; 4 | width: 312px; 5 | height: 263px; 6 | background-color: white; 7 | border: 1px solid #ccc; 8 | border-radius: 4px; 9 | box-sizing: border-box; 10 | display: flex; 11 | flex-direction: column; 12 | padding: 10px 0px 10px 15px; 13 | position: sticky; 14 | top: 57px; 15 | margin-bottom: 30px; 16 | } 17 | 18 | .first, 19 | .second, 20 | .third, 21 | .fourth { 22 | display: flex; 23 | width: 312px; 24 | 25 | .left { 26 | width: 46.5%; 27 | } 28 | 29 | .left, 30 | .right { 31 | display: flex; 32 | flex-direction: column; 33 | gap: 5px; 34 | 35 | .imprint-content { 36 | font-family: "IBM Light"; 37 | font-size: 13px; 38 | color: #1A1A1B; 39 | cursor: pointer; 40 | 41 | &:hover { 42 | text-decoration: underline; 43 | } 44 | } 45 | } 46 | } 47 | 48 | .line { 49 | width: 97.25%; 50 | align-self: center; 51 | height: 1px; 52 | background-color: #edeff1; 53 | color: #edeff1; 54 | margin: 10px 0px; 55 | margin-right: 16px; 56 | } 57 | 58 | .line.lastline { 59 | margin-bottom: 30px; 60 | } 61 | 62 | .imprint-credits { 63 | font-family: "IBM Light"; 64 | font-size: 13px; 65 | color: #1A1A1B; 66 | position: absolute; 67 | bottom: 12px; 68 | left: 12px; 69 | } -------------------------------------------------------------------------------- /src/components/Imprint/Imprint.tsx: -------------------------------------------------------------------------------- 1 | // Imports 2 | import React from 'react'; 3 | // CSS Imports 4 | import './Imprint.scss'; 5 | 6 | export interface ImprintProps { 7 | } 8 | 9 | export default function Imprint (props: ImprintProps) { 10 | return ( 11 |
12 |
13 |
14 |
Imprint
15 |
Report NetzDG Content
16 |
17 | 18 |
19 |
Help
20 |
Transparency Report
21 |
22 |
23 | 24 |
25 | 26 |
27 |
28 |
User Agreement
29 |
Privacy Policy
30 |
31 | 32 |
33 |
Content Policy
34 |
Moderator Code of Conduct
35 |
36 |
37 | 38 |
39 | 40 |
41 |
42 |
English
43 |
Français
44 |
Italiano
45 |
46 | 47 |
48 |
Deutsch
49 |
Español
50 |
Português
51 |
52 |
53 | 54 |
55 | 56 |
No rights reserved. Built for educational purposes.
57 |
58 | ); 59 | } 60 | -------------------------------------------------------------------------------- /src/components/LoginModal/LoginModal.scss: -------------------------------------------------------------------------------- 1 | * { 2 | -webkit-user-drag: none; 3 | user-select: none; 4 | -moz-user-select: none; 5 | -webkit-user-select: none; 6 | -ms-user-select: none; 7 | } 8 | 9 | .modalBackground { 10 | background-color: rgba(0, 0, 0, 0.4); 11 | position: absolute; 12 | height: 100vh; 13 | width: 100vw; 14 | z-index: 12; 15 | } 16 | 17 | .loginModal { 18 | position: absolute; 19 | top: 50%; 20 | left: 50%; 21 | transform: translate(-50%, -50%); 22 | z-index: 14; 23 | display: flex; 24 | background-color: #fff; 25 | border-radius: 4px; 26 | width: 850px; 27 | box-shadow: 1px 7px 20px 2px rgba(0, 0, 0, 0.4); 28 | } 29 | 30 | .loginBackground { 31 | border-top-left-radius: 4px; 32 | border-bottom-left-radius: 4px; 33 | height: 650px; 34 | width: 131px; 35 | } 36 | 37 | .modalContent { 38 | display: flex; 39 | flex-direction: column; 40 | padding: 48px 24px; 41 | 42 | #closed { 43 | border: 1px solid transparent; 44 | position: absolute; 45 | height: 20px; 46 | width: 20px; 47 | top: 2.3%; 48 | right: 1.75%; 49 | cursor: pointer; 50 | } 51 | 52 | .cross { 53 | height: 20px; 54 | position: absolute; 55 | right: 1.9%; 56 | top: 2.5%; 57 | fill: #808080; 58 | pointer-events: none; 59 | } 60 | 61 | .heading { 62 | color: #1A1A1B; 63 | font-size: 18px; 64 | font-family: "IBM Regular"; 65 | margin-bottom: 8px; 66 | } 67 | 68 | .policy { 69 | color: #1A1A1B; 70 | font-size: 12px; 71 | font-family: "Noto Sans Regular"; 72 | 73 | span { 74 | color: #0079d3; 75 | cursor: pointer; 76 | &:hover { 77 | color: #3394dc; 78 | } 79 | } 80 | } 81 | 82 | button.googleButton { 83 | margin-top: 57px; 84 | margin-bottom: 10px; 85 | } 86 | 87 | button { 88 | background-color: white; 89 | border: 1px solid #dadce0; 90 | display: flex; 91 | align-items: center; 92 | font-size: 14px; 93 | font-family: "IBM"; 94 | color: #1A1A1B; 95 | height: 40px; 96 | width: 20em; 97 | box-sizing: border-box; 98 | padding: 2px 12px; 99 | cursor: pointer; 100 | border-radius: 20px; 101 | transition: 0.25s all; 102 | &:hover { 103 | border-color: #d2e3fc; 104 | background: rgba(66,133,244,.04); 105 | } 106 | &:active { 107 | background: rgba(66,133,244,.09); 108 | } 109 | 110 | .google, 111 | .apple { 112 | margin-right: 45px; 113 | height: 20px; 114 | } 115 | .apple { 116 | padding-top: 3px; 117 | margin-right: 48px !important; 118 | } 119 | } 120 | 121 | .or { 122 | color: #878A8C; 123 | font-size: 14px; 124 | font-family: "IBM Light"; 125 | margin: 32px 122px 28px 128px; 126 | position: relative; 127 | 128 | &::before { 129 | content: ""; 130 | position: absolute; 131 | left: -86.25%; 132 | top: 9px; 133 | width: 7.95em; 134 | height: 1px; 135 | background-color: #edeff1; 136 | } 137 | &::after { 138 | content: ""; 139 | position: absolute; 140 | left: 19%; 141 | top: 9px; 142 | width: 9em; 143 | height: 1px; 144 | background-color: #edeff1; 145 | } 146 | } 147 | 148 | div.password { 149 | margin-bottom: 2px; 150 | } 151 | 152 | .container { 153 | position: relative; 154 | 155 | .inputField { 156 | margin-bottom: 12px; 157 | height: 48px; 158 | box-sizing: border-box; 159 | border: 1px solid rgba(0, 0, 0, 0.1); 160 | border-radius: 4px; 161 | padding: 24px 12px 10px 12px; 162 | font-family: "Noto Sans Regular"; 163 | background-color: rgb(252, 252, 251); 164 | outline: 0px; 165 | width: 21em; 166 | transition: 0.2s ease-in-out all; 167 | &:hover { 168 | background-color: white; 169 | border: 1px solid rgba(0, 0, 0, 0.2); 170 | } 171 | &:active { 172 | background-color: white; 173 | border-color: rgb(36, 160, 237); 174 | } 175 | } 176 | 177 | .circle { 178 | width: 5px; 179 | height: 5px; 180 | border-radius: 45%; 181 | background-color: #24a0ed; 182 | position: absolute; 183 | pointer-events: none; 184 | top: 39%; 185 | } 186 | 187 | .label { 188 | position: absolute; 189 | pointer-events: none; 190 | left: 12px; 191 | top: 18px; 192 | font-size: 10px; 193 | font-family: "Noto Sans Bold"; 194 | transition: 0.3s ease all; 195 | color: #a5a5a4; 196 | letter-spacing: 0.025em; 197 | } 198 | 199 | .inputField:hover ~ .label, 200 | .inputField:focus ~ .label, 201 | .inputField:not(:focus):valid ~ .label, 202 | .inputField:not(:hover):valid ~ .label { 203 | top: 8px; 204 | bottom: 10px; 205 | left: 12px; 206 | font-size: 8px; 207 | opacity: 1; 208 | } 209 | } 210 | 211 | button.anmelden, 212 | button.demo { 213 | font-family: "Noto Sans Bold"; 214 | font-size: 14px; 215 | display: flex; 216 | align-items: center; 217 | justify-content: center; 218 | background-color: #0079d3; 219 | color: #fff; 220 | border-radius: 999px; 221 | line-height: 18px; 222 | margin-bottom: 6px; 223 | &:hover { 224 | background-color: #1484d7; 225 | } 226 | &:active { 227 | background-color: #3d99de; 228 | } 229 | } 230 | 231 | p.suggestion { 232 | margin-top: 18px; 233 | font-size: 12px; 234 | font-family: "Noto Sans Regular"; 235 | color: #1A1A1B; 236 | 237 | span { 238 | color: #0079d3; 239 | font-family: "IBM"; 240 | cursor: pointer; 241 | 242 | &:hover { 243 | color: rgb(51, 148, 220); 244 | } 245 | } 246 | } 247 | } 248 | 249 | .typecheck { 250 | font-size: 11px; 251 | font-family: "Noto Sans"; 252 | color: red; 253 | margin-top: -8px; 254 | margin-bottom: 5px; 255 | margin-left: 4px; 256 | } 257 | 258 | .second-typecheck { 259 | margin-bottom: 12px; 260 | } 261 | -------------------------------------------------------------------------------- /src/components/LoginModal/LoginModal.tsx: -------------------------------------------------------------------------------- 1 | // Imports 2 | import React, { ChangeEventHandler, MouseEventHandler } from 'react'; 3 | // Import SVGs 4 | import { ReactComponent as Google } from "../../resources/images/google.svg"; 5 | import { ReactComponent as Apple } from "../../resources/images/apple.svg"; 6 | import { ReactComponent as Cross } from "../../resources/images/cross.svg"; 7 | // CSS Imports 8 | import './LoginModal.scss'; 9 | 10 | export interface LoginModalProps { 11 | loginModalState: string, 12 | hoverState: { 13 | username: boolean, 14 | password: boolean 15 | }, 16 | userName: string, 17 | password: string, 18 | loginStatus: boolean, 19 | showAuthAlert: { 20 | username: boolean, 21 | password: boolean, 22 | usernameDoesNotExist: boolean, 23 | wrongPassword: boolean, 24 | usernameTaken: boolean 25 | }, 26 | handleLoginInput: ChangeEventHandler, 27 | handleLoginModal: MouseEventHandler, 28 | handleHover: MouseEventHandler 29 | handleLogin: MouseEventHandler 30 | } 31 | 32 | export default function LoginModal (props: LoginModalProps) { 33 | const { 34 | loginModalState, 35 | hoverState, 36 | userName, 37 | password, 38 | showAuthAlert, 39 | handleLogin, 40 | handleLoginInput, 41 | handleLoginModal, 42 | handleHover 43 | } = props; 44 | 45 | return ( 46 |
47 |
48 | 49 |
50 | 51 |
52 | background 57 |
58 | 64 |

{loginModalState === "login" ? "Login" : "Sign Up"}

65 |

If you continue, you agree to our User Agreements and Privacy Policy.

66 | 67 | 71 | 72 | 76 | 77 |

OR

78 | 79 |
80 | 81 | {loginModalState === "login" ? "USERNAME" : "PREFERED USERNAME"} 82 |
83 |
84 | {showAuthAlert.username &&

! Username must contain 4 characters or more

} 85 | {showAuthAlert.usernameDoesNotExist &&

! A user with this username does not exist

} 86 | {showAuthAlert.usernameTaken &&

! This username is already taken

} 87 |
88 | 89 | {loginModalState === "login" ? "PASSWORD" : "PREFERED PASSWORD"} 90 |
91 |
92 | {showAuthAlert.password &&

! Password must contain 6 characters or more

} 93 | {showAuthAlert.wrongPassword &&

! The entered password is wrong

} 94 | 95 | 98 | 101 | 102 |

{loginModalState === "login" ? "New to Reddit?" : "Already a Redditor*ess?"} {loginModalState === "login" ? "SIGN UP" : "LOGIN"}

103 |
104 |
105 |
106 | ); 107 | } 108 | -------------------------------------------------------------------------------- /src/components/SortBar/SortBar.scss: -------------------------------------------------------------------------------- 1 | // Imports 2 | @import "../../styles/global/variables"; 3 | 4 | // CSS 5 | .sortBar { 6 | display: flex; 7 | width: $contentWidth; 8 | justify-content: space-between; 9 | align-items: center; 10 | background-color: white; 11 | border: 1px solid #ccc; 12 | box-sizing: border-box; 13 | margin-bottom: 16px; 14 | border-radius: 4px; 15 | height: 61px; 16 | 17 | .left { 18 | display: flex; 19 | align-items: center; 20 | padding-left: 13px; 21 | gap: 9px; 22 | } 23 | 24 | .left .sortButton, 25 | .right .sortButton { 26 | margin-top: 1px; 27 | display: flex; 28 | justify-content: center; 29 | align-items: center; 30 | background-color: white; 31 | padding: 4px 10px 5px 8px; 32 | border-radius: 20px; 33 | border: none; 34 | gap: 8px; 35 | cursor: pointer; 36 | &:active { 37 | background-color: #c9c9c9 !important; 38 | } 39 | 40 | .expand { 41 | height: 7px !important; 42 | padding-top: 2px; 43 | } 44 | 45 | &#more { 46 | height: 34px; 47 | 48 | img { 49 | width: 1.525em; 50 | height: 0.425em; 51 | } 52 | } 53 | 54 | &:hover { 55 | background-color: #f6f7f8; 56 | } 57 | &.selected { 58 | background-color: #f6f7f8; 59 | } 60 | 61 | .icon { 62 | height: 1.525em; 63 | } 64 | 65 | p { 66 | padding-top: 2px; 67 | font-family: "Noto Sans Bold"; 68 | font-size: 14px; 69 | padding-bottom: 4px; 70 | color: #878A8C; 71 | } 72 | 73 | p.selected { 74 | color: #0079D3; 75 | } 76 | } 77 | } 78 | 79 | button.sortButton #layout { 80 | height: 20px; 81 | } 82 | 83 | .right { 84 | margin-right: 12px; 85 | } -------------------------------------------------------------------------------- /src/components/SortBar/SortBar.tsx: -------------------------------------------------------------------------------- 1 | // Imports 2 | import * as React from 'react'; 3 | // CSS Imports 4 | import './SortBar.scss'; 5 | 6 | export interface SortBarProps { 7 | currentSort: string, 8 | setSort: React.MouseEventHandler 9 | } 10 | 11 | export default function SortBar (props: SortBarProps) { 12 | const { 13 | currentSort, 14 | setSort 15 | } = props; 16 | 17 | return ( 18 |
19 |
20 | 24 | 28 | 29 | 33 | 34 | 38 | 39 | 42 |
43 | 44 |
45 | 49 |
50 |
51 | ); 52 | } 53 | -------------------------------------------------------------------------------- /src/components/SubredditHeadline/SubredditHeadline.scss: -------------------------------------------------------------------------------- 1 | // CSS 2 | .subredditHeadline { 3 | background-color: white; 4 | height: 100px; 5 | width: 100vw; 6 | box-sizing: border-box; 7 | margin-top: -4px; 8 | position: relative; 9 | z-index: 7; 10 | padding-left: 464px; 11 | 12 | .headlineTop { 13 | display: flex; 14 | gap: 28px; 15 | 16 | .iconContainer { 17 | width: 77px; 18 | height: 77px; 19 | display: flex; 20 | justify-content: center; 21 | align-items: center; 22 | border: 1px solid white; 23 | background-color: white; 24 | border-radius: 9999px; 25 | position: absolute; 26 | top: -15px; 27 | 28 | .icon { 29 | width: 70px; 30 | height: 70px; 31 | padding-right: 0.01em; 32 | cursor: pointer; 33 | } 34 | } 35 | 36 | .headlineTitle { 37 | padding-top: 8px; 38 | margin-left: 96px; 39 | 40 | h1 { 41 | color: #1c1c1c; 42 | font-size: 27px; 43 | font-family: "IBM"; 44 | letter-spacing: 0.015em; 45 | margin-bottom: 4px; 46 | } 47 | 48 | h3 { 49 | color: #7c7c7c; 50 | font-size: 14px; 51 | font-family: "IBM Light"; 52 | letter-spacing: 0.02em; 53 | } 54 | } 55 | 56 | .join, 57 | .leave { 58 | margin-top: 10px; 59 | display: flex; 60 | color: white; 61 | padding-bottom: 2px; 62 | font-size: 14px; 63 | font-family: "Noto Sans Bold"; 64 | justify-content: center; 65 | align-items: center; 66 | width: 96px; 67 | border: 1px solid transparent; 68 | border-radius: 9999px; 69 | height: 32px; 70 | cursor: pointer; 71 | 72 | &:hover { 73 | box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.1); 74 | } 75 | 76 | &:active { 77 | box-shadow: inset 0 0 100px 100px rgba(0, 0, 0, 0.1); 78 | } 79 | } 80 | } 81 | 82 | .headlineBottom { 83 | display: flex; 84 | gap: 10px; 85 | position: absolute; 86 | bottom: -4px; 87 | left: 463px; 88 | 89 | .anchor { 90 | cursor: pointer; 91 | padding: 8px; 92 | font-size: 14px; 93 | color: #737373; 94 | font-family: "IBM"; 95 | position: relative; 96 | 97 | &:hover { 98 | color: #1c1c1c !important; 99 | } 100 | 101 | .anchorLine { 102 | position: absolute; 103 | width: 100%; 104 | height: 3px; 105 | left: 0px; 106 | bottom: 4px; 107 | } 108 | } 109 | } 110 | } 111 | 112 | .subredditContent { 113 | padding-top: 20px; 114 | margin-left: 464px; 115 | } 116 | 117 | .subredditHeadline::-webkit-scrollbar { 118 | display: none; 119 | } -------------------------------------------------------------------------------- /src/components/SubredditHeadline/SubredditHeadline.tsx: -------------------------------------------------------------------------------- 1 | // Imports 2 | import * as React from 'react'; 3 | // Type imports 4 | import { Subreddit } from '../../types/types'; 5 | // CSS Imports 6 | import './SubredditHeadline.scss'; 7 | 8 | export interface SubredditHeadlineProps { 9 | currentSub: Subreddit | undefined, 10 | currentAnchor: number | undefined, 11 | standardTheme: any, 12 | loginStatus: boolean, 13 | communityTheme: boolean, 14 | selectAnchor: React.MouseEventHandler 15 | handleSubMembership: React.MouseEventHandler 16 | } 17 | 18 | export default function SubredditHeadline (props: SubredditHeadlineProps) { 19 | const { 20 | currentSub, 21 | currentAnchor, 22 | standardTheme, 23 | loginStatus, 24 | communityTheme, 25 | selectAnchor, 26 | handleSubMembership 27 | } = props; 28 | 29 | return ( 30 |
31 |
32 |
33 | icon 34 |
35 |
36 |

{currentSub?.officialTitle}

37 |

{"r/" + currentSub?.title}

38 |
39 | 40 |
41 |
42 | {currentSub?.anchors?.map((anchor, i) => { 43 | return
44 | {anchor?.title} 45 |
46 |
47 | })} 48 |
49 |
50 | ); 51 | } 52 | -------------------------------------------------------------------------------- /src/components/SubredditSideBar/SubredditSideBar.scss: -------------------------------------------------------------------------------- 1 | // CSS 2 | .sidebar { 3 | display: flex; 4 | flex-direction: column; 5 | min-height: 100vh; 6 | gap: 16px; 7 | margin-bottom: 20px; 8 | 9 | .aboutCommunity { 10 | background-color: white; 11 | border: 1px solid #ccc; 12 | width: 312px; 13 | box-sizing: border-box; 14 | border-radius: 4px; 15 | 16 | .head { 17 | display: flex; 18 | justify-content: space-between; 19 | padding: 14px 12px 12px 12px; 20 | align-items: center; 21 | border-radius: 4px; 22 | border-bottom-left-radius: 0px; 23 | border-bottom-right-radius: 0px; 24 | 25 | h3 { 26 | font-size: 14px; 27 | font-family: "IBM Regular"; 28 | letter-spacing: 0.03em; 29 | color: #ffffff; 30 | padding-bottom: 2px; 31 | cursor: text; 32 | } 33 | 34 | .more { 35 | height: .2575em; 36 | padding: 8px 4px; 37 | border: 1px transparent; 38 | border-radius: 2px; 39 | cursor: pointer; 40 | transition: 0.15s all; 41 | 42 | &:hover { 43 | background-color: rgba(0, 0, 0, 0.15) 44 | } 45 | } 46 | } 47 | 48 | .about { 49 | font-size: 14px; 50 | line-height: 1.475; 51 | padding: 12px 16px 0px 11px; 52 | font-family: "Noto Sans Regular"; 53 | color: #1a1a1b; 54 | cursor: text; 55 | } 56 | 57 | .createdAt { 58 | display: flex; 59 | cursor: text; 60 | gap: 8px; 61 | padding: 11px 16px 0px 12px; 62 | 63 | .cake { 64 | height: 1.1387em; 65 | width: 1.19em; 66 | } 67 | 68 | p { 69 | font-size: 14px; 70 | font-family: "Noto Sans Regular"; 71 | color: #737373; 72 | } 73 | } 74 | 75 | .memberContainer { 76 | display: flex; 77 | justify-content: flex-start; 78 | gap: 24px; 79 | margin: 17px 14px 16px 11px; 80 | padding: 16px 0px; 81 | border-top: 1px solid rgba(26,26,27,0.07); 82 | border-bottom: 1px solid rgba(26,26,27,0.07); 83 | 84 | .memberCount p, 85 | .onlineCount p, 86 | .size p { 87 | font-size: 16px; 88 | font-family: "IBM"; 89 | color: #1a1a1b; 90 | margin-bottom: 3px; 91 | cursor: pointer; 92 | } 93 | 94 | .memberCount h5, 95 | .onlineCount h5, 96 | .size h5 { 97 | font-size: 12px; 98 | font-family: "IBM Light"; 99 | color: #737373; 100 | cursor: text; 101 | } 102 | } 103 | 104 | .createPost { 105 | padding: 5px 0px 6px 0px; 106 | border: 1px solid transparent; 107 | border-radius: 9999px; 108 | width: 92.2%; 109 | margin: 0px 12px; 110 | font-size: 14px; 111 | color: white; 112 | font-family: "Noto Sans Bold"; 113 | cursor: pointer; 114 | } 115 | } 116 | } 117 | 118 | .postHead { 119 | display: flex; 120 | gap: 9px; 121 | align-items: center; 122 | padding: 11px 12px 1px 12px; 123 | cursor: pointer; 124 | 125 | * { 126 | pointer-events: none; 127 | } 128 | 129 | .head-img { 130 | height: 52px; 131 | } 132 | 133 | .head-p { 134 | font-size: 16px; 135 | font-family: "IBM"; 136 | color: #1a1a1b; 137 | } 138 | } 139 | 140 | .user { 141 | cursor: pointer; 142 | } -------------------------------------------------------------------------------- /src/components/SubredditSideBar/SubredditSideBar.tsx: -------------------------------------------------------------------------------- 1 | // Imports 2 | import React, { MouseEventHandler } from 'react'; 3 | // Type Imports 4 | import { Post, Subreddit } from '../../types/types'; 5 | // SVG Imports 6 | import { ReactComponent as Pen } from "../../resources/images/pen.svg"; 7 | // Component Imports 8 | import Imprint from '../Imprint/Imprint'; 9 | import BackToTopButton from '../BackToTopButton/BackToTopButton'; 10 | // CSS Imports 11 | import './SubredditSideBar.scss'; 12 | 13 | export interface SubredditSideBarProps { 14 | communityTheme: boolean, 15 | submitPage: boolean, 16 | currentSub: Subreddit | undefined, 17 | standardTheme: any, 18 | loginStatus: boolean, 19 | randomIntToString: string, 20 | userName: string, 21 | communityOptions: boolean, 22 | currentPost: Post | undefined, 23 | switchCommunityOptions: MouseEventHandler, 24 | handleNavigate: MouseEventHandler, 25 | navToProfile: MouseEventHandler, 26 | navToSubmit: MouseEventHandler, 27 | switchCommunityTheme: MouseEventHandler, 28 | expandRule: MouseEventHandler, 29 | } 30 | 31 | export default function SubredditSideBar (props: SubredditSideBarProps) { 32 | const { 33 | communityTheme, 34 | currentSub, 35 | currentPost, 36 | standardTheme, 37 | submitPage, 38 | loginStatus, 39 | randomIntToString, 40 | userName, 41 | navToProfile, 42 | handleNavigate, 43 | navToSubmit, 44 | switchCommunityTheme, 45 | expandRule, 46 | switchCommunityOptions, 47 | communityOptions 48 | } = props; 49 | 50 | return ( 51 |
52 |
53 |
54 | {currentPost === undefined ?

About Community

: null} 55 | {currentPost === undefined ? more : null} 56 |
57 | 58 | {currentPost !== undefined && 59 |
60 | icon 61 |

r/{currentPost.subreddit}

62 |
63 | } 64 |

{currentSub?.about}

65 |
66 | cake 67 |

Created {currentSub?.creationDate}

68 |
69 | 70 |
71 |
72 |

{currentSub?.members}

73 |
Members
74 |
75 |
76 |
77 |
78 |

{currentSub?.online}

79 |
80 |
currently online
81 |
82 |
83 |

{currentSub?.bySize}

84 |
Ranked by Size
85 |
86 |
87 | 88 | {submitPage === false && } 91 | 92 |
93 |
94 |
USER FLAIR PREVIEW
95 | 101 |
102 | 103 |
104 | avatar 105 |

{userName}

106 |
107 |
108 | 109 |
110 | 114 | 115 |
116 |
117 | eye 118 |

Community theme

119 |
120 | 123 |
124 |
125 |
126 | 127 | 128 | 129 |
130 |
131 |

r/{currentSub?.title} Rules

132 |
133 | 134 | {currentSub?.rules.map((rule, i) => { 135 | return ( 136 |
137 |
138 |
139 |

{rule?.number + `. `}

140 |

{rule?.title}

141 |
142 | expand 143 |
144 |
145 | {rule?.desc} 146 |
147 |
148 | ) 149 | })} 150 |
151 | 152 | 153 | 154 | {submitPage === false &&
155 |
156 |

Search by flair

157 |
158 | 159 |
160 | {currentSub?.flairs.map((flair, i) => { 161 | return ( 162 | 165 | ) 166 | })} 167 |
168 |
} 169 | 170 | 171 | 172 | {submitPage === false && } 173 | {submitPage === false && } 174 |
175 | ); 176 | } 177 | -------------------------------------------------------------------------------- /src/containers/Grid/Grid.scss: -------------------------------------------------------------------------------- 1 | //CSS 2 | 3 | .grid { 4 | display: flex; 5 | flex-direction: column; 6 | gap: 10px; 7 | margin-bottom: 60px; 8 | overflow: hidden; 9 | } -------------------------------------------------------------------------------- /src/containers/Home/Home.scss: -------------------------------------------------------------------------------- 1 | // General 2 | * { 3 | margin: 0; 4 | padding: 0; 5 | } 6 | 7 | // Imports 8 | @import '../../styles/global/variables'; 9 | 10 | // CSS 11 | .home { 12 | background-color: $mainPageBackground; 13 | display: flex; 14 | gap: 24px; 15 | padding-top: 68px; 16 | 17 | .feed { 18 | margin-left: 464px; 19 | } 20 | } 21 | 22 | .lds-ring { 23 | display: inline-block; 24 | position: relative; 25 | width: 20px; 26 | margin-top: 2px; 27 | height: 20px; 28 | } 29 | .lds-ring div { 30 | box-sizing: border-box; 31 | display: block; 32 | position: absolute; 33 | width: 15px; 34 | height: 15px; 35 | margin: 2px; 36 | border: 2px solid #fff; 37 | border-radius: 50%; 38 | animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; 39 | border-color: #fff transparent transparent transparent; 40 | } 41 | .lds-ring div:nth-child(1) { 42 | animation-delay: -0.45s; 43 | } 44 | .lds-ring div:nth-child(2) { 45 | animation-delay: -0.3s; 46 | } 47 | .lds-ring div:nth-child(3) { 48 | animation-delay: -0.15s; 49 | } 50 | @keyframes lds-ring { 51 | 0% { 52 | transform: rotate(0deg); 53 | } 54 | 100% { 55 | transform: rotate(360deg); 56 | } 57 | } 58 | 59 | .loading { 60 | background-color: #0079d3; 61 | border: 1px solid transparent; 62 | border-radius: 9999px; 63 | width: 150px; 64 | padding: 4px 14px; 65 | gap: 8px; 66 | font-family: "Noto Sans Bold"; 67 | color: white; 68 | font-size: 14px; 69 | display: flex; 70 | align-items: center; 71 | justify-content: center; 72 | align-self: center; 73 | margin-bottom: 14px; 74 | margin-top: -30px; 75 | margin-left: auto; 76 | margin-right: auto; 77 | cursor: pointer; 78 | 79 | &:hover { 80 | background-color: #0781df; 81 | } 82 | } 83 | 84 | -------------------------------------------------------------------------------- /src/containers/Home/Home.tsx: -------------------------------------------------------------------------------- 1 | // Imports 2 | import React, { MouseEventHandler, Dispatch, SetStateAction, useRef, useEffect, useState } from 'react'; 3 | // Component Imports 4 | import CreatePost from '../../components/CreatePost/CreatePost'; 5 | import SortBar from '../../components/SortBar/SortBar'; 6 | import HomeSideBar from '../../components/HomeSideBar/HomeSideBar'; 7 | import Grid from '../Grid/Grid'; 8 | // Type imports 9 | import { Post, Subreddit, Subreddits } from '../../types/types'; 10 | // Utility Imports 11 | import userArray from '../../utils/userArray'; 12 | // CSS Imports 13 | import './Home.scss'; 14 | 15 | export interface HomeProps { 16 | randomIntToString: string, 17 | userName: string, 18 | currentSort: string, 19 | currentSub: Subreddit | undefined, 20 | subreddits: Subreddits, 21 | topSubreddits: Subreddits, 22 | renderNum: number, 23 | currentEditedComment: string, 24 | writeNestedComment: any, 25 | editComment: any, 26 | editNestedComment: any, 27 | loginStatus: boolean, 28 | setLoginModalState: any, 29 | loginModalState: string, 30 | posts: Post[], 31 | currentPost: Post | undefined, 32 | mainComment: string, 33 | writeComment: any, 34 | setRenderNum: Dispatch>, 35 | setIndex: Dispatch> 36 | setSort: React.MouseEventHandler; 37 | savePost: MouseEventHandler, 38 | enablePremium: MouseEventHandler, 39 | submitNestedComment: MouseEventHandler 40 | handleSubMembership: React.MouseEventHandler, 41 | handleNavigate: MouseEventHandler, 42 | handleLike: MouseEventHandler, 43 | navToSubmit: MouseEventHandler, 44 | openPost: MouseEventHandler, 45 | submitComment: MouseEventHandler, 46 | handleLikeComment: MouseEventHandler, 47 | handleNestedComment: MouseEventHandler, 48 | navToUserProfile: MouseEventHandler, 49 | navToProfile: MouseEventHandler, 50 | } 51 | 52 | export default function Home (props: HomeProps) { 53 | const ref = useRef(null) 54 | 55 | const { 56 | randomIntToString, 57 | userName, 58 | currentSort, 59 | currentSub, 60 | renderNum, 61 | currentPost, 62 | mainComment, 63 | writeComment, 64 | subreddits, 65 | topSubreddits, 66 | currentEditedComment, 67 | writeNestedComment, 68 | editComment, 69 | editNestedComment, 70 | loginStatus, 71 | setLoginModalState, 72 | loginModalState, 73 | posts, 74 | savePost, 75 | submitNestedComment, 76 | handleNestedComment, 77 | handleLikeComment, 78 | submitComment, 79 | openPost, 80 | handleSubMembership, 81 | handleLike, 82 | handleNavigate, 83 | navToSubmit, 84 | enablePremium, 85 | setIndex, 86 | navToUserProfile, 87 | setSort, 88 | navToProfile, 89 | setRenderNum, 90 | } = props; 91 | 92 | useEffect(() => { 93 | if (!ref.current) return 94 | 95 | const cachedRef = ref.current 96 | const observer = new IntersectionObserver(() => { 97 | setTimeout(() => setRenderNum((prev) => prev + 2), 750); 98 | }) 99 | 100 | observer.observe(cachedRef) 101 | }, [ref]) 102 | 103 | return ( 104 |
105 |
106 | {userArray.findIndex(user => user.username === userName) === -1 && } 112 | 113 | 117 | 118 | 146 | 147 |
148 |
149 | Loading more... 150 |
151 |
152 | 153 |
154 | 165 |
166 |
167 | ); 168 | } 169 | 170 | 171 | -------------------------------------------------------------------------------- /src/containers/SubredditPage/SubredditPage.tsx: -------------------------------------------------------------------------------- 1 | // Imports 2 | import React, { MouseEventHandler, useEffect, useState, Dispatch, SetStateAction } from 'react'; 3 | // Hook Imports 4 | import { useLocation } from 'react-router-dom'; 5 | // Component Imports 6 | import CreatePost from '../../components/CreatePost/CreatePost'; 7 | import SubredditHeadline from '../../components/SubredditHeadline/SubredditHeadline'; 8 | import Grid from '../Grid/Grid'; 9 | import SortBar from '../../components/SortBar/SortBar'; 10 | import Imprint from '../../components/Imprint/Imprint'; 11 | import SubredditSideBar from '../../components/SubredditSideBar/SubredditSideBar'; 12 | // Type Imports 13 | import { Subreddits, Subreddit, Post } from '../../types/types'; 14 | // SVG Imports 15 | import { ReactComponent as Pen } from "../../resources/images/pen.svg"; 16 | // CSS Imports 17 | import './SubredditPage.scss'; 18 | 19 | export interface SubredditPageProps { 20 | randomIntToString: string, 21 | userName: string, 22 | currentSort: string, 23 | subreddits: Subreddits, 24 | topSubreddits: Subreddits, 25 | loginStatus: boolean, 26 | submitPage: boolean, 27 | setLoginModalState: any, 28 | identifyCurrentSub: any, 29 | currentSub: Subreddit | undefined, 30 | currentAnchor: number | undefined, 31 | loginModalState: string, 32 | posts: Post[], 33 | currentPost: Post | undefined, 34 | communityTheme: boolean, 35 | currentEditedComment: string, 36 | communityOptions : boolean, 37 | mainComment: string, 38 | writeComment: any, 39 | writeNestedComment: any, 40 | editComment: any, 41 | editNestedComment: any, 42 | handleSubMembership: React.MouseEventHandler, 43 | expandRule: MouseEventHandler, 44 | selectAnchor: React.MouseEventHandler, 45 | setSort: React.MouseEventHandler; 46 | navToUserProfile: MouseEventHandler, 47 | setIndex: Dispatch> 48 | handleNavigate: MouseEventHandler, 49 | navToSubmit: MouseEventHandler, 50 | openPost: MouseEventHandler, 51 | navToProfile: MouseEventHandler, 52 | handleLike: MouseEventHandler, 53 | submitNestedComment: MouseEventHandler 54 | switchCommunityTheme: MouseEventHandler, 55 | setCurrentSub: any, 56 | submitComment: MouseEventHandler, 57 | handleLikeComment: MouseEventHandler, 58 | savePost: MouseEventHandler, 59 | switchCommunityOptions: MouseEventHandler, 60 | handleNestedComment: MouseEventHandler, 61 | standardTheme: { 62 | buttonColor: string, 63 | headerColor: string, 64 | banner: string 65 | } 66 | } 67 | 68 | export default function SubredditPage (props: SubredditPageProps) { 69 | const location = useLocation(); 70 | const { 71 | randomIntToString, 72 | userName, 73 | currentEditedComment, 74 | currentSort, 75 | currentPost, 76 | subreddits, 77 | topSubreddits, 78 | loginStatus, 79 | loginModalState, 80 | setLoginModalState, 81 | identifyCurrentSub, 82 | currentSub, 83 | posts, 84 | submitPage, 85 | currentAnchor, 86 | communityOptions, 87 | communityTheme, 88 | standardTheme, 89 | mainComment, 90 | writeComment, 91 | writeNestedComment, 92 | editComment, 93 | editNestedComment, 94 | setCurrentSub, 95 | setIndex, 96 | navToUserProfile, 97 | savePost, 98 | submitNestedComment, 99 | navToProfile, 100 | handleLikeComment, 101 | handleNestedComment, 102 | switchCommunityOptions, 103 | switchCommunityTheme, 104 | openPost, 105 | expandRule, 106 | handleLike, 107 | setSort, 108 | handleSubMembership, 109 | handleNavigate, 110 | navToSubmit, 111 | submitComment, 112 | selectAnchor 113 | } = props; 114 | 115 | useEffect(() => { 116 | if (currentSub === undefined) { 117 | const subId = subreddits.findIndex(sub => sub.title === location.pathname.substring(27)); 118 | if (subId === -1) { 119 | return; 120 | } 121 | setCurrentSub(subreddits[subId]); 122 | } 123 | }, []); 124 | 125 | return ( 126 |
127 | banner 128 | 129 | 138 | 139 |
140 |
141 | 147 | 148 | 152 | 153 | 180 | 181 |
182 | 183 | 200 |
201 |
202 | ); 203 | } 204 | -------------------------------------------------------------------------------- /src/containers/individualPost/individualPost.scss: -------------------------------------------------------------------------------- 1 | // CSS 2 | .post-page { 3 | width: 100vw; 4 | min-height: 100vh; 5 | z-index: 7; 6 | display: flex; 7 | flex-direction: column; 8 | justify-content: center; 9 | align-items: center; 10 | 11 | .pageHeader { 12 | top: 49px; 13 | z-index: 8; 14 | background-color: black; 15 | height: 47px; 16 | box-sizing: border-box; 17 | display: flex; 18 | align-items: center; 19 | gap: 482px; 20 | width: 1280px; 21 | margin-right: 15px; 22 | padding-left: 120px; 23 | position: sticky; 24 | 25 | .leftHeader { 26 | display: flex; 27 | 28 | .postIcon { 29 | height: 17px; 30 | margin-right: 14px; 31 | } 32 | 33 | h3 { 34 | color: #D7DADC; 35 | font-size: 14px; 36 | font-family: "IBM Light"; 37 | margin-right: 10px; 38 | } 39 | 40 | .flairBtn { 41 | border: 1px solid transparent; 42 | border-radius: 4px; 43 | color: white; 44 | padding: 1px 5px 2px 4px; 45 | font-size: 12px; 46 | font-family: "IBM Light"; 47 | cursor: pointer; 48 | } 49 | } 50 | 51 | .rightHeader { 52 | display: flex; 53 | align-items: center; 54 | gap: 8px; 55 | position: absolute; 56 | cursor: pointer; 57 | right: 120px; 58 | 59 | .cross { 60 | height: 16px; 61 | } 62 | 63 | h3 { 64 | color: #D7DADC; 65 | font-size: 12px; 66 | font-family: "IBM"; 67 | } 68 | } 69 | } 70 | 71 | .postContent { 72 | margin-top: 49px; 73 | min-height: 90vh; 74 | width: 1280px; 75 | box-sizing: border-box; 76 | margin-right: 15px; 77 | display: flex; 78 | padding-left: 106px; 79 | padding-top: 31px; 80 | gap: 12px; 81 | } 82 | } -------------------------------------------------------------------------------- /src/custom.d.ts: -------------------------------------------------------------------------------- 1 | declare module "*.svg" { 2 | const content: any; 3 | export default content; 4 | } 5 | 6 | 7 | declare module '*.jpg'; 8 | declare module '*.png'; -------------------------------------------------------------------------------- /src/declarations.d.ts: -------------------------------------------------------------------------------- 1 | declare module '*.jpg' { 2 | export default `` as string; 3 | } 4 | 5 | declare module '*.png' { 6 | export default `` as string; 7 | } 8 | 9 | declare module '*.PNG' { 10 | export default `` as string; 11 | } 12 | 13 | declare module "*.svg" { 14 | const content: any; 15 | export default content; 16 | } -------------------------------------------------------------------------------- /src/index.scss: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 5 | sans-serif; 6 | -webkit-font-smoothing: antialiased; 7 | -moz-osx-font-smoothing: grayscale; 8 | overflow-x: hidden; 9 | } 10 | 11 | code { 12 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 13 | monospace; 14 | } 15 | 16 | // Font Imports 17 | @font-face { 18 | font-family: 'Benton Sans'; 19 | src: url("./resources/fonts/bentonsansregular.otf") format("opentype"); 20 | font-display: swap; 21 | } 22 | 23 | @font-face { 24 | font-family: 'Benton Sans Book'; 25 | src: url("./resources/fonts/bentonsansbook.otf") format("opentype"); 26 | font-display: swap; 27 | } 28 | 29 | @font-face { 30 | font-family: "Noto Sans"; 31 | src: url("./resources/fonts/notosans.ttf") format("truetype"); 32 | font-display: swap; 33 | } 34 | 35 | @font-face { 36 | font-family: "Noto Sans Regular"; 37 | src: url("./resources/fonts/notosans-regular.ttf") format("truetype"); 38 | font-display: swap; 39 | } 40 | 41 | @font-face { 42 | font-family: "Noto Sans Bold"; 43 | src: url("./resources/fonts/notosans-bold.ttf") format("truetype"); 44 | font-display: swap; 45 | } 46 | 47 | @font-face { 48 | font-family: "IBM"; 49 | src: url("./resources/fonts/ibmplexsans.ttf") format("truetype"); 50 | font-display: swap; 51 | } 52 | 53 | @font-face { 54 | font-family: "IBM Light"; 55 | src: url("./resources/fonts/ibmplexsanslight.ttf") format("truetype"); 56 | font-display: swap; 57 | } 58 | 59 | @font-face { 60 | font-family: "IBM Regular"; 61 | src: url("./resources/fonts/ibmplexsansregular.ttf") format("truetype"); 62 | font-display: swap; 63 | } -------------------------------------------------------------------------------- /src/index.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom/client'; 3 | import './index.scss'; 4 | import App from './App'; 5 | import reportWebVitals from './reportWebVitals'; 6 | import { BrowserRouter } from 'react-router-dom'; 7 | 8 | const root = ReactDOM.createRoot( 9 | document.getElementById('root') as HTMLElement 10 | ); 11 | root.render( 12 | 13 | 14 | 15 | 16 | 17 | ); 18 | 19 | // If you want to start measuring performance in your app, pass a function 20 | // to log results (for example: reportWebVitals(console.log)) 21 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 22 | reportWebVitals(); 23 | -------------------------------------------------------------------------------- /src/logo.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/react-app-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | 3 | declare module "*.png"; 4 | declare module "*.svg"; 5 | declare module "*.jpeg"; 6 | declare module "*.jpg"; 7 | -------------------------------------------------------------------------------- /src/reportWebVitals.ts: -------------------------------------------------------------------------------- 1 | import { ReportHandler } from 'web-vitals'; 2 | 3 | const reportWebVitals = (onPerfEntry?: ReportHandler) => { 4 | if (onPerfEntry && onPerfEntry instanceof Function) { 5 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 6 | getCLS(onPerfEntry); 7 | getFID(onPerfEntry); 8 | getFCP(onPerfEntry); 9 | getLCP(onPerfEntry); 10 | getTTFB(onPerfEntry); 11 | }); 12 | } 13 | }; 14 | 15 | export default reportWebVitals; 16 | -------------------------------------------------------------------------------- /src/resources/fonts/bentonsansbook.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/fonts/bentonsansbook.otf -------------------------------------------------------------------------------- /src/resources/fonts/bentonsansregular.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/fonts/bentonsansregular.otf -------------------------------------------------------------------------------- /src/resources/fonts/ibmplexsans.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/fonts/ibmplexsans.ttf -------------------------------------------------------------------------------- /src/resources/fonts/ibmplexsanslight.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/fonts/ibmplexsanslight.ttf -------------------------------------------------------------------------------- /src/resources/fonts/ibmplexsansregular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/fonts/ibmplexsansregular.ttf -------------------------------------------------------------------------------- /src/resources/fonts/notosans-bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/fonts/notosans-bold.ttf -------------------------------------------------------------------------------- /src/resources/fonts/notosans-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/fonts/notosans-regular.ttf -------------------------------------------------------------------------------- /src/resources/fonts/notosans.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/fonts/notosans.ttf -------------------------------------------------------------------------------- /src/resources/images/Communities/announcements/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/announcements/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/announcements/icon.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/announcements/icon.PNG -------------------------------------------------------------------------------- /src/resources/images/Communities/apexlegends/56.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/apexlegends/56.png -------------------------------------------------------------------------------- /src/resources/images/Communities/apexlegends/58.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/apexlegends/58.png -------------------------------------------------------------------------------- /src/resources/images/Communities/apexlegends/59.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/apexlegends/59.png -------------------------------------------------------------------------------- /src/resources/images/Communities/apexlegends/60.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/apexlegends/60.png -------------------------------------------------------------------------------- /src/resources/images/Communities/apexlegends/Icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/apexlegends/Icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/apexlegends/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/apexlegends/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/astronomy/72.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/astronomy/72.png -------------------------------------------------------------------------------- /src/resources/images/Communities/astronomy/73.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/astronomy/73.png -------------------------------------------------------------------------------- /src/resources/images/Communities/astronomy/74.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/astronomy/74.png -------------------------------------------------------------------------------- /src/resources/images/Communities/astronomy/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/astronomy/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/astronomy/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/astronomy/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/baking/66.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/baking/66.png -------------------------------------------------------------------------------- /src/resources/images/Communities/baking/67.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/baking/67.png -------------------------------------------------------------------------------- /src/resources/images/Communities/baking/68.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/baking/68.png -------------------------------------------------------------------------------- /src/resources/images/Communities/baking/69.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/baking/69.png -------------------------------------------------------------------------------- /src/resources/images/Communities/baking/70.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/baking/70.png -------------------------------------------------------------------------------- /src/resources/images/Communities/baking/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/baking/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/baking/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/baking/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/books/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/books/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/books/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/books/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/crypto/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/crypto/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/crypto/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/crypto/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/finance/24.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/finance/24.png -------------------------------------------------------------------------------- /src/resources/images/Communities/finance/25.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/finance/25.png -------------------------------------------------------------------------------- /src/resources/images/Communities/finance/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/finance/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/finance/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/finance/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/genshinimpact/10.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/genshinimpact/10.png -------------------------------------------------------------------------------- /src/resources/images/Communities/genshinimpact/11.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/genshinimpact/11.png -------------------------------------------------------------------------------- /src/resources/images/Communities/genshinimpact/12.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/genshinimpact/12.png -------------------------------------------------------------------------------- /src/resources/images/Communities/genshinimpact/13.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/genshinimpact/13.png -------------------------------------------------------------------------------- /src/resources/images/Communities/genshinimpact/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/genshinimpact/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/genshinimpact/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/genshinimpact/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/leagueoflegends/5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/leagueoflegends/5.png -------------------------------------------------------------------------------- /src/resources/images/Communities/leagueoflegends/6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/leagueoflegends/6.png -------------------------------------------------------------------------------- /src/resources/images/Communities/leagueoflegends/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/leagueoflegends/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/leagueoflegends/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/leagueoflegends/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/learnprogramming/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/learnprogramming/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/learnprogramming/icon.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/learnprogramming/icon.PNG -------------------------------------------------------------------------------- /src/resources/images/Communities/movies/2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/movies/2.png -------------------------------------------------------------------------------- /src/resources/images/Communities/movies/3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/movies/3.png -------------------------------------------------------------------------------- /src/resources/images/Communities/movies/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/movies/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/movies/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/movies/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/nasa/46.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/nasa/46.png -------------------------------------------------------------------------------- /src/resources/images/Communities/nasa/48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/nasa/48.png -------------------------------------------------------------------------------- /src/resources/images/Communities/nasa/50.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/nasa/50.png -------------------------------------------------------------------------------- /src/resources/images/Communities/nasa/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/nasa/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/nasa/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/nasa/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/nba/15.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/nba/15.PNG -------------------------------------------------------------------------------- /src/resources/images/Communities/nba/17.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/nba/17.PNG -------------------------------------------------------------------------------- /src/resources/images/Communities/nba/19.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/nba/19.PNG -------------------------------------------------------------------------------- /src/resources/images/Communities/nba/Icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/nba/Icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/nba/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/nba/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/placeholder.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/placeholder.png -------------------------------------------------------------------------------- /src/resources/images/Communities/programmerHumor/27.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/programmerHumor/27.png -------------------------------------------------------------------------------- /src/resources/images/Communities/programmerHumor/29.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/programmerHumor/29.png -------------------------------------------------------------------------------- /src/resources/images/Communities/programmerHumor/30.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/programmerHumor/30.png -------------------------------------------------------------------------------- /src/resources/images/Communities/programmerHumor/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/programmerHumor/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/programmerHumor/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/programmerHumor/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/sports/77.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/sports/77.png -------------------------------------------------------------------------------- /src/resources/images/Communities/sports/78.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/sports/78.png -------------------------------------------------------------------------------- /src/resources/images/Communities/sports/80.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/sports/80.png -------------------------------------------------------------------------------- /src/resources/images/Communities/sports/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/sports/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/sports/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/sports/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/todayilearned/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/todayilearned/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/todayilearned/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/todayilearned/icon.png -------------------------------------------------------------------------------- /src/resources/images/Communities/wallstreetbets/41.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/wallstreetbets/41.png -------------------------------------------------------------------------------- /src/resources/images/Communities/wallstreetbets/43.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/wallstreetbets/43.png -------------------------------------------------------------------------------- /src/resources/images/Communities/wallstreetbets/45.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/wallstreetbets/45.png -------------------------------------------------------------------------------- /src/resources/images/Communities/wallstreetbets/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/wallstreetbets/banner.jpg -------------------------------------------------------------------------------- /src/resources/images/Communities/wallstreetbets/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/Communities/wallstreetbets/icon.png -------------------------------------------------------------------------------- /src/resources/images/add.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/add.PNG -------------------------------------------------------------------------------- /src/resources/images/addphoto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/addphoto.png -------------------------------------------------------------------------------- /src/resources/images/ads.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/ads.png -------------------------------------------------------------------------------- /src/resources/images/all.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/all.PNG -------------------------------------------------------------------------------- /src/resources/images/apple.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /src/resources/images/avatar1.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar1.PNG -------------------------------------------------------------------------------- /src/resources/images/avatar10.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar10.PNG -------------------------------------------------------------------------------- /src/resources/images/avatar10_head.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar10_head.png -------------------------------------------------------------------------------- /src/resources/images/avatar1_head.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar1_head.png -------------------------------------------------------------------------------- /src/resources/images/avatar2.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar2.PNG -------------------------------------------------------------------------------- /src/resources/images/avatar2_head.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar2_head.png -------------------------------------------------------------------------------- /src/resources/images/avatar3.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar3.PNG -------------------------------------------------------------------------------- /src/resources/images/avatar3_head.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar3_head.png -------------------------------------------------------------------------------- /src/resources/images/avatar4.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar4.PNG -------------------------------------------------------------------------------- /src/resources/images/avatar4_head.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar4_head.png -------------------------------------------------------------------------------- /src/resources/images/avatar5.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar5.PNG -------------------------------------------------------------------------------- /src/resources/images/avatar5_head.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar5_head.png -------------------------------------------------------------------------------- /src/resources/images/avatar6.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar6.PNG -------------------------------------------------------------------------------- /src/resources/images/avatar6_head.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar6_head.png -------------------------------------------------------------------------------- /src/resources/images/avatar7.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar7.PNG -------------------------------------------------------------------------------- /src/resources/images/avatar7_head.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar7_head.png -------------------------------------------------------------------------------- /src/resources/images/avatar8.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar8.PNG -------------------------------------------------------------------------------- /src/resources/images/avatar8_head.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar8_head.png -------------------------------------------------------------------------------- /src/resources/images/avatar9.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar9.PNG -------------------------------------------------------------------------------- /src/resources/images/avatar9_head.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatar9_head.png -------------------------------------------------------------------------------- /src/resources/images/avatartesla.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatartesla.PNG -------------------------------------------------------------------------------- /src/resources/images/avatartesla_head.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/avatartesla_head.png -------------------------------------------------------------------------------- /src/resources/images/awards.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/awards.png -------------------------------------------------------------------------------- /src/resources/images/banner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/banner.png -------------------------------------------------------------------------------- /src/resources/images/banner2.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/banner2.PNG -------------------------------------------------------------------------------- /src/resources/images/bannerTopCommunities.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/bannerTopCommunities.png -------------------------------------------------------------------------------- /src/resources/images/bannerTopCommunities2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/bannerTopCommunities2.png -------------------------------------------------------------------------------- /src/resources/images/bannerTopCommunities3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/bannerTopCommunities3.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default1.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default10.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default10.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default11.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default11.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default12.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default12.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default13.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default13.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default14.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default14.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default15.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default15.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default2.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default3.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default4.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default5.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default6.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default7.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default8.png -------------------------------------------------------------------------------- /src/resources/images/base_variants/default9.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/base_variants/default9.png -------------------------------------------------------------------------------- /src/resources/images/bell.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/bell.PNG -------------------------------------------------------------------------------- /src/resources/images/best_notselected.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/best_notselected.png -------------------------------------------------------------------------------- /src/resources/images/best_selected.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/best_selected.png -------------------------------------------------------------------------------- /src/resources/images/betauser.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/betauser.png -------------------------------------------------------------------------------- /src/resources/images/bluesettings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/bluesettings.png -------------------------------------------------------------------------------- /src/resources/images/bold.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/bold.png -------------------------------------------------------------------------------- /src/resources/images/bulleted.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/bulleted.png -------------------------------------------------------------------------------- /src/resources/images/cake.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/cake.png -------------------------------------------------------------------------------- /src/resources/images/cakeblack.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/cakeblack.png -------------------------------------------------------------------------------- /src/resources/images/chat.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/chat.PNG -------------------------------------------------------------------------------- /src/resources/images/check.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/check.png -------------------------------------------------------------------------------- /src/resources/images/checkblack.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/checkblack.png -------------------------------------------------------------------------------- /src/resources/images/clip.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/clip.png -------------------------------------------------------------------------------- /src/resources/images/close.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/close.PNG -------------------------------------------------------------------------------- /src/resources/images/coin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/coin.png -------------------------------------------------------------------------------- /src/resources/images/commenter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/commenter.png -------------------------------------------------------------------------------- /src/resources/images/comments.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/comments.png -------------------------------------------------------------------------------- /src/resources/images/cross.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/cross.png -------------------------------------------------------------------------------- /src/resources/images/cross.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/resources/images/dots.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/dots.png -------------------------------------------------------------------------------- /src/resources/images/downvote.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/downvote.png -------------------------------------------------------------------------------- /src/resources/images/downvoteHover.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/downvoteHover.png -------------------------------------------------------------------------------- /src/resources/images/downvoted.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/downvoted.png -------------------------------------------------------------------------------- /src/resources/images/dropdown.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/resources/images/einstellungen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/einstellungen.png -------------------------------------------------------------------------------- /src/resources/images/erkunden.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/erkunden.png -------------------------------------------------------------------------------- /src/resources/images/expand.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/expand.png -------------------------------------------------------------------------------- /src/resources/images/expand.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/resources/images/expandblack.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/expandblack.png -------------------------------------------------------------------------------- /src/resources/images/expandgrey.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/expandgrey.png -------------------------------------------------------------------------------- /src/resources/images/eye.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/eye.png -------------------------------------------------------------------------------- /src/resources/images/favorite.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 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 | 39 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /src/resources/images/favorited.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/favorited.PNG -------------------------------------------------------------------------------- /src/resources/images/fiveyearclub.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/fiveyearclub.png -------------------------------------------------------------------------------- /src/resources/images/flair.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/flair.PNG -------------------------------------------------------------------------------- /src/resources/images/fouryearclub.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/fouryearclub.png -------------------------------------------------------------------------------- /src/resources/images/gold.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/gold.png -------------------------------------------------------------------------------- /src/resources/images/google.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/resources/images/heading.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/heading.png -------------------------------------------------------------------------------- /src/resources/images/helpful.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/helpful.png -------------------------------------------------------------------------------- /src/resources/images/helpfulgold.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/helpfulgold.png -------------------------------------------------------------------------------- /src/resources/images/hexagon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/hexagon.png -------------------------------------------------------------------------------- /src/resources/images/hilfecenter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/hilfecenter.png -------------------------------------------------------------------------------- /src/resources/images/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/home.png -------------------------------------------------------------------------------- /src/resources/images/homeavatar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/homeavatar.png -------------------------------------------------------------------------------- /src/resources/images/homebanner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/homebanner.png -------------------------------------------------------------------------------- /src/resources/images/hot_notselected.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/hot_notselected.png -------------------------------------------------------------------------------- /src/resources/images/hot_selected.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/hot_selected.png -------------------------------------------------------------------------------- /src/resources/images/img.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/img.PNG -------------------------------------------------------------------------------- /src/resources/images/infos_grey.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/infos_grey.png -------------------------------------------------------------------------------- /src/resources/images/inline.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/inline.png -------------------------------------------------------------------------------- /src/resources/images/italic.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/italic.png -------------------------------------------------------------------------------- /src/resources/images/karma.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/karma.PNG -------------------------------------------------------------------------------- /src/resources/images/karma_blue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/karma_blue.png -------------------------------------------------------------------------------- /src/resources/images/kicgzh7qcmy41.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/kicgzh7qcmy41.jpg -------------------------------------------------------------------------------- /src/resources/images/layout.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/layout.png -------------------------------------------------------------------------------- /src/resources/images/link.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/link.PNG -------------------------------------------------------------------------------- /src/resources/images/live.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/live.PNG -------------------------------------------------------------------------------- /src/resources/images/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/loading.gif -------------------------------------------------------------------------------- /src/resources/images/loginbackground.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/loginbackground.png -------------------------------------------------------------------------------- /src/resources/images/logout.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/logout.png -------------------------------------------------------------------------------- /src/resources/images/more.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/more.PNG -------------------------------------------------------------------------------- /src/resources/images/more_white.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/more_white.PNG -------------------------------------------------------------------------------- /src/resources/images/moregrey.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/moregrey.png -------------------------------------------------------------------------------- /src/resources/images/new_notselected.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/new_notselected.png -------------------------------------------------------------------------------- /src/resources/images/new_selected.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/new_selected.png -------------------------------------------------------------------------------- /src/resources/images/newuser.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/newuser.png -------------------------------------------------------------------------------- /src/resources/images/noti_check.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/noti_check.png -------------------------------------------------------------------------------- /src/resources/images/noti_settings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/noti_settings.png -------------------------------------------------------------------------------- /src/resources/images/numbered.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/numbered.png -------------------------------------------------------------------------------- /src/resources/images/onedayclub.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/onedayclub.png -------------------------------------------------------------------------------- /src/resources/images/pen.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /src/resources/images/pencil.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/pencil.png -------------------------------------------------------------------------------- /src/resources/images/people.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/people.png -------------------------------------------------------------------------------- /src/resources/images/performance.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/performance.png -------------------------------------------------------------------------------- /src/resources/images/photograph.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/photograph.png -------------------------------------------------------------------------------- /src/resources/images/platinum.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/platinum.png -------------------------------------------------------------------------------- /src/resources/images/plusone.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/plusone.png -------------------------------------------------------------------------------- /src/resources/images/plusone.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/plusone.webp -------------------------------------------------------------------------------- /src/resources/images/popular.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/popular.PNG -------------------------------------------------------------------------------- /src/resources/images/popularcomment.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/popularcomment.png -------------------------------------------------------------------------------- /src/resources/images/popularpost.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/popularpost.png -------------------------------------------------------------------------------- /src/resources/images/post.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/post.png -------------------------------------------------------------------------------- /src/resources/images/poster.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/poster.png -------------------------------------------------------------------------------- /src/resources/images/premium.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/premium.png -------------------------------------------------------------------------------- /src/resources/images/premium2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/premium2.png -------------------------------------------------------------------------------- /src/resources/images/preview1.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/preview1.PNG -------------------------------------------------------------------------------- /src/resources/images/preview10.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/preview10.PNG -------------------------------------------------------------------------------- /src/resources/images/preview11.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/preview11.PNG -------------------------------------------------------------------------------- /src/resources/images/preview2.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/preview2.PNG -------------------------------------------------------------------------------- /src/resources/images/preview3.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/preview3.PNG -------------------------------------------------------------------------------- /src/resources/images/preview4.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/preview4.PNG -------------------------------------------------------------------------------- /src/resources/images/preview5.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/preview5.PNG -------------------------------------------------------------------------------- /src/resources/images/preview6.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/preview6.PNG -------------------------------------------------------------------------------- /src/resources/images/preview7.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/preview7.PNG -------------------------------------------------------------------------------- /src/resources/images/preview8.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/preview8.PNG -------------------------------------------------------------------------------- /src/resources/images/preview9.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/preview9.PNG -------------------------------------------------------------------------------- /src/resources/images/profile.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/profile.png -------------------------------------------------------------------------------- /src/resources/images/quote.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/quote.png -------------------------------------------------------------------------------- /src/resources/images/recent.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/recent.png -------------------------------------------------------------------------------- /src/resources/images/reddit.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/resources/images/redditlogo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/redditlogo.png -------------------------------------------------------------------------------- /src/resources/images/redditlogo.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/resources/images/rediquette.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/rediquette.png -------------------------------------------------------------------------------- /src/resources/images/registrieren.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/registrieren.png -------------------------------------------------------------------------------- /src/resources/images/remove.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/remove.png -------------------------------------------------------------------------------- /src/resources/images/report.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/report.png -------------------------------------------------------------------------------- /src/resources/images/richtlinien.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/richtlinien.png -------------------------------------------------------------------------------- /src/resources/images/rocket.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/rocket.png -------------------------------------------------------------------------------- /src/resources/images/save.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/save.png -------------------------------------------------------------------------------- /src/resources/images/saved.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/saved.png -------------------------------------------------------------------------------- /src/resources/images/search.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 6 | 7 | 10 | 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 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /src/resources/images/sevenyearclub.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/sevenyearclub.png -------------------------------------------------------------------------------- /src/resources/images/share.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/share.png -------------------------------------------------------------------------------- /src/resources/images/shirt.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/shirt.png -------------------------------------------------------------------------------- /src/resources/images/silver.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/silver.png -------------------------------------------------------------------------------- /src/resources/images/sixyearclub.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/sixyearclub.png -------------------------------------------------------------------------------- /src/resources/images/spoiler.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/spoiler.png -------------------------------------------------------------------------------- /src/resources/images/star.svg: -------------------------------------------------------------------------------- 1 | 7 | 13 | 14 | -------------------------------------------------------------------------------- /src/resources/images/stonks.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/stonks.png -------------------------------------------------------------------------------- /src/resources/images/stonks.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/stonks.webp -------------------------------------------------------------------------------- /src/resources/images/strikethrough.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/strikethrough.png -------------------------------------------------------------------------------- /src/resources/images/superheart.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/superheart.png -------------------------------------------------------------------------------- /src/resources/images/superscript.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/superscript.png -------------------------------------------------------------------------------- /src/resources/images/talk.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/talk.png -------------------------------------------------------------------------------- /src/resources/images/tbn70x69n2m91.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/tbn70x69n2m91.webp -------------------------------------------------------------------------------- /src/resources/images/threeyearclub.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/threeyearclub.png -------------------------------------------------------------------------------- /src/resources/images/top.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/top.png -------------------------------------------------------------------------------- /src/resources/images/top_notselected.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/top_notselected.png -------------------------------------------------------------------------------- /src/resources/images/top_selected.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/top_selected.png -------------------------------------------------------------------------------- /src/resources/images/trinity.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/trinity.png -------------------------------------------------------------------------------- /src/resources/images/twoyearclub.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/twoyearclub.png -------------------------------------------------------------------------------- /src/resources/images/typeimage.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/typeimage.png -------------------------------------------------------------------------------- /src/resources/images/typeimage_selected.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/typeimage_selected.png -------------------------------------------------------------------------------- /src/resources/images/typelink.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/typelink.png -------------------------------------------------------------------------------- /src/resources/images/typelink_selected.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/typelink_selected.png -------------------------------------------------------------------------------- /src/resources/images/typelist.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/typelist.png -------------------------------------------------------------------------------- /src/resources/images/typepoll.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/typepoll.png -------------------------------------------------------------------------------- /src/resources/images/typetalk.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/typetalk.png -------------------------------------------------------------------------------- /src/resources/images/typetext.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/typetext.png -------------------------------------------------------------------------------- /src/resources/images/typetext_selected.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/typetext_selected.png -------------------------------------------------------------------------------- /src/resources/images/unfavorited.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/unfavorited.PNG -------------------------------------------------------------------------------- /src/resources/images/upvote.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/upvote.png -------------------------------------------------------------------------------- /src/resources/images/upvoteHover.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/upvoteHover.png -------------------------------------------------------------------------------- /src/resources/images/upvoted.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/upvoted.png -------------------------------------------------------------------------------- /src/resources/images/user.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/user.png -------------------------------------------------------------------------------- /src/resources/images/user.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/resources/images/vibing.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/vibing.png -------------------------------------------------------------------------------- /src/resources/images/weitereinfos.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/weitereinfos.png -------------------------------------------------------------------------------- /src/resources/images/werbung.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/werbung.png -------------------------------------------------------------------------------- /src/resources/images/wholesome.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/resources/images/wholesome.png -------------------------------------------------------------------------------- /src/setupTests.ts: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom'; 6 | -------------------------------------------------------------------------------- /src/styles/global/_functions.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/styles/global/_functions.scss -------------------------------------------------------------------------------- /src/styles/global/_mixins.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gianlucajahn/typescript-reddit-clone/9b57709d5e9e7058a8ee70f9bb3ca697faa7b64f/src/styles/global/_mixins.scss -------------------------------------------------------------------------------- /src/styles/global/_variables.scss: -------------------------------------------------------------------------------- 1 | // Global variables 2 | $mainPageBackground: #dae0e6; 3 | $svgColor: #878a8c; 4 | $blue: #0079D3; 5 | $whiteHovered: #f5fafd; 6 | $blueHovered: #1484d6; 7 | $contentWidth: 640px; 8 | 9 | -------------------------------------------------------------------------------- /src/types/types.json: -------------------------------------------------------------------------------- 1 | { 2 | "title": "movies", 3 | "logo": "../../resources/images/Communities/movies/icon.png", 4 | "category": "Entertainment", 5 | "favorite": false, 6 | "joined": false, 7 | "about": "The goal of /r/Movies is to provide an inclusive place for discussions and news about films with major releases. Submissions should be for the purpose of informing or initiating a discussion, not just to entertain readers. Read our extensive list of rules for more information on other types of posts like fan-art and self-promotion, or message the moderators if you have any questions.", 8 | "members": "29.0m", 9 | "online": "23.5k", 10 | "creationDate": "Jan 25, 2008", 11 | "rules": [ 12 | { 13 | "number": 1, 14 | "title": "General Violation of One of Our Endless Rules", 15 | "desc": "Our full list of rules is here." 16 | }, 17 | { 18 | "number": 2, 19 | "title": "Blatant Hatespeech - Racial/Sexist/Homophobic Slurs", 20 | "desc": "If it's a quote from a movie - put it in quotes. If it's immature 4channery or something that looks like rhetoric straight out of a Trump subreddit - let us know. Remember that discussion about derogatory/offensive/sensitive issues often leads to unnecessary conflict. Discuss the subject of the thread, not the users." 21 | }, 22 | { 23 | "number": 3, 24 | "title": "Ambiguous titles/Clickbait", 25 | "desc": "Any type of 'This movie is amazing!' submission that doesn't include the subject in the submission title. Submission titles that do not refer to the name of the movie the post is talking about are also bounds for removal under this rule." 26 | }, 27 | { 28 | "number": 4, 29 | "title": "Spam & Self-Promotion - User Submits From the Same Source Too Much", 30 | "desc": "The /r/Movies definition of spam is when a user has more than 20% of their submissions coming from one source. If your username is the same as the website or YT channel you're trying to promote - you will be banned and your website blacklisted. Sharing Letterboxd accounts is not allowed either." 31 | }, 32 | { 33 | "number": 5, 34 | "title": "Image posts & memes", 35 | "desc": "Memes are not allowed. Single images or albums of behind the scene of already released movies are prohibited, as are memes, movies I like/recommend and infographics. Make a text post if you want to talk about something like that and link the image in there. Official first looks and posters ARE allowed if they've not been posted before." 36 | }, 37 | { 38 | "number": 6, 39 | "title": "Popular prohibited websites", 40 | "desc": "The following list of websites are prohibited as link posts, feel free to link to these sites in comments or text-posts. Streaming Sites, Letterboxd, IMDB, Rottentomatoes, Social-media." 41 | }, 42 | { 43 | "number": 7, 44 | "title": "Flame wars - Name calling - Insults - Antagonism", 45 | "desc": "We usually draw the line around name-calling, but intentionally antagonizing users will result in an immediate ban. Respect differences of opinion, and resist the urge to be defensive or assign blame. Remember that people have different communication styles, and that not everyone is using their native language when using Reddit. Interpret other Redditors' arguments in good faith, and give people the benefit of the doubt." 46 | }, 47 | { 48 | "number": 8, 49 | "title": "Possible subreddit brigading", 50 | "desc": "Report possible brigading operations with this tag." 51 | }, 52 | { 53 | "number": 9, 54 | "title": "Extraneous Comic Book Movie submission", 55 | "desc": "Anything that isn't official, hard-lined news about comic book movies/Superhero movies will be removed. No featurettes, fan art, parodies, etc." 56 | }, 57 | { 58 | "number": 10, 59 | "title": "Repost", 60 | "desc": "No reposts. Simple. Original Content is appreciated." 61 | }, 62 | { 63 | "number": 11, 64 | "title": "Negative Attention Seeking", 65 | "desc": "One of those users who's only here to bother people for the lulz or whatever. Gotta do something while the girls ain't callin'." 66 | }, 67 | { 68 | "number": 12, 69 | "title": "Inaccurate or Grossly Misleading Information in Submission Title", 70 | "desc": "For upcoming movie news, we take misinformation seriously. In development does not mean a movie is coming out. In talks or in negotiations does not mean 'This person is working on this project'. 'A source tells us.' If that appears in your article, it'll probably be removed. This is movie news, not investigative journalism. We want official announcements." 71 | }, 72 | { 73 | "number": 13, 74 | "title": "Cause Chaos Within the Mod Ranks", 75 | "desc": "Maybe you don't know what rule this post broke, but it burns at your core and makes you want to inflict that pain on the mods. Don't. Edit from Gianluca: Honestly, these subreddit's rules are wild. I had to change up some stuff because it's too insultive. Weird folks in here, lol." 76 | } 77 | ], 78 | "flairs": [ 79 | { 80 | "title": "Official Discussion", 81 | "color": "#46d160" 82 | }, 83 | { 84 | "title": "Recommendation", 85 | "color": "#0266b3" 86 | }, 87 | { 88 | "title": "Article", 89 | "color": "#00a6a5" 90 | }, 91 | { 92 | "title": "News", 93 | "color": "#0aa18f" 94 | }, 95 | { 96 | "title": "Discussion", 97 | "color": "#0079d3" 98 | }, 99 | { 100 | "title": "Poster", 101 | "color": "#ccac2b" 102 | }, 103 | { 104 | "title": "Media", 105 | "color": "#ccac2b" 106 | } 107 | ], 108 | "buttonColor": "#014980", 109 | "headerColor": "#014980", 110 | "blackText": false, 111 | "backgroundColor": "#02315c", 112 | "bannerUrl": "../../resources/images/Communities/movies/banner.jpg" 113 | } -------------------------------------------------------------------------------- /src/types/types.ts: -------------------------------------------------------------------------------- 1 | export type Subreddits = Subreddit[] 2 | 3 | export type Subreddit = { 4 | title: string; 5 | officialTitle: string; 6 | logo: string; 7 | category: string; 8 | favorite: boolean; 9 | joined: boolean; 10 | about: string; 11 | members: string; 12 | online: string; 13 | creationDate: string; 14 | rules: Rule[]; 15 | flairs: FlairSub[]; 16 | anchors: Anchor[] | undefined; 17 | buttonColor: string; 18 | headerColor: string; 19 | blackText: boolean; 20 | backgroundColor: string; 21 | bannerUrl: string; 22 | bySize: string | undefined; 23 | } 24 | 25 | export type Anchor = { 26 | title: string, 27 | selected: boolean 28 | } | undefined 29 | 30 | export type FlairSub = { 31 | title: string; 32 | color: string; 33 | } 34 | 35 | export type Notifications = Notification[]; 36 | 37 | export type Notification = { 38 | number: number; 39 | type: string; 40 | subreddit: string; 41 | time: string; 42 | title: string; 43 | content: string; 44 | } 45 | 46 | export type Rule = { 47 | number: number; 48 | expanded: boolean; 49 | title: string; 50 | desc: string; 51 | } | undefined 52 | 53 | export type Post = { 54 | title: string; 55 | id: string; 56 | type: string; 57 | pinned: boolean; 58 | vote: number; 59 | src: string; 60 | author: string; 61 | time: string; 62 | subreddit: string; 63 | upvotes: string; 64 | awards: string[]; 65 | comments: Comment[]; 66 | flair: Flair; 67 | saved: boolean; 68 | } 69 | 70 | export type userObject = { 71 | username: string; 72 | password: string; 73 | avatar: string; 74 | trophies: string[]; 75 | following: string[]; 76 | reported: boolean; 77 | added: boolean; 78 | karma: string; 79 | age: string; 80 | color: string; 81 | cakeday?: string; 82 | } 83 | 84 | export type userObjectArray = userObject[]; 85 | 86 | export interface Comment { 87 | author: string; 88 | nesting: string; 89 | vote: number; 90 | time: string; 91 | upvotes: string; 92 | content: string; 93 | hasBeenSubmittedYet?: boolean, 94 | lastSubmitContent?: string, 95 | avatar?: string, 96 | nested_lvl: number; 97 | nested_comments: Comment[]; 98 | } 99 | 100 | export interface UserData { 101 | username: string; 102 | password: string; 103 | } 104 | 105 | export type Flair = { 106 | title: string; 107 | color: string; 108 | } 109 | 110 | export type Draft = { 111 | title: string; 112 | type: string; 113 | src: string; 114 | time: string; 115 | subreddit: string; 116 | } 117 | 118 | export const baseCustomPost = { 119 | id: "86", 120 | src: "", 121 | author: "", 122 | subreddit: "", 123 | pinned: false, 124 | title: "", 125 | type: "text", 126 | vote: 1, 127 | saved: false, 128 | time: "Just Now", 129 | upvotes: "1", 130 | awards: [ 131 | "helpful" 132 | ], 133 | comments: [ 134 | { 135 | author: "AutoModerator", 136 | avatar: "15", 137 | nested_lvl: 0, 138 | nested_comments: [ 139 | 140 | ], 141 | nesting: "none", 142 | vote: 0, 143 | time: "Just Now", 144 | upvotes: "0", 145 | content: "Thanks for submitting a post! Check back later to see if anyone commented on it! You will also be sent a notification if that happens, so don't worry, you won't miss out." 146 | }, 147 | ], 148 | flair: { 149 | title: "none", 150 | color: "#edeff1" 151 | } 152 | } 153 | 154 | -------------------------------------------------------------------------------- /src/utils/bestOrder.ts: -------------------------------------------------------------------------------- 1 | const bestOrder = [ 2 | 47, 3 | 12, 4 | 43, 5 | 59, 6 | 41, 7 | 5, 8 | 22, 9 | 53, 10 | 64, 11 | 4, 12 | 31, 13 | 71, 14 | 60, 15 | 10, 16 | 9, 17 | 11, 18 | 50, 19 | 28, 20 | 8, 21 | 26, 22 | 78, 23 | 3, 24 | 32, 25 | 37, 26 | 51, 27 | 54, 28 | 61, 29 | 63, 30 | 65, 31 | 84, 32 | 72, 33 | 83, 34 | 67, 35 | 82, 36 | 68, 37 | 23, 38 | 35, 39 | 58, 40 | 36, 41 | 62, 42 | 75, 43 | 27, 44 | 29, 45 | 44, 46 | 34, 47 | 45, 48 | 66, 49 | 73, 50 | 7, 51 | 19, 52 | 30, 53 | 38, 54 | 33, 55 | 49, 56 | 69, 57 | 79, 58 | 6, 59 | 2, 60 | 16, 61 | 1, 62 | 14, 63 | 19, 64 | 25, 65 | 24, 66 | 39, 67 | 46, 68 | 48, 69 | 52, 70 | 70, 71 | 55, 72 | 74, 73 | 56, 74 | 76, 75 | 80, 76 | 0, 77 | 77, 78 | 20, 79 | 15, 80 | 81 81 | ] 82 | 83 | export default bestOrder; -------------------------------------------------------------------------------- /src/utils/hotOrder.ts: -------------------------------------------------------------------------------- 1 | const hotOrder = [ 2 | 12, 3 | 55, 4 | 72, 5 | 69, 6 | 62, 7 | 21, 8 | 51, 9 | 74, 10 | 60, 11 | 0, 12 | 67, 13 | 37, 14 | 22, 15 | 81, 16 | 1, 17 | 82, 18 | 66, 19 | 24, 20 | 65, 21 | 11, 22 | 78, 23 | 34, 24 | 36, 25 | 32, 26 | 41, 27 | 19, 28 | 20, 29 | 28, 30 | 7, 31 | 61, 32 | 52, 33 | 18, 34 | 73, 35 | 64, 36 | 79, 37 | 68, 38 | 44, 39 | 40, 40 | 15, 41 | 3, 42 | 25, 43 | 29, 44 | 48, 45 | 50, 46 | 42, 47 | 84, 48 | 53, 49 | 49, 50 | 58, 51 | 70, 52 | 39, 53 | 31, 54 | 46, 55 | 6, 56 | 35, 57 | 16, 58 | 9, 59 | 85, 60 | 38, 61 | 27, 62 | 30, 63 | 47, 64 | 4, 65 | 5, 66 | 76, 67 | 75, 68 | 23, 69 | 77, 70 | 71, 71 | 57, 72 | 56, 73 | 14, 74 | 59, 75 | 17, 76 | 2, 77 | 33, 78 | 45, 79 | 8, 80 | 63, 81 | 10, 82 | 13, 83 | 54, 84 | 83, 85 | 43, 86 | 80, 87 | 26 88 | ] 89 | 90 | export default hotOrder -------------------------------------------------------------------------------- /src/utils/newOrder.ts: -------------------------------------------------------------------------------- 1 | const newOrder = [ 2 | 75, 3 | 16, 4 | 57, 5 | 81, 6 | 9, 7 | 11, 8 | 82, 9 | 19, 10 | 15, 11 | 21, 12 | 25, 13 | 30, 14 | 31, 15 | 56, 16 | 10, 17 | 46, 18 | 1, 19 | 24, 20 | 29, 21 | 42, 22 | 14, 23 | 41, 24 | 0, 25 | 13, 26 | 12, 27 | 37, 28 | 71, 29 | 51, 30 | 2, 31 | 36, 32 | 18, 33 | 7, 34 | 17, 35 | 39, 36 | 45, 37 | 53, 38 | 68, 39 | 76, 40 | 77, 41 | 3, 42 | 26, 43 | 34, 44 | 35, 45 | 38, 46 | 47, 47 | 40, 48 | 59, 49 | 67, 50 | 85, 51 | 5, 52 | 27, 53 | 44, 54 | 55, 55 | 66, 56 | 6, 57 | 48, 58 | 58, 59 | 78, 60 | 70, 61 | 79, 62 | 84, 63 | 8, 64 | 28, 65 | 33, 66 | 49, 67 | 80, 68 | 83, 69 | 32, 70 | 62, 71 | 50, 72 | 69, 73 | 4, 74 | 20, 75 | 73, 76 | 74, 77 | 72, 78 | 43, 79 | 54, 80 | 22, 81 | 60, 82 | 61, 83 | 63, 84 | 64, 85 | 65 86 | ] 87 | 88 | export default newOrder -------------------------------------------------------------------------------- /src/utils/topOrder.ts: -------------------------------------------------------------------------------- 1 | const topOrder = [ 2 | 65, 3 | 60, 4 | 61, 5 | 38, 6 | 6, 7 | 54, 8 | 3, 9 | 5, 10 | 63, 11 | 36, 12 | 12, 13 | 58, 14 | 64, 15 | 84, 16 | 15, 17 | 66, 18 | 72, 19 | 73, 20 | 17, 21 | 43, 22 | 18, 23 | 4, 24 | 29, 25 | 32, 26 | 59, 27 | 74, 28 | 13, 29 | 10, 30 | 67, 31 | 68, 32 | 69, 33 | 41, 34 | 7, 35 | 51, 36 | 11, 37 | 37, 38 | 44, 39 | 62, 40 | 52, 41 | 33, 42 | 78, 43 | 76, 44 | 79, 45 | 46, 46 | 45, 47 | 55, 48 | 80, 49 | 70, 50 | 27, 51 | 34, 52 | 30, 53 | 39, 54 | 22, 55 | 53, 56 | 8, 57 | 56, 58 | 40, 59 | 35, 60 | 16, 61 | 81, 62 | 71, 63 | 85, 64 | 83, 65 | 14, 66 | 9, 67 | 42, 68 | 69 | ] 70 | 71 | export default topOrder; -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es5", 4 | "lib": [ 5 | "dom", 6 | "dom.iterable", 7 | "esnext" 8 | ], 9 | "allowJs": true, 10 | "skipLibCheck": true, 11 | "noImplicitAny": true, 12 | "esModuleInterop": true, 13 | "allowSyntheticDefaultImports": true, 14 | "strict": true, 15 | "forceConsistentCasingInFileNames": true, 16 | "noFallthroughCasesInSwitch": true, 17 | "module": "esnext", 18 | "moduleResolution": "node", 19 | "resolveJsonModule": true, 20 | "isolatedModules": true, 21 | "noEmit": true, 22 | "jsx": "react-jsx" 23 | }, 24 | "include": ["src", "src/custom.d.ts", "global.d.ts", "src/declarations.d.ts",] 25 | } 26 | --------------------------------------------------------------------------------