index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Portfolio</title>
<!--FONT AWESOME-->
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css"
integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
"
<!--MAIN CSS-->
<link rel="stylesheet" href="Style/styles.css" />
<title>Portfolio</title>
</head>
<body>
<!--HEADER DESIGN-->
<header class="header">
<a href="#" class="logo">Portfolio</a>
<i class="fa-solid fa-bars" id="menu-icon"></i>
<nav class="navbar">
<a href="#home" class="active">Home</a>
<a href="#about">About</a>
<a href="#services">Service</a>
<a href="#portfolio">Portfolio</a>
<a href="#contact">Contact</a>
</nav>
</header>
<!--HOME SECTION DESIGN-->
<section class="home" id="home">
<div class="home-content">
<h3>Hello World,My Name is</h3>
<h1>Juliansyah</h1>
<h3>And I'm a <span class="multiple-text"></span></h3>
<p>
Creative, self-starting and ambitious Front-End Developer with 1 year
of experience, in website development, for Responsive e-Commerce and
portfolio websites plus Mobile applications in a fast-paced
collaborative environment. Highly Experienced in HTML/CSS/JavaScript
and working knowledge of Ms.Excel. Experienced in internet data.
</p>
<div class="social-media">
<a href="https://www.instagram.com/rianz_yan/?next=%2F"
><i class="fa-brands fa-instagram"></i
></a>
<a href="https://www.tiktok.com/@nokturnist_?_t=8mBoVt3gpxn&_r=1"
><i class="fa-brands fa-tiktok"></i
></a>
<a
href="https://api.whatsapp.com/send/?phone=%2B81291758646&text&type=phone_number&app_absent=0"
><i class="fa-brands fa-whatsapp"></i
></a>
</div>
<a
href="https://drive.google.com/file/d/1mFTGPzpSj4L6a41cGNFAfsAT2aogxrCS/view?usp=drive_link"
class="btn"
>Download CV</a
>
</div>
<div class="home-img">
<img src="Image/Hexagon1.png" alt="" />
</div>
</section>
<!--ABOUT SECTION DESIGN-->
<section class="about" id="about">
<div class="about-img">
<img
src="Image/—Pngtree—programmer coding on laptop_14121050.png"
alt=""
/>
</div>
<div class="about-content">
<h2 class="heading">About <span>Me</span></h2>
<h3>Frontend Developer</h3>
<p>
I am 24 Years old, I am a ShiftLead with 2 years experience working at
PT. Shopee Express Company. Able to manage files, create reports,
organize archives, and input company data. As well as being agile,
thorough and able to adapt to the company environment well.
</p>
<a href="#" class="btn">Read More</a>
</div>
</section>
<!--SERVICE SECTION DESIGN-->
<section class="services" id="services">
<h2 class="heading">My <span>Services</span></h2>
<div class="services-container">
<div class="services-box">
<i class="fa-solid fa-code"></i>
<h3>Web Development</h3>
<p>
Experienced in the field of frontend developer for 1 year by
self-taught from the internet.
</p>
<a href="#" class="btn">Read More</a>
</div>
<div class="services-box">
<i class="fa-solid fa-palette"></i>
<h3>UI/UX Designing</h3>
<p>
Experienced in the field of frontend developer for 1 year by
self-taught from the internet.
</p>
<a href="#" class="btn">Read More</a>
</div>
<div class="services-box">
<i class="fa-brands fa-android"></i>
<h3>App Development</h3>
<p>
Experienced in the field of frontend developer for 1 year by
self-taught from the internet.
</p>
<a href="#" class="btn">Read More</a>
</div>
</div>
</section>
<!--PORTFOLIO SECTION DESIGN-->
<section class="portfolio" id="portfolio">
<h2 class="heading">Latest <span>Projects</span></h2>
<div class="portfolio-container">
<div class="portfolio-box">
<img src="Image/1.jpg" alt="" />
<div class="portfolio-layer">
<h4>Web Design</h4>
<p>hiihihi</p>
<i class="fa-solid fa-up-right-from-square"></i>
</div>
</div>
<div class="portfolio-box">
<img src="Image/1.jpg" alt="" />
<div class="portfolio-layer">
<h4>Web Design</h4>
<p>hiihihi</p>
<i class="fa-solid fa-up-right-from-square"></i>
</div>
</div>
<div class="portfolio-box">
<img src="Image/1.jpg" alt="" />
<div class="portfolio-layer">
<h4>Web Design</h4>
<p>hiihihi</p>
<i class="fa-solid fa-up-right-from-square"></i>
</div>
</div>
<div class="portfolio-box">
<img src="Image/1.jpg" alt="" />
<div class="portfolio-layer">
<h4>Web Design</h4>
<p>hiihihi</p>
<i class="fa-solid fa-up-right-from-square"></i>
</div>
</div>
<div class="portfolio-box">
<img src="Image/1.jpg" alt="" />
<div class="portfolio-layer">
<h4>Web Design</h4>
<p>hiihihi</p>
<i class="fa-solid fa-up-right-from-square"></i>
</div>
</div>
<div class="portfolio-box">
<img src="Image/1.jpg" alt="" />
<div class="portfolio-layer">
<h4>Web Design</h4>
<p>hiihihi</p>
<i class="fa-solid fa-up-right-from-square"></i>
</div>
</div>
</div>
</section>
<!--CONTACT SECTION DESIGN-->
<!--GMAIL LOGIN-->
<section class="contact" id="contact">
<h2 class="heading">Contact<spam>Me</spam></h2>
<form action="#">
<div class="input-box">
<input type="text" placeholder="Full name" />
<input type="email" placeholder="Email Address" />
</div>
<div class="input-box">
<input type="number" placeholder="Mobile Number" />
<input type="text" placeholder="Email Subject" />
</div>
<textarea
name=""
id=""
cols="30"
rows="10"
placeholder="Your Message"
></textarea>
<input type="submit" value="Send Message" class="btn" />
</form>
</section>
<!--FOOTER DESIGN-->
<footer class="footer">
<div class="footer-text">
<p>
Copyright © 2024 by @MuhammadNurrahmanJuliansyah | All Right
Reserved.
</p>
</div>
<div class="footer-iconTop">
<a href="#home"><i class="fa-solid fa-angle-up"></i></a>
</div>
</footer>
<!--SCROLL REVEAL js-->
<script src="https://unpkg.com/scrollreveal"></script>
<!--TYPED JS-->
<script src="https://unpkg.com/typed.js@2.1.0/dist/typed.umd.js"></script>
<!--MAIN JS-->
<script src="JS/main.js"></script>
<script
type="module"
src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"
></script>
<script
nomodule
src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"
></script>
</body>
</html>
Komentar
Posting Komentar