Skip to content

Commit

Permalink
Added style.css and updated index.html file
Browse files Browse the repository at this point in the history
  • Loading branch information
@Extomvi
Extomvi committed May 25, 2022
1 parent 1e0f7cd commit eb81b46
Show file tree
Hide file tree
Showing 3 changed files with 271 additions and 18 deletions.
Empty file added css/style.css
View file
Empty file.
30 changes: 12 additions & 18 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,24 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<title>Tomiwa's Portfolio</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1" />
<head>
<title>Tomiwa Portfolio</title>
<meta charset="utf-8"
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1" />
<link rel="stylesheet" href="https://unpkg.com/boxicons@latest/css/boxicons.min.css">

<link href="https://fonts.googleapis.com/css2?family=Russo+One&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Jost:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">

<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@500&family=Russo+One&display=swap" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>

<link rel="stylesheet" type="text/css" href="default.css">
<link id="theme-style" rel="stylesheet" type="text/css" href="">
</head>
<body>
<section>
<div>
<h1>Hi, I'm Tomiwa Adedokun</h1>
<p>This is my Portfolio site</p>
<a href="a">Link</a>
</div>
</section>

</body>
</body>
</html>
259 changes: 259 additions & 0 deletions index_1.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,259 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Personal Portfolio Website 2022</title>
<link rel="stylesheet" type="text/css" href="css/style.css">

<link rel="stylesheet"
href="https://unpkg.com/boxicons@latest/css/boxicons.min.css">

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Jost:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">

</head>
<body>
<!--------header---->
<header>
<a href="#" class="logo"><img src="img/logo.png"></a>
<div class="bx bx-menu" id="menu-icon"></div>

<ul class="navlist">
<li><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#service">Service</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<a href="#" class="top-btn">Download CV</a>
</header>

<!--------home---->
<section class="home" id="home">
<div class="home-text">
<h3>Hello, I'm</h3>
<h1>James Smith</h1>
<h5>A Creative Designer <span>From New York</span></h5>
<p>I'm creative designer based in New York, and I'm very passionate <br> and dedicated to my work.</p>
<div class="social">
<a href="#"><i class='bx bxl-facebook'></i></a>
<a href="#"><i class='bx bxl-twitter' ></i></a>
<a href="#"><i class='bx bxl-linkedin' ></i></a>
<a href="#"><i class='bx bxl-behance' ></i></a>
</div>
<a href="#" class="btn">About Me</a>
</div>

<div class="home-img">
<img src="img/main.png">
</div>
</section>

<!--------sub service---->
<section class="sub-service">
<div class="items">
<div class="sub-box">
<div class="sub-img">
<img src="img/target.svg">
</div>
<h3>Pixel Perfect</h3>
<p>Most common methods for designing websites that work well on desktop is responsive and adaptive design.</p>
</div>

<div class="sub-box">
<div class="sub-img">
<img src="img/brush.svg">
</div>
<h3>High Quality</h3>
<p>Most common methods for designing websites that work well on desktop is responsive and adaptive design.</p>
</div>

<div class="sub-box">
<div class="sub-img">
<img src="img/energy.svg">
</div>
<h3>Awesome Idea</h3>
<p>Most common methods for designing websites that work well on desktop is responsive and adaptive design.</p>
</div>

</div>
</section>

<!--------About---->
<section class="about" id="about">
<div class="about-img">
<img src="img/about.jpg">
</div>

<div class="about-text">
<h3>I'm a Designer</h3>
<h2>I Can Design Anything You Want</h2>
<p>Hello there! I'm a web designer, and I'm very passionate and dedicated to my work. With 20 years experience as a professional web developer, I have acquired the skills and knowledge necessary to make your project a success. I enjoy every step of the design process, from discussion and collaboration.</p>
<a href="#" class="btn">Hire Me</a>
</div>
</section>

<!--------portfolio---->
<section class="portfolio" id="portfolio">
<div class="heading">
<h3>Portfolio</h3>
<h2>My Amazing Work</h2>
<p>Most common methods for designing websites that work well on desktop is <br> responsive and adaptive design</p>
</div>

<div class="portfolio-content">
<div class="col">
<img src="img/work1.jpg">
<div class="layer">
<h3>Web Design</h3>
<h5>Popup</h5>
</div>
</div>

<div class="col">
<img src="img/work2.jpg">
<div class="layer">
<h3>Web Design</h3>
<h5>Popup</h5>
</div>
</div>

<div class="col">
<img src="img/work3.jpg">
<div class="layer">
<h3>Web Design</h3>
<h5>Popup</h5>
</div>
</div>

<div class="col">
<img src="img/work4.jpg">
<div class="layer">
<h3>Web Design</h3>
<h5>Popup</h5>
</div>
</div>

<div class="col">
<img src="img/work5.jpg">
<div class="layer">
<h3>Web Design</h3>
<h5>Popup</h5>
</div>
</div>

<div class="col">
<img src="img/work6.jpg">
<div class="layer">
<h3>Web Design</h3>
<h5>Popup</h5>
</div>
</div>

</div>
</section>

<!--------service---->
<section class="service" id="service">
<div class="heading">
<h3>Service</h3>
<h2>What I Do For Clients</h2>
<p>Most common methods for designing websites that work well on desktop is <br> responsive and adaptive design</p>
</div>

<div class="service-content">
<div class="row">
<div class="s s-one">
<img src="img/anchor.svg">
</div>
<h3>Web Design</h3>
<h5>Starts From <span>$99</span></h5>
<p>Web design refers to the design of websites that are displayed on the internet. It usually refers to the user experience aspects of website development</p>
</div>

<div class="row">
<div class="s s-tow">
<img src="img/physics.svg">
</div>
<h3>Web Design</h3>
<h5>Starts From <span>$99</span></h5>
<p>Web design refers to the design of websites that are displayed on the internet. It usually refers to the user experience aspects of website development</p>
</div>

<div class="row">
<div class="s s-three">
<img src="img/contact.svg">
</div>
<h3>Web Design</h3>
<h5>Starts From <span>$99</span></h5>
<p>Web design refers to the design of websites that are displayed on the internet. It usually refers to the user experience aspects of website development</p>
</div>

<div class="row">
<div class="s s-four">
<img src="img/web.svg">
</div>
<h3>Web Design</h3>
<h5>Starts From <span>$99</span></h5>
<p>Web design refers to the design of websites that are displayed on the internet. It usually refers to the user experience aspects of website development</p>
</div>

</div>
</section>

<!--------work---->
<section class="cta">
<div class="heading">
<h2>Completed 1200+ Projects <br> Successfully</h2>
</div>

<div class="cta-box">
<div class="wrap one">
<h3>1200+</h3>
<p>Finished Projects</p>
</div>

<div class="wrap two">
<h3>350+</h3>
<p>Happy Customer</p>
</div>

<div class="wrap three">
<h3>15k</h3>
<p>Global Customers</p>
</div>

</div>
</section>

<!--------contact---->
<section class="contact" id="contact">
<div class="container">
<div class="center">
<h3>Let's talk about everything</h3>
<p>Don't like forms? Send me an email.</p>
</div>

<div class="action">
<form>
<input type="email" name="email" placeholder="Enter Your email" required>
<input type="submit" name="submit" value="Submit">
</form>
</div>
</div>
</section>

<!--------ends---->
<div class="ends">
<p>Made with love by Tahmid Ahmed © 2022</p>
</div>

<script src="https://unpkg.com/scrollreveal"></script>

<!--------Link to js---->
<script type="text/javascript" src="js/script.js"></script>

</body>
</html>

0 comments on commit eb81b46

Please sign in to comment.