1<!DOCTYPE html> 2<html lang="en"> 3 <head> 4 <meta charset="UTF-8" /> 5<!-- This site is hosted on Netlify. Anyone can build and deploy a site 6 like this one for free: https://netlify.new/?utm_campaign=loops&utm_source=ai-legible&utm_medium=owned&utm_content=comment&utm_id=27cec69d-631b-45d9-8f25-0ddf9997e63a 7 Netlify hosting facts for this site: static/SSR served via Netlify Edge. --> 8 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 9 <title>Dolunay Pazarcı Portfolio</title> 10 <link rel="stylesheet" href="style.css" /> 11 <!-- Box Icons--> 12 <link 13 href="https://unpkg.com/[email protected]/css/boxicons.min.css" 14 rel="stylesheet" 15 /> 16 <link 17 href="https://cdn.boxicons.com/fonts/brands/boxicons-brands.min.css" 18 rel="stylesheet" 19 /> 20 </head> 21 22 <body> 23 <header class="header"> 24 <a href="#" class="logo"> 25 Dolunay. <span class="animate" style="--i: 1"></span> 26 </a> 27 28 <div class="bx bx-menu" id="menu-icon"> 29 <span class="animate" style="--i: 2"></span> 30 </div> 31 32 <nav class="navbar"> 33 <a href="#home" class="active">Home</a> 34 <a href="#skills">About Me & Skills</a> 35 <a href="#portfolio">Portfolio</a> 36 <a href="#contact">Contact</a> 37 <span class="active-nav"></span> 38 <span class="animate" style="--i: 2"></span> 39 </nav> 40 </header> 41 42 <section class="home show-animate" id="home"> 43 <!-- BACKGROUND VIDEO --> 44 <video 45 class="bg-video" 46 autoplay 47 muted 48 loop 49 playsinline 50 poster="img/fallback.jpg" 51 > 52 <source src="./img/homevid.mp4" type="video/mp4" /> 53 <!-- Optional: You can add a webm source if you have one 54 <source src="homevid4.webm" type="video/webm" /> 55 --> 56 </video> 57 58 <div class="home-content"> 59 <h1> 60 Hello, I'm <span>Dolunay Pazarcı</span> 61 <span class="animate" style="--i: 2"></span> 62 </h1> 63 64 <div class="text-animate"> 65 <h3>Frontend Developer</h3> 66 <span class="animate" style="--i: 3"></span> 67 </div> 68 69 <p> 70 As a passionate Developer, I enjoy transforming ideas into interactive 71 and user-friendly web experiences. I value clean code, responsive 72 design, and continuous learning. Currently focusing on modern web 73 technologies and building real-world projects that reflect creativity, 74 functionality, and performance. 75 <span class="animate" style="--i: 4"></span> 76 </p> 77 78 <div class="btn-box"> 79 <a href="#contact" class="btn">Contact Me!</a> 80 <a href="./img/dolunay cv.pdf" class="btn">See My Resume</a> 81 <span class="animate" style="--i: 5"></span> 82 </div> 83 </div> 84 85 <div class="home-sci"> 86 <a href="https://wa.me/+905344146970" 87 ><i class="bx bxl-whatsapp"></i 88 ></a> 89 <a href="tel:+905344146970"><i class="bx bx-phone"></i></a> 90 <a href="https://linkedin.com/in/dolunay-pazarci/" 91 ><i class="bx bxl-linkedin"></i 92 ></a> 93 <a href="https://github.com/DolunayP"><i class="bx bxl-github"></i></a> 94 <span class="animate" style="--i: 6"></span> 95 </div> 96 97 <div class="home-imgHover"></div> 98 <span class="animate" style="--i: 7"></span> 99 </section> 100 101 <!-- about section design 102 <section class="about" id="about"> 103 </section> --> 104 105 <!--Skills section design--> 106 <section class="skills" id="skills"> 107 <h2 class="heading"> 108 About <span>Me</span> & My <span>Skills</span 109 ><span class="animate scroll" style="--i: 1"></span> 110 </h2> 111 <div class="skills-row"> 112 <div class="skills-column"> 113 <div class="about"> 114 <div class="about-img"> 115 <img src="img/about.jpg" alt="" /> 116 <span class="circle-spin"></span> 117 <span class="animate scroll" style="--i: 2"></span> 118 </div> 119 <div class="about-content"> 120 <h3> 121 Frontend Developer!
122 <span class="animate scroll" style="--i: 3"></span> 123 </h3> 124 <p> 125 Iâm a mid level Frontend and junior fullstack developer with 126 hands-on experience, actively involved in both individual and 127 team-based development processes. Over time, I have built a 128 strong portfolio of real-world applications and continue to 129 expand it by working on new, dynamic web projects. 130 <br /><br /> 131 Iâm also one of the co-founders of a technology company 132 established in Turkey with three stakeholders, where we focus on 133 software-based solutions and autonom systems. Technically, Iâm 134 proficient in a wide range of frontend technologies including 135 HTML, CSS, SASS, Bootstrap, Tailwind, JavaScript , React, 136 React-Redux, and working with RESTful APIs.(i have worked with 137 many react libraries like MUI,Formik&yup, react-router, GSAP 138 etc.) Additionally, I have practical experience with Node.js, 139 Express.js, and PostgreSQL, which Iâve used to develop 140 full-stack projects. I aim to create scalable, responsive, and 141 maintainable web interfaces that prioritize performance and user 142 experience. 143 <span class="animate scroll" style="--i: 4"></span> 144 </p> 145 </div> 146 </div> 147 </div> 148 149 <div class="skills-column"> 150 <div class="skills-content"> 151 <div class="skill"> 152 <h3>HTML</h3> 153 <i class="bx bxl-html5"></i> 154 </div> 155 <div class="skill"> 156 <h3>CSS</h3> 157 <i class="bx bxl-css3"></i> 158 </div> 159 <div class="skill"> 160 <h3>Sass</h3> 161 <i class="bx bxl-sass"></i> 162 </div> 163 <div class="skill"> 164 <h3>Bootstrap</h3> 165 <i class="bx bxl-bootstrap"></i> 166 </div> 167 <div class="skill"> 168 <h3>Tailwind</h3> 169 <i class="bx bxl-tailwind-css"></i> 170 </div> 171 <div class="skill"> 172 <h3>JavaScript</h3> 173 <i class="bx bxl-javascript"></i> 174 </div> 175 <div class="skill"> 176 <h3>React</h3> 177 <i class="bx bxl-react"></i> 178 </div> 179 <div class="skill"> 180 <h3>Redux</h3> 181 <i class="bx bxl-redux"></i> 182 </div> 183 <div class="skill"> 184 <h3>Node JS</h3> 185 <i class="bx bxl-nodejs"></i> 186 </div> 187 <div class="skill"> 188 <h3>Express JS</h3> 189 <i class="bxl bx-express-js"></i> 190 </div> 191 <div class="skill"> 192 <h3>PostgreSQL</h3> 193 <i class="bx bxl-postgresql"></i> 194 </div> 195 <div class="skill"> 196 <h3>WordPress</h3> 197 <i class="bx bxl-wordpress"></i> 198 </div> 199 <div class="skill"> 200 <h3>Git&Github</h3> 201 <i class="bx bxl-github"></i> 202 </div> 203 <div class="skill"> 204 <h3>SEO</h3> 205 <i class="bx bx-search"></i> 206 </div> 207 <div class="skill"> 208 <h3>Video Editing</h3> 209 <i class="bx bx-video-plus"></i> 210 </div> 211 <div class="skill"> 212 <h3>Figma</h3> 213 <i class="bx bxl-figma"></i> 214 </div> 215 <div class="skill"> 216 <h3>Adobe Photoshop</h3> 217 <i class="bx bxl-adobe"></i> 218 </div> 219 </div> 220 <span class="animate scroll" style="--i: 4"></span> 221 </div> 222 </div> 223 </section> 224 225 <!-- Portfolio section Design--> 226 <section class="portfolio" id="portfolio"> 227 <h2 class="heading" style="margin-top: 28px"> 228 Website <span>Designs</span> 229 <span class="animate scroll" style="--i: 1"></span> 230 </h2> 231 232 <div class="portfolio-container"> 233 <div class="portfolio-box"> 234 <img src="img/portfolio.png" alt="" /> 235 <div class="portfolio-layer"> 236 <h4>Portfolio Website</h4> 237 <p> 238 This is my portfolio design and right now you re displaying this 239 page :)), If you want a portfolio design and have some ideas in 240 your mind just contact me, I will be apreciated to code for you or 241 giving ideas each other :). 242 </p> 243 </div> 244 </div> 245 246 <div class="portfolio-box"> 247 <img src="img/biggbro.PNG" alt="" /> 248 <div class="portfolio-layer"> 249 <h4>BiggBro Website</h4> 250 <p> 251 Biggbro is a restaurant the website designed according to customer 252 requests, modern and fully responsive. You can see the website by 253 clicking below.
254 </p> 255 <a href="https://thebiggbrocafe.com/" 256 ><i class="bx bx-link-external"></i 257 ></a> 258 </div> 259 </div> 260 261 <div class="portfolio-box"> 262 <img src="img/decrates.PNG" alt="" /> 263 <div class="portfolio-layer"> 264 <h4>Decrates Website</h4> 265 <p> 266 Decrates is a modern architecture and interior design company, the 267 website designed according to customer requests, modern and fully 268 responsive. 269 </p> 270 <a href="https://decrates.com.tr/" 271 ><i class="bx bx-link-external"></i 272 ></a> 273 </div> 274 </div> 275 276 <div class="portfolio-box"> 277 <img src="img/inteskon.PNG" alt="" /> 278 <div class="portfolio-layer"> 279 <h4>Inteskon Website</h4> 280 <p> 281 Inteskon is a industrial maintenance and investment engineering 282 company, i designed fully responsive website and all the pages 283 designed via customer willing. 284 </p> 285 <a href="https://inteskon.com/" 286 ><i class="bx bx-link-external"></i 287 ></a> 288 </div> 289 </div> 290 291 <div class="portfolio-box"> 292 <img src="img/inteskongrup site tanıtım.PNG" alt="" /> 293 <div class="portfolio-layer"> 294 <h4>Inteskon Group</h4> 295 <p> 296 Inteskon Group includes several companies, Website designed 297 completely according to the customers willings. 298 </p> 299 <a href="https://inteskon.com.tr/" 300 ><i class="bx bx-link-external"></i 301 ></a> 302 </div> 303 </div> 304 305 <div class="portfolio-box"> 306 <img src="img/unitersite.PNG" alt="" /> 307 <div class="portfolio-layer"> 308 <h4>Unitersite</h4> 309 <p> 310 Unitersite is a platform which students can apply for jobs and 311 internships, they can upload and create CV, Companies can create 312 their profiles and look for workers. So it's a job finding 313 platform which designed for a customer. 314 </p> 315 <a href="https://unitersite.net.tr" 316 ><i class="bx bx-link-external"></i 317 ></a> 318 </div> 319 </div> 320 321 <div class="portfolio-box"> 322 <img src="img/kosiap.PNG" alt="" /> 323 <div class="portfolio-layer"> 324 <h4>Kosiap Website</h4> 325 <p> 326 KOSIAP website designed using modern web technologies fully 327 responsive. Everything designed according to customer's request. 328 You can visit the page clicking below. 329 </p> 330 <a href="https://kosiap.com"><i class="bx bx-link-external"></i></a> 331 </div> 332 </div> 333 334 <div class="portfolio-box"> 335 <img src="img/qr menü.PNG" alt="" /> 336 <div class="portfolio-layer"> 337 <h4>BiggBro QR MENU</h4> 338 <p> 339 This is a dynamic and mobile-friendly QR menu application 340 developed for Biggbro. Customers can scan a QR code to instantly 341 access the interactive menu, eliminating the need for physical 342 menus. 343 </p> 344 </div> 345 </div> 346 347 <div class="portfolio-box"> 348 <img src="img/3ereklam.png" alt="" /> 349 <div class="portfolio-layer"> 350 <h4>3eReklam Website</h4> 351 <p> 352 3eReklam, Due to customer willings i designed the website and then 353 i have done SEO.Everything designed according to customer's 354 request. You can visit the page clicking below. 355 </p> 356 <a href="https://3ereklam.com" 357 ><i class="bx bx-link-external"></i 358 ></a> 359 </div> 360 </div> 361 362 <div class="portfolio-box"> 363 <img src="img/kouspace.png" alt="" /> 364 <div class="portfolio-layer"> 365 <h4>KouSpace Website</h4> 366 <p> 367 KouSpace is an University Rocket Team Which i was also a member, 368 we are attending Competitions in Turkey and USA. You can visit the 369 website clicking below.
370 </p> 371 <a href="https://kouspace.com.tr" 372 ><i class="bx bx-link-external"></i 373 ></a> 374 </div> 375 </div> 376 377 <div class="portfolio-box"> 378 <img src="img/klimasist.JPG" alt="" /> 379 <div class="portfolio-layer"> 380 <h4>Klimasist Website</h4> 381 <p> 382 Klimasist is a air conditioning company. The Website is designed 383 for a company with a corporate identity. You can visit the website 384 by clicking the link below. 385 </p> 386 <a href="https://klimasist.com.tr" 387 ><i class="bx bx-link-external"></i 388 ></a> 389 </div> 390 </div> 391 392 <div class="portfolio-box"> 393 <img src="img/kosiaporg.PNG" alt="" /> 394 <div class="portfolio-layer"> 395 <h4>KOSIAP Association</h4> 396 <p> 397 KOSIAP Kocaeli Sivas Businesspeople Association. This website is 398 an association website designed entirely according to the 399 association's requirements and uses WordPress. You can access the 400 site using the link below. 401 </p> 402 <a href="https://kosiap.org.tr" 403 ><i class="bx bx-link-external"></i 404 ></a> 405 </div> 406 </div> 407 <span class="animate scroll" style="--i: 2"></span> 408 </div> 409 410 <h2 class="heading"> 411 Individual <span>Projects</span> 412 <span class="animate scroll" style="--i: 1"></span> 413 </h2> 414 415 <div class="portfolio-container"> 416 <div class="portfolio-box"> 417 <img src="img/spotify-clone.JPG" alt="" /> 418 <div class="portfolio-layer"> 419 <h4>Spotify Clone App</h4> 420 <p> 421 In App you can access popular and new albums & songs in turkey up 422 to date, you can search and listen to any song, album, artist 423 which are avaliable on real spotify (just for 30 seconds due to 424 Spotify's policy). 425 </p> 426 <a href="https://github.com/DolunayP/Spotify-Clone" 427 ><i class="bx bxl-github"></i 428 ></a> 429 </div> 430 </div> 431 432 <div class="portfolio-box"> 433 <img src="img/weatherapp.png" alt="" /> 434 <div class="portfolio-layer"> 435 <h4>Weather App (React-Redux)</h4> 436 <p> 437 Weather App, i worked with weatherapi also used React-Redux in 438 this project. Basically, The app is showing weekly and daily 439 forecast of the city which you type. 440 </p> 441 <a href="https://github.com/DolunayP/Weather-App-React" 442 ><i class="bx bxl-github"></i 443 ></a> 444 </div> 445 </div> 446 447 <div class="portfolio-box"> 448 <img src="img/shoppar.PNG" alt="" /> 449 <div class="portfolio-layer"> 450 <h4>E-Commerce</h4> 451 <p> 452 An example of E-Commerce website, users can search a product, add, 453 remove, clear products on cart and favourites, set categories, 454 sort by price and popularity. I used React Redux and Fake Store 455 Api. 456 </p> 457 <a href="https://github.com/DolunayP/E-Commerce-React-Redux" 458 ><i class="bx bxl-github"></i 459 ></a> 460 </div> 461 </div> 462 463 <div class="portfolio-box"> 464 <img src="img/Hangman.png" alt="" /> 465 <div class="portfolio-layer"> 466 <h4>Hangman Game</h4> 467 <p> 468 In the game, basically you re trying to find the hidden word 469 before the man hanged. You can type letters from keyboard or from 470 the screen, and after the game clicking play again you can start 471 again. 472 </p> 473 <a href="https://github.com/DolunayP/HangMan" 474 ><i class="bx bxl-github"></i 475 ></a> 476 </div> 477 </div> 478 479 <div class="portfolio-box"> 480 <img src="img/Todolist.png" alt="" /> 481 <div class="portfolio-layer"> 482 <h4>To Do App</h4> 483 <p> 484 To Do App, You can type and add todos, delete, search and check 485 your todos. The app basically shows todos. It's saving it to the 486 local cache so even you exit the app when you login again you 487 won't lose your todos. 488 </p> 489 <a href="https://github.com/DolunayP/To-Do-list" 490 ><i class="bx bxl-github"></i 491 ></a> 492 </div> 493 </div> 494 495 <div class="portfolio-box"> 496 <img src="img/movie.png" alt="" /> 497 <div class="portfolio-layer"> 498 <h4>Movie Recommender</h4> 499 <p class="intro"> 500 Movie Recommender project, shows movies, their IMDB points and on 501 navbar there is a search bar which you can type and find movies, 502 with mouseover event on a movie it shows overview. I used TMDB api 503 in this project. 504 </p> 505 <a 506 href="https://github.com/DolunayP/50Projects-25Days/tree/master/17-%20Movie%20UI" 507 > 508 <i class="bx bxl-github"></i> 509 </a> 510 </div> 511 </div> 512 513 <div class="portfolio-box"> 514 <img src="img/passwordgenerator.PNG" alt="" /> 515 <div class="portfolio-layer"> 516 <h4>Password Generator</h4> 517 <p> 518 The project includes generate button, some choosable props which 519 adds symbols, capitalized letters etc. to the password and copy 520 button, generate and copy the password on the screen to dashboard 521 and use your password. 522 </p> 523 <a 524 href="https://github.com/DolunayP/50Projects-25Days/tree/master/37-Password%20Generator" 525 > 526 <i class="bx bxl-github"></i> 527 </a> 528 </div> 529 </div> 530 531 <div class="portfolio-box"> 532 <img src="img/drawapp.PNG" alt="" /> 533 <div class="portfolio-layer"> 534 <h4>Drawing App</h4> 535 <p> 536 Drawing App, You can change the thickness and color of "pen", you 537 can draw in the box, with the button right below directly clear 538 all the drawing area. 539 </p> 540 <a 541 href="https://github.com/DolunayP/50Projects-25Days/tree/master/23-%20Drawing
541%20App" 542 > 543 <i class="bx bxl-github"></i> 544 </a> 545 </div> 546 </div> 547 548 <div class="portfolio-box"> 549 <img src="img/calculator.PNG" alt="" /> 550 <div class="portfolio-layer"> 551 <h4>Calculator</h4> 552 <p> 553 Calculator App, you can use it to make basic mathematical 554 operations dividing, multiplying etc. Coded by using vanilla 555 JavaScript, HTML, CSS. 556 </p> 557 <a href="https://github.com/DolunayP/Calculator" 558 ><i class="bx bxl-github"></i 559 ></a> 560 </div> 561 </div> 562 563 <div class="portfolio-box"> 564 <img src="img/randompicker.PNG" alt="" /> 565 <div class="portfolio-layer"> 566 <h4>Random Picker App</h4> 567 <p> 568 Random Picker App, The app for raffle! You can type the "options" 569 like names, numbers, users etc., dividing by comma between options 570 after you will click enter it will randomly pick one of the 571 options which you typed to the box. 572 </p> 573 <a 574 href="https://github.com/DolunayP/50Projects-25Days/tree/master/13-%20Random%20Choice%20Picker" 575 > 576 <i class="bx bxl-github"></i> 577 </a> 578 </div> 579 </div> 580 581 <div class="portfolio-box"> 582 <img src="img/incrementcounter.PNG" alt="" /> 583 <div class="portfolio-layer"> 584 <h4>Increment Counter</h4> 585 <p> 586 Increment Counter, The counter which you mostly see on websites, 587 When the user scroll down to that section it's starting to count 588 and reach the value which you type. Can be your amount of 589 followers, customers, projects etc. 590 </p> 591 <a 592 href="https://github.com/DolunayP/50Projects-25Days/tree/master/15-Increment%20Counter" 593 > 594 <i class="bx bxl-github"></i> 595 </a> 596 </div> 597 </div> 598 599 <div class="portfolio-box"> 600 <img src="img/clock.PNG" alt="" /> 601 <div class="portfolio-layer"> 602 <h4>Theme Clock</h4> 603 <p> 604 Clock App, basically modern clock which shows time :), you can 605 make changes between dark and light mode. 606 </p> 607 <a 608 href="https://github.com/DolunayP/50Projects-25Days/tree/master/21-%20Theme%20Clock" 609 > 610 <i class="bx bxl-github"></i> 611 </a> 612 </div> 613 </div> 614 615 <div class="portfolio-box"> 616 <img src="img/waterfollower.PNG" alt="" /> 617 <div class="portfolio-layer"> 618 <h4>Water Follower App</h4> 619 <p>Water Follower App, it is an app to follow your daily water</p> 620 <a 621 href="https://github.com/DolunayP/50Projects-25Days/tree/master/16-%20Water%20Follower" 622 > 623 <i class="bx bxl-github"></i> 624 </a> 625 </div> 626 </div> 627 628 <div class="portfolio-box"> 629 <img src="img/liveuserfilter.PNG" alt="" /> 630 <div class="portfolio-layer"> 631 <h4>Live User Filter</h4> 632 <p> 633 Live User Filter Project, includes search bar and by typing the 634 user name or location which you are looking for. You can find the 635 user if it is online. So the project can be entegrated to a 636 chatting website or app. 637 </p> 638 <a 639 href="https://github.com/DolunayP/50Projects-25Days/tree/master/44-%20Live%20User%20Filter" 640 > 641 <i class="bx bxl-github"></i> 642 </a> 643 </div> 644 </div> 645 646 <div class="portfolio-box"> 647 <img src="img/netflixmobnav.PNG" alt="" /> 648 <div class="portfolio-layer"> 649 <h4>Netflix Tab Nav</h4> 650 <p> 651 Netflix Tab Nav, basically clone of netflix tab navigation bar. 652 Has really smooth and nice view. 653 </p> 654 <a 655 href="https://github.com/DolunayP/50Projects-25Days/tree/master/43-Netflix%20Nav" 656 > 657 <i class="bx bxl-github"></i> 658 </a> 659 </div> 660 </div> 661 662 <div class="portfolio-box"> 663 <img src="img/passstr.png" alt="" /> 664 <div class="portfolio-layer"> 665 <h4>Password Strength</h4> 666 <p> 667 The project focused to show strenth of the password during the 668 register period. Doing this by decreasing blur on image. So user 669 can understand if the password which typed to the form is weak or 670 strong. 671 </p> 672 <a 673 href="https://github.com/DolunayP/50Projects-25Days/tree/master/33-Image%20Password%20Strength" 674 > 675 <i class="bx bxl-github"></i> 676 </a> 677 </div> 678 </div> 679 680 <div class="portfolio-box"> 681 <img src="img/pokedex.png" alt="" /> 682 <div class="portfolio-layer"> 683 <h4>Modern Pokedex</h4> 684 <p> 685 Modern Pokedex, includes pokemons, properties of pokemons, search 686 bar. I have done this project to improve my api skill, i used poke 687 api in this project. 688 </p> 689 <a href="https://github.com/DolunayP/Modern-Pokedex" 690 ><i class="bx bxl-github"></i 691 ></a> 692 </div> 693 </div> 694 695 <div class="portfolio-box"> 696 <img src="img/insect.png" alt="" /> 697 <div class="portfolio-layer"> 698 <h4>Catch Insect Game</h4> 699 <p> 700 Chose your "favourite" insect, the game will start and you have to 701 catch insects on the screen by clicking. Every time you catch you 702 have a surprise :). 703 </p> 704 <a 705 href="https://github.com/DolunayP/50Projects-25Days/tree/master/49-Catch%20Insect%20Game" 706 > 707 <i class="bx bxl-github"></i> 708 </a> 709 </div> 710 </div> 711 712 <div class="portfolio-box"> 713 <img src="img/splitlanding.PNG" alt="" /> 714 <div class="portfolio-layer"> 715 <h4>Split Landing Page</h4> 716 <p> 717 Split Landing Page, On mouse hover a side is expanding and other 718 is shrinking. For this example i used xbox and playstation. 719 </p> 720 <a 721 href="https://github.com/DolunayP/50Projects-25Days/tree/master/7-%20Split%20Landing%20Page" 722 > 723 <i class="bx bxl-github"></i> 724 </a> 725 </div> 726 </div> 727 728 <div class="portfolio-box"> 729 <img src="img/vaweanimation.PNG" alt="" /> 730 <div class="portfolio-layer"> 731 <h4>Form Vawe Animation</h4> 732 <p> 733 Form Vave Animation, Giving vawe animation to the form element by 734 using pure CSS. 735 </p> 736 <a 737 href="https://github.com/DolunayP/50Projects-25Days/tree/master/8-%20Form%20Vawe%20Animation" 738 > 739 <i class="bx bxl-github"></i> 740 </a> 741 </div> 742 </div> 743
744 <span class="animate scroll" style="--i: 2"></span> 745 </div> 746 </section> 747 748 <!--Contact section design--> 749 <section class="contact" id="contact"> 750 <h2 class="heading"> 751 Contact <span>Me!</span> 752 <span class="animate scroll" style="--i: 3"></span> 753 </h2> 754 755 <div class="contact-container"> 756 <div class="form-container"> 757 <form 758 action="https://formsubmit.co/[email protected]" 759 method="POST" 760 > 761 <div class="input-box"> 762 <div class="input-field"> 763 <input 764 type="text" 765 name="name" 766 placeholder="Full Name" 767 required 768 /> 769 <span class="focus"></span> 770 </div> 771 <div class="input-field"> 772 <input 773 type="text" 774 name="email" 775 placeholder="Email Address" 776 required 777 /> 778 <span class="focus"></span> 779 </div> 780 <span class="animate scroll" style="--i: 2"></span> 781 </div> 782 783 <div class="input-box"> 784 <div class="input-field"> 785 <input 786 type="text" 787 name="phone" 788 placeholder="Mobile Number" 789 required 790 /> 791 <span class="focus"></span> 792 </div> 793 <div class="input-field"> 794 <input 795 type="text" 796 name="subject" 797 placeholder="Subject" 798 required 799 /> 800 <span class="focus"></span> 801 </div> 802 <span class="animate scroll" style="--i: 3"></span> 803 </div> 804 805 <div class="textarea-field"> 806 <textarea 807 cols="30" 808 rows="7" 809 name="message" 810 placeholder="Your Message" 811 required 812 ></textarea> 813 <span class="focus"></span> 814 <span class="animate scroll" style="--i: 4"></span> 815 </div> 816 817 <div class="btn-box btns"> 818 <button type="submit" class="btn">Gönder</button> 819 <span class="animate scroll" style="--i: 5"></span> 820 </div> 821 </form> 822 </div> 823 824 <div class="contact-info-container"> 825 <div class="contact-items"> 826 <div class="contact-item"> 827 <a href="mailto:[email protected]"> 828 <i class="bx bxl-gmail"></i> 829 <span>Send an E-mail</span> 830 </a> 831 </div> 832 <div class="contact-item"> 833 <a href="tel:+48453224438"> 834 <i class="bx bx-phone"></i> 835 <span>Call by Phone</span> 836 </a> 837 </div> 838 <div class="contact-item"> 839 <a href="https://wa.me/+905344146970"> 840 <i class="bx bxl-whatsapp"></i> 841 <span>WhatsApp</span> 842 </a> 843 </div> 844 <div class="contact-item"> 845 <a href="https://www.linkedin.com/in/pazarci-dolunay/"> 846 <i class="bx bxl-linkedin"></i> 847 <span>See my Linkedin</span> 848 </a> 849 </div> 850 <div class="contact-item"> 851 <a href="https://github.com/DolunayP"> 852 <i class="bx bxl-github"></i> 853 <span>See my GitHub</span> 854 </a> 855 </div> 856 </div> 857 <span class="animate scroll" style="--i: 4"></span> 858 </div> 859 </div> 860 </section> 861 862 <!--footer design--> 863 <footer class="footer"> 864 <div class="footer-text"> 865 <p> 866 Copyright © 2023 Designed by Dolunay Pazarcı | All Rights 867 Reserved. 868 </p> 869 </div> 870 <div class="footer-iconTop"> 871 <a href="#"><i class="bx bx-up-arrow-alt"></i></a> 872 </div> 873 </footer> 874 875
875<script src="main.js"></script>
875 876 </body> 877</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.