├── html-css ├── blockInline.html ├── boxModel.html └── reset.css ├── js ├── apiOperations │ ├── AddProduct.html │ ├── AddProduct2.html │ ├── ProductPage.html │ └── axiosSample.html ├── arrays.html ├── dataTypes.html └── objectArray.html ├── okunacaklar.txt └── sass ├── abstracts └── _variables.scss ├── base ├── _font.scss └── _reset.scss ├── components └── _button.scss ├── eachSample.css ├── eachSample.css.map ├── eachSample.scss ├── index.html ├── layout ├── _footer.scss └── _navbar.scss ├── main.css ├── main.css.map ├── main.scss └── pages └── home ├── _home.scss └── partial └── _whyTechCareer.scss /html-css/blockInline.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 18 | 19 | 20 | 21 |
22 | Box - 1 23 |
24 |
25 | Box - 2 26 |
27 | 28 | 29 | -------------------------------------------------------------------------------- /html-css/boxModel.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 17 | 18 | 19 |
20 | Lorem, ipsum dolor sit amet consectetur adipisicing elit. Doloremque, labore earum? Dignissimos eius cumque deleniti harum recusandae possimus quo. Sapiente eaque harum praesentium voluptatibus exercitationem laborum a perferendis accusamus quae! 21 |
22 | 23 | -------------------------------------------------------------------------------- /html-css/reset.css: -------------------------------------------------------------------------------- 1 | /* http://meyerweb.com/eric/tools/css/reset/ 2 | v2.0 | 20110126 3 | License: none (public domain) 4 | */ 5 | 6 | html, body, div, span, applet, object, iframe, 7 | h1, h2, h3, h4, h5, h6, p, blockquote, pre, 8 | a, abbr, acronym, address, big, cite, code, 9 | del, dfn, em, img, ins, kbd, q, s, samp, 10 | small, strike, strong, sub, sup, tt, var, 11 | b, u, i, center, 12 | dl, dt, dd, ol, ul, li, 13 | fieldset, form, label, legend, 14 | table, caption, tbody, tfoot, thead, tr, th, td, 15 | article, aside, canvas, details, embed, 16 | figure, figcaption, footer, header, hgroup, 17 | menu, nav, output, ruby, section, summary, 18 | time, mark, audio, video { 19 | margin: 0; 20 | padding: 0; 21 | border: 0; 22 | font-size: 100%; 23 | font: inherit; 24 | vertical-align: baseline; 25 | } 26 | /* HTML5 display-role reset for older browsers */ 27 | article, aside, details, figcaption, figure, 28 | footer, header, hgroup, menu, nav, section { 29 | display: block; 30 | } 31 | body { 32 | line-height: 1; 33 | } 34 | ol, ul { 35 | list-style: none; 36 | } 37 | blockquote, q { 38 | quotes: none; 39 | } 40 | blockquote:before, blockquote:after, 41 | q:before, q:after { 42 | content: ''; 43 | content: none; 44 | } 45 | table { 46 | border-collapse: collapse; 47 | border-spacing: 0; 48 | } -------------------------------------------------------------------------------- /js/apiOperations/AddProduct.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 |
17 |
18 | 19 | 20 |
21 |
22 | 23 | 24 |
25 |
26 | 27 |
28 | 29 | 54 | 55 | -------------------------------------------------------------------------------- /js/apiOperations/AddProduct2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
12 |
13 | 14 | 15 |
16 |
17 | 18 | 19 |
20 |
21 | 22 | 23 |
24 |
25 | 26 |
27 |
28 | 29 | 30 | -------------------------------------------------------------------------------- /js/apiOperations/ProductPage.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 16 | 17 | 18 | 31 | 32 | -------------------------------------------------------------------------------- /js/apiOperations/axiosSample.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 70 | 71 | -------------------------------------------------------------------------------- /js/arrays.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 37 | 38 | -------------------------------------------------------------------------------- /js/dataTypes.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 50 | 51 | -------------------------------------------------------------------------------- /js/objectArray.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 1024 | 1025 | -------------------------------------------------------------------------------- /okunacaklar.txt: -------------------------------------------------------------------------------- 1 | BOX MODEL 2 | https://www.w3schools.com/css/css_boxmodel.asp 3 | https://www.youtube.com/watch?v=dTUtsy54eP0 4 | 5 | İki Kutu Yanyana Gelme Hikayesi 6 | https://www.youtube.com/watch?v=OaEtW_CSaPk 7 | 8 | Ödev 9 | https://startbootstrap.com/previews/freelancer 10 | 11 | 12 | sass 13 | https://www.webdesignerdepot.com/2020/12/2-smartest-ways-to-structure-sass/ 14 | https://gist.github.com/jareware/4738651 15 | 16 | -------------------------------------------------------------------------------- /sass/abstracts/_variables.scss: -------------------------------------------------------------------------------- 1 | $primary-color:#00C26D; 2 | $secondary-color:#000 3 | 4 | 5 | -------------------------------------------------------------------------------- /sass/base/_font.scss: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,900;1,100;1,200;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;1,100;1,300&display=swap'); -------------------------------------------------------------------------------- /sass/base/_reset.scss: -------------------------------------------------------------------------------- 1 | /* http://meyerweb.com/eric/tools/css/reset/ 2 | v2.0 | 20110126 3 | License: none (public domain) 4 | */ 5 | 6 | html, body, div, span, applet, object, iframe, 7 | h1, h2, h3, h4, h5, h6, p, blockquote, pre, 8 | a, abbr, acronym, address, big, cite, code, 9 | del, dfn, em, img, ins, kbd, q, s, samp, 10 | small, strike, strong, sub, sup, tt, var, 11 | b, u, i, center, 12 | dl, dt, dd, ol, ul, li, 13 | fieldset, form, label, legend, 14 | table, caption, tbody, tfoot, thead, tr, th, td, 15 | article, aside, canvas, details, embed, 16 | figure, figcaption, footer, header, hgroup, 17 | menu, nav, output, ruby, section, summary, 18 | time, mark, audio, video { 19 | margin: 0; 20 | padding: 0; 21 | border: 0; 22 | font-size: 100%; 23 | font: inherit; 24 | vertical-align: baseline; 25 | } 26 | /* HTML5 display-role reset for older browsers */ 27 | article, aside, details, figcaption, figure, 28 | footer, header, hgroup, menu, nav, section { 29 | display: block; 30 | } 31 | body { 32 | line-height: 1; 33 | } 34 | ol, ul { 35 | list-style: none; 36 | } 37 | blockquote, q { 38 | quotes: none; 39 | } 40 | blockquote:before, blockquote:after, 41 | q:before, q:after { 42 | content: ''; 43 | content: none; 44 | } 45 | table { 46 | border-collapse: collapse; 47 | border-spacing: 0; 48 | } -------------------------------------------------------------------------------- /sass/components/_button.scss: -------------------------------------------------------------------------------- 1 | .career-btn{ 2 | background-color: $primary-color; 3 | } -------------------------------------------------------------------------------- /sass/eachSample.css: -------------------------------------------------------------------------------- 1 | .btn-red { 2 | background-color: "red"; 3 | } 4 | 5 | .btn-yellow { 6 | background-color: "yellow"; 7 | } 8 | 9 | .btn-blue { 10 | background-color: "blue"; 11 | }/*# sourceMappingURL=eachSample.css.map */ -------------------------------------------------------------------------------- /sass/eachSample.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["eachSample.scss","eachSample.css"],"names":[],"mappings":"AAGE;EACE,uBAJK;ACET;;ADCE;EACE,0BAJK;ACMT;;ADHE;EACE,wBAJK;ACUT","file":"eachSample.css"} -------------------------------------------------------------------------------- /sass/eachSample.scss: -------------------------------------------------------------------------------- 1 | $colors: "red", "yellow", "blue"; 2 | 3 | @each $color in $colors { 4 | .btn-#{$color} { 5 | background-color: $color; 6 | } 7 | } 8 | 9 | 10 | 11 | @mixin important-text { 12 | color: red; 13 | font-size: 25px; 14 | font-weight: bold; 15 | border: 1px solid blue; 16 | } 17 | 18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /sass/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /sass/layout/_footer.scss: -------------------------------------------------------------------------------- 1 | footer{ 2 | text-align: center; 3 | } -------------------------------------------------------------------------------- /sass/layout/_navbar.scss: -------------------------------------------------------------------------------- 1 | nav { 2 | h1 { 3 | color: $primary-color ; 4 | } 5 | 6 | ul{ 7 | display: flex; 8 | } 9 | a{ 10 | text-decoration: none; 11 | } 12 | } -------------------------------------------------------------------------------- /sass/main.css: -------------------------------------------------------------------------------- 1 | /* http://meyerweb.com/eric/tools/css/reset/ 2 | v2.0 | 20110126 3 | License: none (public domain) 4 | */ 5 | @import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,900;1,100;1,200;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;1,100;1,300&display=swap"); 6 | html, body, div, span, applet, object, iframe, 7 | h1, h2, h3, h4, h5, h6, p, blockquote, pre, 8 | a, abbr, acronym, address, big, cite, code, 9 | del, dfn, em, img, ins, kbd, q, s, samp, 10 | small, strike, strong, sub, sup, tt, var, 11 | b, u, i, center, 12 | dl, dt, dd, ol, ul, li, 13 | fieldset, form, label, legend, 14 | table, caption, tbody, tfoot, thead, tr, th, td, 15 | article, aside, canvas, details, embed, 16 | figure, figcaption, footer, header, hgroup, 17 | menu, nav, output, ruby, section, summary, 18 | time, mark, audio, video { 19 | margin: 0; 20 | padding: 0; 21 | border: 0; 22 | font-size: 100%; 23 | font: inherit; 24 | vertical-align: baseline; 25 | } 26 | 27 | /* HTML5 display-role reset for older browsers */ 28 | article, aside, details, figcaption, figure, 29 | footer, header, hgroup, menu, nav, section { 30 | display: block; 31 | } 32 | 33 | body { 34 | line-height: 1; 35 | } 36 | 37 | ol, ul { 38 | list-style: none; 39 | } 40 | 41 | blockquote, q { 42 | quotes: none; 43 | } 44 | 45 | blockquote:before, blockquote:after, 46 | q:before, q:after { 47 | content: ""; 48 | content: none; 49 | } 50 | 51 | table { 52 | border-collapse: collapse; 53 | border-spacing: 0; 54 | } 55 | 56 | .career-btn { 57 | background-color: #00C26D; 58 | } 59 | 60 | nav h1 { 61 | color: #00C26D; 62 | } 63 | nav ul { 64 | display: flex; 65 | } 66 | nav a { 67 | text-decoration: none; 68 | } 69 | 70 | .box { 71 | background-color: #00C26D; 72 | display: flex; 73 | justify-content: center; 74 | }/*# sourceMappingURL=main.css.map */ -------------------------------------------------------------------------------- /sass/main.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["base/_reset.scss","base/_font.scss","main.css","components/_button.scss","abstracts/_variables.scss","layout/_navbar.scss","pages/home/partial/_whyTechCareer.scss"],"names":[],"mappings":"AAAA;;;CAAA;ACAQ,+LAAA;ADKR;;;;;;;;;;;;;EAaC,SAAA;EACA,UAAA;EACA,SAAA;EACA,eAAA;EACA,aAAA;EACA,wBAAA;AECD;;AFCA,gDAAA;AACA;;EAEC,cAAA;AEED;;AFAA;EACC,cAAA;AEGD;;AFDA;EACC,gBAAA;AEID;;AFFA;EACC,YAAA;AEKD;;AFHA;;EAEC,WAAA;EACA,aAAA;AEMD;;AFJA;EACC,yBAAA;EACA,iBAAA;AEOD;;ACrDA;EACI,yBCDW;AFyDf;;AGxDI;EACI,cDFO;AF6Df;AGxDI;EACI,aAAA;AH0DR;AGxDI;EACI,qBAAA;AH0DR;;AInEA;EACI,yBFDW;EEEX,aAAA;EACA,uBAAA;AJsEJ","file":"main.css"} -------------------------------------------------------------------------------- /sass/main.scss: -------------------------------------------------------------------------------- 1 | // Variables and mixins 2 | @import "abstracts/variables"; 3 | 4 | // Base styles 5 | @import "base/reset"; 6 | @import "base/font"; 7 | 8 | // Components 9 | @import "components/button"; 10 | 11 | // Layout 12 | @import "layout/navbar"; 13 | 14 | 15 | // Pages or sections 16 | @import "pages/home/home"; 17 | 18 | 19 | -------------------------------------------------------------------------------- /sass/pages/home/_home.scss: -------------------------------------------------------------------------------- 1 | @import 'partial/whyTechCareer'; -------------------------------------------------------------------------------- /sass/pages/home/partial/_whyTechCareer.scss: -------------------------------------------------------------------------------- 1 | .box{ 2 | background-color: $primary-color; 3 | display: flex; 4 | justify-content: center; 5 | } --------------------------------------------------------------------------------