├── .gitignore ├── README.md ├── package-lock.json ├── package.json ├── public ├── favicon.ico ├── index.html ├── logo192.png ├── logo512.png ├── manifest.json └── robots.txt ├── src ├── App.js ├── App.test.js ├── assets │ ├── Discord-Logo-White.svg │ ├── Discord.svg │ ├── adventurer.svg │ ├── bubble.svg │ ├── cards.svg │ ├── e-people-1.svg │ ├── e-people-2.svg │ ├── e-people-3.svg │ ├── eksi-code-logo.png │ ├── girl.svg │ ├── github-original.svg │ ├── laptoper.svg │ ├── plane.svg │ ├── telegram.svg │ ├── testbg1.jpeg │ ├── testbg2.jpeg │ └── twitter-original.svg ├── components │ ├── AcikOfis.js │ ├── Amacimiz.js │ ├── Blog.js │ ├── BlogPost.js │ ├── Footer.js │ ├── Gizlilik.js │ ├── Iletisim.js │ ├── Kariyer.js │ ├── Kaynaklar.js │ ├── Kurallar.js │ ├── Main.js │ ├── Nav.js │ ├── Projeler.js │ ├── Sidenav.js │ └── Telegram.js ├── index.js ├── index.scss ├── reportWebVitals.js ├── scss │ ├── _amacimiz.scss │ ├── _blog.scss │ ├── _blogpost.scss │ ├── _footer.scss │ ├── _global.scss │ ├── _header.scss │ ├── _iletisim.scss │ ├── _jumbotron.scss │ ├── _kariyer.scss │ ├── _kaynaklar.scss │ ├── _main.scss │ ├── _media.scss │ ├── _mixins.scss │ ├── _nav.scss │ ├── _projeler.scss │ ├── _sidenav.scss │ ├── _telegram.scss │ └── _variables.scss └── setupTests.js └── yarn.lock /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | 6 | # testing 7 | /coverage 8 | 9 | # production 10 | /build 11 | 12 | # misc 13 | .DS_Store 14 | .env.local 15 | .env.development.local 16 | .env.test.local 17 | .env.production.local 18 | 19 | npm-debug.log* 20 | yarn-debug.log* 21 | yarn-error.log* 22 | 23 | 24 | .DS_STORE 25 | node_modules 26 | scripts/flow/*/.flowconfig 27 | .flowconfig 28 | *~ 29 | *.pyc 30 | .grunt 31 | _SpecRunner.html 32 | __benchmarks__ 33 | build/ 34 | remote-repo/ 35 | coverage/ 36 | .module-cache 37 | fixtures/dom/public/react-dom.js 38 | fixtures/dom/public/react.js 39 | test/the-files-to-test.generated.js 40 | *.log* 41 | chrome-user-data 42 | *.sublime-project 43 | *.sublime-workspace 44 | .idea 45 | *.iml 46 | .vscode 47 | *.swp 48 | *.swo 49 | 50 | packages/react-devtools-core/dist 51 | packages/react-devtools-extensions/chrome/build 52 | packages/react-devtools-extensions/chrome/*.crx 53 | packages/react-devtools-extensions/chrome/*.pem 54 | packages/react-devtools-extensions/firefox/build 55 | packages/react-devtools-extensions/firefox/*.xpi 56 | packages/react-devtools-extensions/firefox/*.pem 57 | packages/react-devtools-extensions/shared/build 58 | packages/react-devtools-inline/dist 59 | packages/react-devtools-shell/dist -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Projeyi çalıştırmak için: 2 | * npm run start 3 | 4 | Projeyi derlemek için: 5 | * npm run build 6 | 7 | SASS Açıklaması: 8 | 9 | * Bu projede Sass Kullanılmıştır, dosyalara /scss klasöründen ulaşabilirsiniz. 10 | * Her React componenti için /scss klasöründe ayrı bir scss dosyası oluşturup App.scss dosyasına import etmelisiniz. 11 | 12 | * Variable tanımlarken sass yerine css variable kullanınınız. _variables.scss dosyası içerisinde :root betiği içerisinde tanımlanmalıdır. 13 | * Sass kodları yazılırken BEM metodolojisi kullanılmaya çalışılmıştır. Ayrıntılı bilgi için http://getbem.com/ 14 | * Pozisyonlama için Materializecss kullanılmıştır. -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "eksicode-frontend", 3 | "version": "0.1.0", 4 | "private": true, 5 | "dependencies": { 6 | "@testing-library/jest-dom": "^5.11.4", 7 | "@testing-library/react": "^11.1.0", 8 | "@testing-library/user-event": "^12.1.10", 9 | "html-react-parser": "^1.2.4", 10 | "materialize-css": "^1.0.0", 11 | "node-sass": "^5.0.0", 12 | "react": "^17.0.1", 13 | "react-dom": "^17.0.1", 14 | "react-router-dom": "^5.2.0", 15 | "react-scripts": "4.0.2", 16 | "showdown": "^1.9.1", 17 | "web-vitals": "^1.0.1" 18 | }, 19 | "scripts": { 20 | "start": "react-scripts start", 21 | "build": "react-scripts build", 22 | "test": "react-scripts test", 23 | "eject": "react-scripts eject" 24 | }, 25 | "eslintConfig": { 26 | "extends": [ 27 | "react-app", 28 | "react-app/jest" 29 | ] 30 | }, 31 | "browserslist": { 32 | "production": [ 33 | ">0.2%", 34 | "not dead", 35 | "not op_mini all" 36 | ], 37 | "development": [ 38 | "last 1 chrome version", 39 | "last 1 firefox version", 40 | "last 1 safari version" 41 | ] 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Eksicode/eksicode-frontend/9641676a0abc3fabca009bc62d2193f371762efd/public/favicon.ico -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 12 | 13 | 14 | 15 | 16 | 17 | 21 | 25 | 29 | 30 | 34 | 35 | 44 | EksiCode.org 45 | 46 | 47 | 48 |
49 | 59 | 60 | 61 | -------------------------------------------------------------------------------- /public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Eksicode/eksicode-frontend/9641676a0abc3fabca009bc62d2193f371762efd/public/logo192.png -------------------------------------------------------------------------------- /public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Eksicode/eksicode-frontend/9641676a0abc3fabca009bc62d2193f371762efd/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.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import Nav from './components/Nav'; 3 | import { BrowserRouter, Route } from 'react-router-dom'; 4 | import Main from './components/Main'; 5 | import Amacimiz from './components/Amacimiz'; 6 | import Kaynaklar from './components/Kaynaklar'; 7 | import Telegram from './components/Telegram'; 8 | import Projeler from './components/Projeler'; 9 | import Iletisim from './components/Iletisim'; 10 | import Footer from './components/Footer'; 11 | import Sidenav from './components/Sidenav'; 12 | import Kurallar from './components/Kurallar'; 13 | import Gizlilik from './components/Gizlilik'; 14 | import Blog from './components/Blog'; 15 | import BlogPost from './components/BlogPost'; 16 | import AcikOfis from './components/AcikOfis'; 17 | 18 | class App extends Component { 19 | render() { 20 | return ( 21 | 22 |
23 |
38 | 39 | ); 40 | } 41 | } 42 | 43 | export default App; 44 | 45 | 46 | 47 | -------------------------------------------------------------------------------- /src/App.test.js: -------------------------------------------------------------------------------- 1 | import { render, screen } from '@testing-library/react'; 2 | import App from './App'; 3 | 4 | test('renders learn react link', () => { 5 | render(); 6 | const linkElement = screen.getByText(/learn react/i); 7 | expect(linkElement).toBeInTheDocument(); 8 | }); 9 | -------------------------------------------------------------------------------- /src/assets/Discord-Logo-White.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /src/assets/Discord.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 8 | 12 | 13 | -------------------------------------------------------------------------------- /src/assets/adventurer.svg: -------------------------------------------------------------------------------- 1 | Asset 6 -------------------------------------------------------------------------------- /src/assets/bubble.svg: -------------------------------------------------------------------------------- 1 | bubble_1 -------------------------------------------------------------------------------- /src/assets/cards.svg: -------------------------------------------------------------------------------- 1 | cards -------------------------------------------------------------------------------- /src/assets/e-people-1.svg: -------------------------------------------------------------------------------- 1 | e-people1 -------------------------------------------------------------------------------- /src/assets/e-people-2.svg: -------------------------------------------------------------------------------- 1 | e-people2 -------------------------------------------------------------------------------- /src/assets/e-people-3.svg: -------------------------------------------------------------------------------- 1 | e-people3 -------------------------------------------------------------------------------- /src/assets/eksi-code-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Eksicode/eksicode-frontend/9641676a0abc3fabca009bc62d2193f371762efd/src/assets/eksi-code-logo.png -------------------------------------------------------------------------------- /src/assets/girl.svg: -------------------------------------------------------------------------------- 1 | girl_1 -------------------------------------------------------------------------------- /src/assets/github-original.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/laptoper.svg: -------------------------------------------------------------------------------- 1 | laptoper_1 -------------------------------------------------------------------------------- /src/assets/plane.svg: -------------------------------------------------------------------------------- 1 | Asset 10 -------------------------------------------------------------------------------- /src/assets/telegram.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 8 | 10 | 11 | -------------------------------------------------------------------------------- /src/assets/testbg1.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Eksicode/eksicode-frontend/9641676a0abc3fabca009bc62d2193f371762efd/src/assets/testbg1.jpeg -------------------------------------------------------------------------------- /src/assets/testbg2.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Eksicode/eksicode-frontend/9641676a0abc3fabca009bc62d2193f371762efd/src/assets/testbg2.jpeg -------------------------------------------------------------------------------- /src/assets/twitter-original.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/components/AcikOfis.js: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from 'react'; 2 | import showdown from 'showdown'; 3 | import parse from 'html-react-parser'; 4 | 5 | export default function Acikofis() { 6 | const [content, setContent] = useState(""); 7 | const [title, setTitle] = useState(""); 8 | 9 | const amacimiz = "https://api.eksicode.org/sayfalars/4"; 10 | 11 | 12 | useEffect(() => { 13 | fetch(amacimiz) 14 | .then( 15 | data => data.json() 16 | ) 17 | .then(text => { 18 | const converter = new showdown.Converter(); 19 | setContent(converter.makeHtml(text.content)); 20 | setTitle(converter.makeHtml(text.title)); 21 | document.title = "Eksicode.org - " + text.title 22 | }) 23 | }, []); 24 | 25 | return ( 26 |
27 |
28 |
29 |
30 |
31 |

{parse(title)}

32 |
33 |
34 |
35 | {parse(content)} 36 |
37 |
38 |
39 | ) 40 | } 41 | -------------------------------------------------------------------------------- /src/components/Amacimiz.js: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from 'react'; 2 | import showdown from 'showdown'; 3 | import parse from 'html-react-parser'; 4 | 5 | export default function Amacimiz() { 6 | const [content, setContent] = useState(""); 7 | const [title, setTitle] = useState(""); 8 | 9 | const amacimiz = "https://api.eksicode.org/sayfalars/3"; 10 | 11 | 12 | useEffect(() => { 13 | fetch(amacimiz) 14 | .then( 15 | data => data.json() 16 | ) 17 | .then(text => { 18 | const converter = new showdown.Converter(); 19 | setContent(converter.makeHtml(text.content)); 20 | setTitle(converter.makeHtml(text.title)); 21 | document.title = "Eksicode.org - " + text.title 22 | }) 23 | }, []); 24 | 25 | return ( 26 |
27 |
28 |
29 |
30 |
31 |

{parse(title)}

32 |
33 |
34 |
35 | {parse(content)} 36 |
37 |
38 |
39 | ) 40 | } -------------------------------------------------------------------------------- /src/components/Blog.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from "react"; 2 | import { Link } from "react-router-dom"; 3 | 4 | class Blog extends Component { 5 | constructor(props) { 6 | super(props); 7 | this.state = { 8 | posts: {} 9 | } 10 | } 11 | componentWillMount() { 12 | fetch("http://api.eksicode.org/blogs") 13 | .then(res => res.json()) 14 | .then(posts => this.setState({posts})) 15 | // Burada çekilen postlar listelenecek 16 | } 17 | render() { 18 | return ( 19 |
20 |
21 |
22 |
23 |
24 | Merhaba Dünya 25 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

26 |
27 |
28 | Devamını Oku {/* Buraya otomatik olarak post linki verilecek */} 29 |
30 |
31 |
32 |
33 |
34 | ); 35 | } 36 | } 37 | 38 | export default Blog; 39 | -------------------------------------------------------------------------------- /src/components/BlogPost.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from "react"; 2 | //import { Link } from "react-router-dom"; 3 | 4 | class BlogPost extends Component { 5 | render() { 6 | return ( 7 |
8 |
9 |
10 | Merhaba Dünya 11 |

Merhaba Dünya

12 |

13 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac erat ut orci tincidunt fringilla non ac enim. Nullam et orci hendrerit, dictum lacus id, interdum mauris. Cras non volutpat enim. Praesent auctor varius vestibulum. Etiam et sagittis sapien, quis eleifend nisi. Aliquam tempus, ex nec congue ultricies, risus quam hendrerit massa, eget vehicula quam nisi nec metus. Donec ut leo neque. Aenean vel est consectetur, pellentesque ante a, elementum ligula. Morbi mauris nisl, bibendum vel pretium sit amet, sollicitudin vehicula purus. In pretium urna et quam bibendum, at commodo mi sodales. 14 |

15 |

16 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac erat ut orci tincidunt fringilla non ac enim. Nullam et orci hendrerit, dictum lacus id, interdum mauris. Cras non volutpat enim. Praesent auctor varius vestibulum. Etiam et sagittis sapien, quis eleifend nisi. Aliquam tempus, ex nec congue ultricies, risus quam hendrerit massa, eget vehicula quam nisi nec metus. Donec ut leo neque. Aenean vel est consectetur, pellentesque ante a, elementum ligula. Morbi mauris nisl, bibendum vel pretium sit amet, sollicitudin vehicula purus. In pretium urna et quam bibendum, at commodo mi sodales. 17 |

18 |

19 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac erat ut orci tincidunt fringilla non ac enim. Nullam et orci hendrerit, dictum lacus id, interdum mauris. Cras non volutpat enim. Praesent auctor varius vestibulum. Etiam et sagittis sapien, quis eleifend nisi. Aliquam tempus, ex nec congue ultricies, risus quam hendrerit massa, eget vehicula quam nisi nec metus. Donec ut leo neque. Aenean vel est consectetur, pellentesque ante a, elementum ligula. Morbi mauris nisl, bibendum vel pretium sit amet, sollicitudin vehicula purus. In pretium urna et quam bibendum, at commodo mi sodales. 20 |

21 |

22 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac erat ut orci tincidunt fringilla non ac enim. Nullam et orci hendrerit, dictum lacus id, interdum mauris. Cras non volutpat enim. Praesent auctor varius vestibulum. Etiam et sagittis sapien, quis eleifend nisi. Aliquam tempus, ex nec congue ultricies, risus quam hendrerit massa, eget vehicula quam nisi nec metus. Donec ut leo neque. Aenean vel est consectetur, pellentesque ante a, elementum ligula. Morbi mauris nisl, bibendum vel pretium sit amet, sollicitudin vehicula purus. In pretium urna et quam bibendum, at commodo mi sodales. 23 |

24 |

25 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac erat ut orci tincidunt fringilla non ac enim. Nullam et orci hendrerit, dictum lacus id, interdum mauris. Cras non volutpat enim. Praesent auctor varius vestibulum. Etiam et sagittis sapien, quis eleifend nisi. Aliquam tempus, ex nec congue ultricies, risus quam hendrerit massa, eget vehicula quam nisi nec metus. Donec ut leo neque. Aenean vel est consectetur, pellentesque ante a, elementum ligula. Morbi mauris nisl, bibendum vel pretium sit amet, sollicitudin vehicula purus. In pretium urna et quam bibendum, at commodo mi sodales. 26 |

27 |
28 |
29 |
30 | ); 31 | } 32 | } 33 | 34 | export default BlogPost; 35 | -------------------------------------------------------------------------------- /src/components/Footer.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from "react"; 2 | import { Link } from "react-router-dom"; 3 | import GithubLogo from "../assets/github-original.svg"; 4 | import TwitterLogo from "../assets/twitter-original.svg"; 5 | import DiscordLogo from "../assets/Discord-Logo-White.svg"; 6 | 7 | class Footer extends Component { 8 | render() { 9 | return ( 10 | 55 | ); 56 | } 57 | } 58 | 59 | export default Footer; 60 | -------------------------------------------------------------------------------- /src/components/Gizlilik.js: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from 'react'; 2 | import showdown from 'showdown'; 3 | import parse from 'html-react-parser'; 4 | 5 | export default function Gizlilik() { 6 | const [content, setContent] = useState(""); 7 | const [title, setTitle] = useState(""); 8 | 9 | const gizlilik = "https://api.eksicode.org/sayfalars/2"; 10 | 11 | 12 | useEffect(() => { 13 | fetch(gizlilik) 14 | .then( 15 | data => data.json() 16 | ) 17 | .then(text => { 18 | const converter = new showdown.Converter(); 19 | setContent(converter.makeHtml(text.content)); 20 | setTitle(converter.makeHtml(text.title)); 21 | document.title = "Eksicode.org - " + text.title 22 | }) 23 | }, []); 24 | 25 | return ( 26 |
27 |
28 |
29 |
30 |
31 |

{parse(title)}

32 |
33 |
34 |
35 | {parse(content)} 36 |
37 |
38 |
39 | ) 40 | } -------------------------------------------------------------------------------- /src/components/Iletisim.js: -------------------------------------------------------------------------------- 1 | import React/*, { Component }*/ from 'react'; 2 | 3 | const Iletisim = () => { 4 | document.title = 'Eksicode.org - İletişim'; 5 | return ( 6 |
7 |

İletişim

8 |

sdfdsfsd

9 |
10 | ); 11 | } 12 | 13 | export default Iletisim; 14 | -------------------------------------------------------------------------------- /src/components/Kariyer.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from "react"; 2 | import M from "materialize-css"; 3 | 4 | class Kariyer extends Component { 5 | componentDidMount() { 6 | const collapsible = document.querySelector(".collapsible"); 7 | const instance = M.Collapsible.init(collapsible, { 8 | accordion: false}); 9 | document.querySelectorAll(".collapsible li").forEach(i => { 10 | i.addEventListener("click", function() { 11 | instance.open(i); 12 | }); 13 | }); 14 | document.querySelectorAll(".collapsible li").forEach(i => { 15 | i.addEventListener("click", function() { 16 | instance.close(i); 17 | }); 18 | }); 19 | } 20 | 21 | render() { 22 | return ( 23 |
24 | 406 |
407 | ); 408 | } 409 | } 410 | 411 | export default Kariyer; 412 | -------------------------------------------------------------------------------- /src/components/Kaynaklar.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from "react"; 2 | import debounce from 'lodash/debounce'; 3 | 4 | class Kaynaklar extends Component { 5 | constructor(props) { 6 | super(props); 7 | this.state = { 8 | sources: [], 9 | channels: [], 10 | filterChannelID: "", 11 | pageCount: [], 12 | searchQuery: "", 13 | pageNum: 0, 14 | loading: false 15 | }; 16 | this.fetchKaynakDataDebounced = debounce(this.fetchKaynakData, 250) 17 | this.fetchPageCountDebounced = debounce(this.fetchPageCount, 250) 18 | } 19 | componentWillMount() { 20 | document.title = "Eksicode.org - Kaynaklar"; 21 | this.fetchKaynakData(); 22 | this.fetchTelegramChannels(); 23 | this.fetchPageCount(); 24 | } 25 | async fetchTelegramChannels() { 26 | const res = await fetch("https://api.eksicode.org/telegrams"); 27 | const channels = await res.json(); 28 | this.setState({channels}); 29 | } 30 | async fetchPageCount() { 31 | const res = await fetch(`https://api.eksicode.org/kaynaklars/count?${ 32 | this.state.filterChannelID ? "&doc_tg_ch=" + this.state.filterChannelID : "" 33 | }${this.state.searchQuery ? "&doc_name_contains=" + this.state.searchQuery : ""}&approved=true`); 34 | const data = await res.json(); 35 | 36 | const count = parseInt(data, 10); 37 | 38 | let pageCount; 39 | 40 | if (count % 24 > 0) { 41 | pageCount = Math.floor(count / 24) + 1; 42 | } else { 43 | pageCount = Math.floor(count / 24); 44 | } 45 | 46 | this.setState({ pageCount }); 47 | } 48 | async fetchKaynakData() { 49 | this.setState({ loading: true }); 50 | const res = await fetch( 51 | `https://api.eksicode.org/kaynaklars?${ 52 | this.state.searchQuery ? "doc_name_contains=" + this.state.searchQuery : "" 53 | }&_start=${this.state.pageNum * 24}&_limit=${24}${ 54 | this.state.filterChannelID ? "&doc_tg_ch=" + this.state.filterChannelID : "" 55 | }&approved=true` 56 | ); 57 | const data = await res.json(); 58 | 59 | if (data.length) { 60 | this.setState({ sources: data }); 61 | } else { 62 | this.setState({ sources: "none" }); 63 | } 64 | this.setState({ loading: false }); 65 | } 66 | componentDidUpdate(previousProps, previousState) { 67 | if (this.state.pageNum !== previousState.pageNum || 68 | this.state.filterChannelID !== previousState.filterChannelID || 69 | this.state.searchQuery !== previousState.searchQuery) { 70 | this.fetchKaynakDataDebounced(); 71 | this.fetchPageCountDebounced(); 72 | } 73 | 74 | window.scrollTo(0, 0) 75 | 76 | if ((this.state.filterChannelID !== previousState.filterChannelID || 77 | this.state.searchQuery !== previousState.searchQuery) && this.state.pageNum > 0) { 78 | this.setState({ pageNum: 0 }); 79 | } 80 | } 81 | nextPage() { 82 | this.setState(state => { 83 | return { pageNum: state.pageNum + 1 }; 84 | }); 85 | } 86 | prevPage() { 87 | if (this.state.pageNum > 0) { 88 | this.setState(state => { 89 | return { pageNum: state.pageNum - 1 }; 90 | }); 91 | } 92 | } 93 | createPages() { 94 | let pages = []; 95 | for (let i = 0; i < this.state.pageCount; i++) { 96 | pages.push( 97 |
  • 102 | 103 |
    • 104 | ); 105 | } 106 | return pages; 107 | } 108 | render() { 109 | return ( 110 |
    111 |
    112 |
    113 |

    Kaynaklar

    114 |
    115 |
    116 |

    117 | İlgilendiğin yazılım dili veya konular hakkında 118 | daha önce gruplarda paylaşılmış kaynakları burada bulabilirsin. 119 |

    120 |
    121 |
    122 |
    123 |
    124 | 131 |
    132 |
    133 | this.setState({searchQuery: e.target.value})} type="text" /> 134 |
    135 |
    136 | {(() => { 137 | if (this.state.loading) { 138 | return ( 139 |
    140 |
    141 |
    142 |
    143 |
    144 |
    145 |
    146 |
    147 |
    148 |
    149 |
    150 |
    151 |
    152 |
    153 |
    154 | ); 155 | } 156 | if (this.state.sources.length && this.state.sources !== "none") { 157 | return ( 158 |
    159 | 176 |
      177 |
    • 185 | 186 | chevron_left 187 | 188 |
      • 189 | {this.createPages()} 190 |
    • 199 | 200 | chevron_right 201 | 202 |
      • 203 |
    204 |
    205 | ); 206 | } else if (this.state.sources === "none") { 207 | return ( 208 |
    209 | Hiç sonuç yok. 210 |
    211 | ) 212 | } 213 | })()} 214 |
    215 | ); 216 | } 217 | } 218 | 219 | export default Kaynaklar; 220 | -------------------------------------------------------------------------------- /src/components/Kurallar.js: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from 'react'; 2 | import showdown from 'showdown'; 3 | import parse from 'html-react-parser'; 4 | 5 | export default function Kurallar() { 6 | const [content, setContent] = useState(""); 7 | const [title, setTitle] = useState(""); 8 | 9 | const kurallar = "https://api.eksicode.org/sayfalars/1"; 10 | 11 | 12 | useEffect(() => { 13 | fetch(kurallar) 14 | .then( 15 | data => data.json() 16 | ) 17 | .then(text => { 18 | const converter = new showdown.Converter(); 19 | setContent(converter.makeHtml(text.content)); 20 | setTitle(converter.makeHtml(text.title)); 21 | document.title = "Eksicode.org - " + text.title 22 | }) 23 | }, []); 24 | 25 | return ( 26 |
    27 |
    28 |
    29 |

    {parse(title)}

    30 |
    31 |
    32 |
    33 | {parse(content)} 34 |
    35 |
    36 | ) 37 | } -------------------------------------------------------------------------------- /src/components/Main.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from "react"; 2 | import { Link} from 'react-router-dom'; 3 | import M from "materialize-css"; 4 | import Plane from '../assets/plane.svg'; 5 | import Adventurer from '../assets/adventurer.svg'; 6 | import Laptoper from '../assets/laptoper.svg'; 7 | import Girl from '../assets/girl.svg'; 8 | import Cards from '../assets/cards.svg'; 9 | import Buble from '../assets/bubble.svg'; 10 | import People1 from '../assets/e-people-1.svg'; 11 | import People2 from '../assets/e-people-2.svg'; 12 | import People3 from '../assets/e-people-3.svg'; 13 | 14 | class Main extends Component { 15 | componentDidMount() { 16 | const carousel = document.querySelector(".carousel"); 17 | const instance = M.Carousel.init(carousel, { 18 | dist: -50, 19 | padding: 100, 20 | }); 21 | instance.next(); 22 | instance.prev(); 23 | } 24 | render() { 25 | document.title = "Eksicode"; 26 | return ( 27 |
    28 |
    29 |
    30 |
    31 |
    32 |

    Yazılımcı Geliştirme Platformu

    33 |

    34 | ekşiCode, yazılımcıların serüveninde onları yalnız bırakmaz, 35 | arkasında durur. 36 |

    37 |
    38 |
    39 |
    40 | 45 |
    46 |
    47 |
    48 |
    49 |
    50 |

    Kaynaklar

    51 |
    52 |

    53 | Geliştirdiğin veya öğrenmek istediğin programlama diline ait 54 | içerikler bulabilirsin. 55 |

    56 |
    57 |
    58 |
    59 | 64 |
    65 |
    66 |
    67 |
    68 |
    69 |

    Projeler

    70 |
    71 |

    72 | Aktif açık kaynak projelerimize katılabilirsin. 73 |

    74 |
    75 |
    76 |
    77 | 82 |
    83 |
    84 |
    85 |
    86 |
    87 |

    Telegram Grupları

    88 |
    89 |

    90 | Telegram gruplarına katılıp öğrenirken öğretebilirsin. 91 |

    92 |
    93 |
    94 |
    95 | 100 |
    101 | {/*
    102 |
    103 |
    104 |
    105 |

    Discord

    106 |
    107 |

    108 | Discord sunucumuzda sesli sohbete katılabilirsin. 109 |

    110 |
    111 |
    112 |
    113 | 118 |
    */} 119 |
    120 |
    121 |
    122 |
    123 |

    İş İlanları

    124 |
    125 |

    126 | Kendine uygun açık pozisyonlara bakabilir ya da size uygun 127 | kişiyi bulabilirsiniz. 128 |

    129 |
    130 |
    131 |
    132 | 137 |
    138 |
    139 |
    140 |
    141 |
    142 |

    ekşi sözlük'ten

    143 |
    144 |
    145 |
    146 |
    147 | 152 |

    153 | yazarları ve okurları alanlarına göre farklı telegram 154 | gruplarında birleştiren faydalı bir oluşum. 155 |

    156 | karayip lordu 157 |
    158 | 163 |
    164 |
    165 |
    166 | 171 |

    172 | sözlük'te yazılımla uğraşan yazarların bir araya gelip 173 | bilgi alışverişinde bulunabilmesi açısından faydalı bir 174 | oluşum olacağını düşündüğüm platformdur. 175 |

    176 | sturm 177 |
    178 | 183 |
    184 |
    185 |
    186 | 191 |

    192 | yazılıma ilgisi olan her seviyeden insanı biraraya 193 | getiren; konularına göre birden fazla telegram grubu 194 | içeren; aktif ve yardımsever topluluğun olduğu platform. 195 |

    196 | arifm 197 |
    198 | 203 |
    204 |
    205 |
    206 |
    207 |
    208 |
    209 | 214 |

    215 | yazılıma ilgisi olan her seviyeden insanı biraraya 216 | getiren; konularına göre birden fazla telegram grubu 217 | içeren; aktif ve yardımsever topluluğun olduğu platform. 218 |

    219 | arifm 220 |
    221 | 226 |
    227 |
    228 |
    229 | 234 |

    235 | sözlük'te yazılımla uğraşan yazarların bir araya gelip 236 | bilgi alışverişinde bulunabilmesi açısından faydalı bir 237 | oluşum olacağını düşündüğüm platformdur. 238 |

    239 | sturm 240 |
    241 | 246 |
    247 |
    248 |
    249 | 254 |

    255 | yazarları ve okurları alanlarına göre farklı telegram 256 | gruplarında birleştiren faydalı bir oluşum. 257 |

    258 | karayip lordu 259 |
    260 | 265 |
    266 |
    267 |
    268 |
    269 |
    270 |
    271 |
    272 | ); 273 | } 274 | } 275 | 276 | export default Main; 277 | -------------------------------------------------------------------------------- /src/components/Nav.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { Link } from 'react-router-dom'; 3 | import logo from '../assets/eksi-code-logo.png'; 4 | 5 | class Nav extends Component { 6 | render() { 7 | return ( 8 |
    9 | 25 |
    26 | ) 27 | } 28 | } 29 | 30 | export default Nav; 31 | -------------------------------------------------------------------------------- /src/components/Projeler.js: -------------------------------------------------------------------------------- 1 | import React/*, { Component }*/ from 'react'; 2 | 3 | const Projeler = () => { 4 | document.title = 'Eksicode.org - Projeler'; 5 | return ( 6 |
    7 |

    Projeler

    8 |

    sdfdsfsd

    9 |
    10 | ); 11 | } 12 | 13 | export default Projeler; -------------------------------------------------------------------------------- /src/components/Sidenav.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { Link } from 'react-router-dom'; 3 | import M from 'materialize-css'; 4 | 5 | class Sidenav extends Component { 6 | componentDidMount() { 7 | const sidenav = document.querySelector(".sidenav"); 8 | const instance = M.Sidenav.init(sidenav, {"edge": "right"}); 9 | document.querySelector(".mobile").addEventListener("click", function() { 10 | instance.open(); 11 | }); 12 | document.querySelectorAll(".sidenav li").forEach(i => { 13 | i.addEventListener("click", function() { 14 | instance.close(); 15 | }); 16 | }); 17 | } 18 | render() { 19 | return ( 20 |
      21 | 22 |
    • AMACIMIZ NEDİR?
      • 23 |
    • TELEGRAM GRUPLARI
      • 24 |
    • KAYNAKLAR
      • 25 |
    • AÇIK OFİS SAATİ
      • 26 | {/* 27 |
    • BLOG
      • 28 |
    • AMACIMIZ
      • 29 |
    • PROJELER
      • 30 |
    • İŞ İLANLARI
      • 31 |
    • İLETİŞİM
      • */} 32 |
    33 | ) 34 | } 35 | } 36 | 37 | export default Sidenav; -------------------------------------------------------------------------------- /src/components/Telegram.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from "react"; 2 | import TelegramLogo from "../assets/telegram.svg"; 3 | import { Link } from "react-router-dom"; 4 | 5 | class Telegram extends Component { 6 | constructor(props) { 7 | super(props); 8 | this.state = { 9 | groups: [] 10 | }; 11 | } 12 | 13 | componentWillMount() { 14 | document.title = "Eksicode.org - Telegram Grupları"; 15 | fetch("https://api.eksicode.org/telegrams?_sort=ListOrder:ASC") 16 | .then(res => res.json()) 17 | .then(list => this.setState({ groups: list })) 18 | } 19 | render() { 20 | const { groups } = this.state; 21 | return ( 22 |
    23 |
    24 |
    25 |

    Telegram Grupları

    26 |
    27 |
    28 |

    29 | İlgilendiğin yazılım dili veya konular ile ilgili 30 | telegram gruplarımıza katılabilirsin. 31 | 32 |

    33 | 34 | 40 | 41 | Telegram'ı İndir 42 | 43 |

    44 |

    45 | 46 | Grup Kuralları için tıklayın 47 | 48 |
    49 |
    50 | 51 |
    52 | {groups.length > 0 && groups.map((e, id) => { 53 | return ( 54 |
    55 |
    56 |
    57 | {e.name}/ 58 |

    {e.name}

    59 |

    {e.members} Üye

    60 |
    61 | 67 | 73 | Katıl 74 | 75 |
    76 |
    77 | ); 78 | })} 79 |
    80 |
    81 | ); 82 | } 83 | } 84 | 85 | export default Telegram; 86 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.scss'; 4 | import App from './App'; 5 | import reportWebVitals from './reportWebVitals'; 6 | 7 | ReactDOM.render( 8 | 9 | 10 | , 11 | document.getElementById('root') 12 | ); 13 | 14 | // If you want to start measuring performance in your app, pass a function 15 | // to log results (for example: reportWebVitals(console.log)) 16 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 17 | reportWebVitals(); 18 | -------------------------------------------------------------------------------- /src/index.scss: -------------------------------------------------------------------------------- 1 | @import 'scss/variables'; 2 | @import 'scss/mixins'; 3 | 4 | @import 'scss/global'; 5 | 6 | @import 'scss/media'; 7 | 8 | // Import Sass Components 9 | @import 'scss/nav'; 10 | @import 'scss/header'; 11 | @import 'scss/footer'; 12 | @import 'scss/amacimiz'; 13 | @import 'scss/iletisim'; 14 | @import 'scss/kariyer'; 15 | @import 'scss/kaynaklar'; 16 | @import 'scss/main'; 17 | @import 'scss/blog'; 18 | @import 'scss/blogpost'; 19 | @import 'scss/projeler'; 20 | @import 'scss/telegram'; 21 | @import 'scss/jumbotron'; 22 | @import 'scss/sidenav'; -------------------------------------------------------------------------------- /src/reportWebVitals.js: -------------------------------------------------------------------------------- 1 | const reportWebVitals = onPerfEntry => { 2 | if (onPerfEntry && onPerfEntry instanceof Function) { 3 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 4 | getCLS(onPerfEntry); 5 | getFID(onPerfEntry); 6 | getFCP(onPerfEntry); 7 | getLCP(onPerfEntry); 8 | getTTFB(onPerfEntry); 9 | }); 10 | } 11 | }; 12 | 13 | export default reportWebVitals; 14 | -------------------------------------------------------------------------------- /src/scss/_amacimiz.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Eksicode/eksicode-frontend/9641676a0abc3fabca009bc62d2193f371762efd/src/scss/_amacimiz.scss -------------------------------------------------------------------------------- /src/scss/_blog.scss: -------------------------------------------------------------------------------- 1 | .card-action a { 2 | color: var(--eksicode) !important; 3 | } -------------------------------------------------------------------------------- /src/scss/_blogpost.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Eksicode/eksicode-frontend/9641676a0abc3fabca009bc62d2193f371762efd/src/scss/_blogpost.scss -------------------------------------------------------------------------------- /src/scss/_footer.scss: -------------------------------------------------------------------------------- 1 | .footer-logo img { 2 | height: 3rem; 3 | margin: 0 1rem; 4 | } 5 | .footer-copyright{ 6 | color: var(--beyaz); 7 | 8 | a:link { 9 | color: var(--light-yesil); 10 | } 11 | a:visited { 12 | color: var(--beyaz); 13 | } 14 | a:hover { 15 | color: var(--beyaz); 16 | text-decoration: underline; 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /src/scss/_global.scss: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: 'Montserrat', sans-serif; 3 | margin: 0; 4 | padding: 0; 5 | } 6 | 7 | .App { 8 | display: flex; 9 | min-height: 100vh; 10 | flex-direction: column; 11 | } 12 | 13 | .container { 14 | flex: 1 0 auto; 15 | } 16 | 17 | .btn-small, .btn-small:hover, .btn-small:focus { 18 | background-color: var(--eksicode); 19 | } 20 | 21 | .eksicode { 22 | background-color: var(--eksicode) !important; 23 | } 24 | 25 | .spinner-eksicode-only { 26 | border-color: var(--eksicode) !important; 27 | } 28 | 29 | .disabled { 30 | cursor: default; 31 | color: #cdcdcd; 32 | } 33 | 34 | .card-title { 35 | font-size: 1.2rem !important; 36 | } 37 | 38 | .material-icons { 39 | font-family: 'Material Icons'; 40 | font-weight: normal; 41 | font-style: normal; 42 | font-size: 24px; /* Preferred icon size */ 43 | display: inline-block; 44 | line-height: 1; 45 | text-transform: none; 46 | letter-spacing: normal; 47 | word-wrap: normal; 48 | white-space: nowrap; 49 | direction: ltr; 50 | 51 | /* Support for all WebKit browsers. */ 52 | -webkit-font-smoothing: antialiased; 53 | /* Support for Safari and Chrome. */ 54 | text-rendering: optimizeLegibility; 55 | 56 | /* Support for Firefox. */ 57 | -moz-osx-font-smoothing: grayscale; 58 | 59 | /* Support for IE. */ 60 | font-feature-settings: 'liga'; 61 | } 62 | 63 | input[type=text] { 64 | margin: 0 !important; 65 | border: 0 !important; 66 | box-shadow: none !important; 67 | } 68 | 69 | .description { 70 | padding: 2rem 0; 71 | } -------------------------------------------------------------------------------- /src/scss/_header.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Eksicode/eksicode-frontend/9641676a0abc3fabca009bc62d2193f371762efd/src/scss/_header.scss -------------------------------------------------------------------------------- /src/scss/_iletisim.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Eksicode/eksicode-frontend/9641676a0abc3fabca009bc62d2193f371762efd/src/scss/_iletisim.scss -------------------------------------------------------------------------------- /src/scss/_jumbotron.scss: -------------------------------------------------------------------------------- 1 | .jumbotron { 2 | // margin-top:-2.8em; 3 | background: var(--night); 4 | padding:2em 0; 5 | min-height:100vh; 6 | background-size: cover !important; 7 | 8 | &:before{ 9 | -webkit-filter: blur(10px) grayscale(0.4); 10 | filter: blur(10px) grayscale(0.4); 11 | } 12 | 13 | h1,h2,h3,h4,a{ 14 | color: white; 15 | font-weight: bold; 16 | } 17 | p { 18 | color: white; 19 | font-size: 1.5rem; 20 | margin: 2rem 0 4rem 0; 21 | } 22 | } -------------------------------------------------------------------------------- /src/scss/_kariyer.scss: -------------------------------------------------------------------------------- 1 | .collapsible { 2 | box-shadow: none; 3 | border-color: black; 4 | 5 | .collapsible-body { 6 | border-color: black; 7 | background: #f5f5f5; 8 | font-size: 1em; 9 | h6{ 10 | font-weight: 600; 11 | } 12 | ul{ 13 | padding-left:20px; 14 | } 15 | } 16 | .collapsible-header { 17 | border-color: black; 18 | display: block; 19 | .row { 20 | margin-left: 0; 21 | margin-right: 0; 22 | margin-bottom: 0; 23 | .job-title { 24 | margin-bottom: 0.5em; 25 | } 26 | .company-name { 27 | text-align: end; 28 | } 29 | .location { 30 | font-weight: 200; 31 | font-size: 0.8em; 32 | } 33 | .tags { 34 | margin-top: -1em; 35 | .chip { 36 | height: 20px; 37 | font-size: 10px; 38 | font-weight: 400; 39 | line-height: 20px; 40 | padding: 0 10px; 41 | border-radius: 10px; 42 | margin-bottom: 5px; 43 | margin-right: 5px; 44 | } 45 | .job-bg { 46 | background-color: var(--light-mavi); 47 | } 48 | } 49 | } 50 | } 51 | } 52 | .collapsible-header:focus { 53 | font-weight: 600; 54 | } 55 | -------------------------------------------------------------------------------- /src/scss/_kaynaklar.scss: -------------------------------------------------------------------------------- 1 | .search { 2 | label { 3 | color: var(--eksicode) !important; 4 | } 5 | input[type=text]:focus + label { 6 | color: var(--eksicode) !important; 7 | } 8 | input[type=text]:focus { 9 | border-bottom: 1px solid var(--eksicode) !important; 10 | box-shadow: 0 1px 0 0 var(--eksicode) !important; 11 | } 12 | } 13 | 14 | .input-field { 15 | .select-wrapper ul li>span { 16 | color: var(--eksicode) !important; 17 | } 18 | .dropdown-trigger:focus { 19 | border-bottom: 1px solid var(--eksicode) !important; 20 | } 21 | } 22 | 23 | .kaynaklar li { 24 | border-bottom: 1px solid #ccc; 25 | 26 | & a { 27 | display: block; 28 | padding: .8rem 0rem .8rem .8rem; 29 | } 30 | 31 | & :hover { 32 | color: var(--night); 33 | background: #e5e5e5 !important; 34 | text-decoration: none; 35 | } 36 | } 37 | 38 | .filters { 39 | grid-template-columns: auto auto auto auto auto auto; 40 | display: grid; 41 | grid-gap: 2rem; 42 | margin-bottom: 3rem; 43 | } 44 | 45 | 46 | .paging { 47 | display: inline-block; 48 | border: none; 49 | padding: .5rem .5rem; 50 | margin: 0px 0px 10px 0px; 51 | text-decoration: none; 52 | color: #ffffff; 53 | font-family: sans-serif; 54 | font-size: 1rem; 55 | cursor: pointer; 56 | text-align: center; 57 | transition: background 250ms ease-in-out, 58 | transform 150ms ease; 59 | -webkit-appearance: none; 60 | -moz-appearance: none; 61 | } 62 | 63 | .paging:hover, 64 | .paging:focus { 65 | background: var(--eksicode); 66 | } 67 | 68 | .paging:focus { 69 | outline: 1px solid #fff; 70 | outline-offset: -4px; 71 | } 72 | 73 | .paging:active { 74 | transform: scale(0.99); 75 | } 76 | 77 | 78 | 79 | 80 | .filter__groups { 81 | grid-column: 1 / 2; 82 | } 83 | 84 | .groups__select { 85 | display: block !important; 86 | color: var(--gray-input); 87 | border: 0; 88 | border-radius: 0; 89 | outline: 0; 90 | padding: 0; 91 | border-bottom: 1px solid var(--gray-input); 92 | border-bottom-color: var(--gray-input); 93 | box-shadow: 0px 0px 0 0px var(--eksicode); 94 | &:hover, &:focus { 95 | outline: 0; 96 | color: var(--eksicode); 97 | border-bottom-color: var(--eksicode); 98 | box-shadow: 0px 1px 0 0px var(--eksicode); 99 | } 100 | transition: all 250ms linear; 101 | } 102 | 103 | .filter__search { 104 | grid-column: 2 / 7; 105 | } 106 | .filter__search > input { 107 | border-bottom: 1px solid var(--gray-input) !important; 108 | box-shadow: 0px 0px 0 0px var(--eksicode) !important; 109 | &:hover, &:focus { 110 | outline: 0 !important; 111 | border-bottom-color: var(--eksicode) !important; 112 | box-shadow: 0px 1px 0 0px var(--eksicode) !important; 113 | } 114 | transition: all 250ms; 115 | } 116 | 117 | .no-result { 118 | font-size: 1.5rem; 119 | } -------------------------------------------------------------------------------- /src/scss/_main.scss: -------------------------------------------------------------------------------- 1 | 2 | 3 | a:link { 4 | color: var(--eksicode); 5 | } 6 | 7 | a:active { 8 | color: var(--acikgri); 9 | } 10 | 11 | a:visited { 12 | color: var(--night); 13 | } 14 | 15 | a:hover { 16 | color: var(--night); 17 | text-decoration:underline; 18 | } 19 | 20 | h1 { 21 | font-size: 3rem; 22 | font-weight: 600; 23 | @media (max-width: 400px) { 24 | font-size: 2.5rem; 25 | } 26 | } 27 | h2 { 28 | font-size: 2rem; 29 | font-weight: 600; 30 | } 31 | h4 { 32 | font-size: 20px; 33 | } 34 | 35 | .box { 36 | height: 0.6rem; 37 | background-color: var(--acikgri); 38 | position: absolute; 39 | z-index: -1; 40 | margin-left: -1rem; 41 | margin-top: -2.65rem; 42 | transition: cubic-bezier(0.175, 0.885, 0.32, 1.275) 200ms; 43 | &__kaynaklar { 44 | width: 12.2rem; 45 | } 46 | &__projeler { 47 | width: 10rem; 48 | } 49 | &__gruplar { 50 | width: 20.5rem; 51 | @media (max-width: 313px) { 52 | width: 12rem; 53 | margin-top: -3.65rem; 54 | } 55 | } 56 | &__discord { 57 | width: 10rem; 58 | } 59 | &__kariyer { 60 | width: 11rem; 61 | @media only screen and (max-width: 417px){ 62 | width: 14.5rem; 63 | } 64 | } 65 | } 66 | h2:hover + .box { 67 | height: 4rem; 68 | margin-top: -4.6rem; 69 | &__kaynaklar { 70 | background-color: var(--light-yesil); 71 | } 72 | &__projeler { 73 | background-color: var(--kurbaga-yesili); 74 | } 75 | &__gruplar { 76 | background-color: var(--mavi); 77 | @media (max-width: 313px) { 78 | height: 5.4rem; 79 | margin-top: -6.6rem; 80 | } 81 | } 82 | &__discord { 83 | background-color: var(--blurple); 84 | } 85 | &__kariyer { 86 | background-color: var(--eksicode); 87 | @media only screen and (max-width: 417px){ 88 | height: 10rem; 89 | margin-top: -10.8rem; 90 | } 91 | } 92 | 93 | } 94 | .drawings { 95 | margin-top: -14rem; 96 | position: relative; 97 | z-index: -1; 98 | @media (max-width: 600px) { 99 | margin-top: 0; 100 | } 101 | } 102 | .plane { 103 | margin-top: -1em; 104 | margin-right: 5em; 105 | } 106 | .discord { 107 | margin-left: 5rem; 108 | width: 20vw; 109 | @media (max-width: 600px) { 110 | margin-top: -1em; 111 | width: 30vw; 112 | } 113 | } 114 | .eksi { 115 | padding-bottom: 0; 116 | .row { 117 | margin-bottom: 0; 118 | } 119 | .entry { 120 | height: 10rem; 121 | width: 14rem; 122 | margin-bottom: 3em; 123 | p { 124 | padding: 1em 1em 0 1em; 125 | font-size: 0.75rem; 126 | color: black; 127 | } 128 | .bubble { 129 | z-index: -1; 130 | width: 15rem; 131 | position: absolute; 132 | } 133 | .author { 134 | font-weight: 600; 135 | font-size: 0.8rem; 136 | float: right; 137 | color: var(--eksicode); 138 | } 139 | } 140 | .people { 141 | height: 10rem; 142 | } 143 | } 144 | .break { 145 | overflow-wrap: break-word; 146 | } -------------------------------------------------------------------------------- /src/scss/_media.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/scss/_mixins.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/scss/_nav.scss: -------------------------------------------------------------------------------- 1 | nav { 2 | font-weight: 500; 3 | font-size: 0.875rem; 4 | letter-spacing: .5px; 5 | background-color: var(--night); 6 | ul { 7 | .mobile { 8 | display: none; 9 | } 10 | li { 11 | a { 12 | font-size: 0.875rem; 13 | color: var(--beyaz) !important; 14 | } 15 | a:hover { 16 | color: var(--eksicode) !important; 17 | text-decoration: none; 18 | } 19 | } 20 | } 21 | @media only screen and (max-width: 1300px) { 22 | .desktop { 23 | display: none; 24 | } 25 | .mobile { 26 | display: block !important; 27 | } 28 | } 29 | } 30 | .logo { 31 | margin-top: 1.2rem; 32 | height: 2rem; 33 | } 34 | 35 | .hamburger { 36 | i { 37 | line-height: 36px !important; 38 | } 39 | } -------------------------------------------------------------------------------- /src/scss/_projeler.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Eksicode/eksicode-frontend/9641676a0abc3fabca009bc62d2193f371762efd/src/scss/_projeler.scss -------------------------------------------------------------------------------- /src/scss/_sidenav.scss: -------------------------------------------------------------------------------- 1 | .sidenav { 2 | background-color: var(--night); 3 | li a { 4 | color: var(--acikgri); 5 | } 6 | } -------------------------------------------------------------------------------- /src/scss/_telegram.scss: -------------------------------------------------------------------------------- 1 | 2 | .card { 3 | padding-bottom: 1.5em; 4 | border: 1.2px solid black; 5 | box-shadow: none; 6 | background: none; 7 | } 8 | .card-content { 9 | height: 15em; 10 | i{ 11 | font-size: 30px; 12 | } 13 | } 14 | .card-content__img { 15 | width: 5rem; 16 | border-radius: 50%; 17 | } 18 | .btn-small { 19 | background-color: white; 20 | border: 1px solid var(--night); 21 | box-shadow: none; 22 | color: var(--white); 23 | img { 24 | margin-right: 0.8em; 25 | } 26 | a:link :active :visited { 27 | color: var(--white); 28 | } 29 | } 30 | .btn-small:focus { 31 | background-color: white; 32 | } 33 | .btn-small:hover { 34 | transform: translateY(-0.4em) scale(1.12); 35 | background-color: var(--mavi); 36 | } 37 | .logos { 38 | height: 6rem; 39 | border-radius: 50px; 40 | 41 | } -------------------------------------------------------------------------------- /src/scss/_variables.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | --eksicode: #82bd4e; 3 | --kurbaga-yesili: #99f7ab; 4 | --light-yesil: #d6f9dd; 5 | --gri: #60695c; 6 | --gray-input: #9e9e9e; 7 | --acikgri: #c5d6d8; 8 | --night: #0C090A; 9 | --coral: coral; 10 | --mavi: #2196f3; 11 | --blurple: #7289DA; 12 | --light-mavi:#bbdefb; 13 | --beyaz:#fff; 14 | } -------------------------------------------------------------------------------- /src/setupTests.js: -------------------------------------------------------------------------------- 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 | --------------------------------------------------------------------------------