PageSourceSearch

https://dolunaypazarci.netlify.app/

html dolunaypazarci.netlify.app collected 2026-10-03 10:39:41 UTC 31,422 bytes, 877 lines download raw bytes

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 &copy; 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.