Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
@OzkanBirak
OzkanBirak authored Nov 29, 2024
0 parents commit 1a1ec4f
Show file tree
Hide file tree
Showing 12 changed files with 358 additions and 0 deletions.
169 changes: 169 additions & 0 deletions css/styles.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,169 @@
body {
font-family: "Roboto", sans-serif;
color: #434455;
background-color: #FFFFFF;
}

.nav-logo {
font-family: "Raleway", sans-serif;
font-weight: 700;
font-size: 18px;
line-height: 1.17;
letter-spacing: 0.03em;
text-transform: uppercase;
color: #4d5ae5;
}

.nav-logo .logo-span {
color: #2e2f42;
}

.nav-list__list-item .link {
font-weight: 500;
font-size: 16px;
line-height: 1.5;
letter-spacing: 0.02em;
color: #2e2f42;
}

.nav-list__list-item .link:hover,
.nav-list__list-item .link:focus {
color: #404bbf;
}

.contact {
font-style: normal;
}

.contact .link {
font-size: 16px;
line-height: 1.5;
letter-spacing: 0.02em;
color: #434455;
}

.contact .link:hover,
.contact .link:focus {
color: #404bbf;
}

.first-section {
background-color: #2e2f42;
}

.first-section__title {
font-size: 56px;
line-height: 1.07;
text-align: center;
letter-spacing: 0.02em;
color: #FFFFFF;
}

.first-section__btn {
font-family: "Roboto", sans-serif;
font-weight: 500;
color: #ffffff;
background-color: #4D5AE5;
line-height: 1.5;
letter-spacing: 0.04em;
cursor: pointer;
}

.first-section__btn:hover,
.first-section__btn:focus {
background-color: #404BBF;
}

.second-section__list-title {
font-weight: 500;
font-size: 20px;
line-height: 1.2;
letter-spacing: 0.02em;
color: #2E2F42;
}

.second-section .text {
font-size: 16px;
line-height: 1.5;
letter-spacing: 0.02em;
color: #434455;
}

.third-section {
background-color: #f4f4fd;
}

.third-section__title {
font-size: 36px;
line-height: 1.11;
text-align: center;
letter-spacing: 0.02em;
text-transform: capitalize;
color: #2e2f42;
}

.third-section__list .list-item{
background-color: #ffffff;
}

.third-section__list .member-name {
font-weight: 500;
font-size: 20px;
line-height: 1.2;
letter-spacing: 0.02em;
color: #2e2f42;
}

.third-section__list .text{
font-size: 16px;
line-height: 1.5;
letter-spacing: 0.02em;
}

.forth-section__title {
font-size: 36px;
line-height: 1.11;
text-align: center;
letter-spacing: 0.02em;
text-transform: capitalize;
color: #2E2F42;
}

.list-item__title {
font-weight: 500;
font-size: 20px;
line-height: 1.2;
letter-spacing: 0.02em;
color: #2e2f42;
}

.list-item .text {
font-size: 16px;
line-height: 1.5;
letter-spacing: 0.02em;
color: #434455;
}

.footer {
background-color: #2e2f42;
}

.footer .text {
color: #F4F4FD;
letter-spacing: 0.02em;
line-height: 1.5;
}

.footer-logo {
font-family: "Raleway", sans-serif;
font-weight: 700;
font-size: 18px;
line-height: 1.17;
letter-spacing: 0.03em;
text-transform: uppercase;
color: #4d5ae5;
}

.footer-logo .logo-span {
color: #f4f4fd;
}
Binary file added images/img1.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/img2.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/img3.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/img4.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/portfolio1.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/portfolio2.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/portfolio3.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/portfolio4.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/portfolio5.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/portfolio6.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
189 changes: 189 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,189 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/modern-normalize/2.0.0/modern-normalize.min.css"
integrity="sha512-4xo8blKMVCiXpTaLzQSLSw3KFOVPWhm/TRtuPVc4WG6kUgjH6J03IBuG7JZPkcWMxJ5huwaBpOpnwYElP/m6wg=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<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=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&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=Raleway:ital,wght@0,100..900;1,100..900&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="./css/styles.css" />
<title>Homework2</title>
</head>
<body>
<header>
<nav>
<a href="./index.html" class="nav-logo"
>Web<span class="logo-span">Studio</span></a
>
<ul class="nav-list">
<li class="nav-list__list-item">
<a class="link" href="./index.html">Studio</a>
</li>
<li class="nav-list__list-item">
<a class="link" href="">Portfolio</a>
</li>
<li class="nav-list__list-item">
<a class="link" href="">Contacts</a>
</li>
</ul>
</nav>
<address id="contact" class="contact">
<ul>
<li>
<a class="link" href="mailto:[email protected]"
>[email protected]</a
>
</li>
<li>
<a class="link" href="tel:+110001111111"
>+11 (000) 111-11-11</a
>
</li>
</ul>
</address>
</header>
<main>
<section class="first-section" id="hero">
<h1 class="first-section__title">
Effective Solutions for Your Business
</h1>
<button class="first-section__btn" type="button">
Order Service
</button>
</section>
<section class="second-section">
<h2>RandomTitle</h2>
<ul>
<li>
<h3 class="second-section__list-title">Strategy</h3>
<p class="text">
Our goal is to identify the business problem to walk
away with the perfect and creative solution.
</p>
</li>
<li>
<h3 class="second-section__list-title">Punctuality</h3>
<p class="text">
Bring the key message to the brand's audience for
the best price within the shortest possible time.
</p>
</li>
<li>
<h3 class="second-section__list-title">Diligence</h3>
<p class="text">
Research and confirm brands that present the
strongest digital growth opportunities and minimize
risk.
</p>
</li>
<li>
<h3 class="second-section__list-title">Technologies</h3>
<p class="text">
Design practice focused on digital experiences. We
bring forth a deep passion for problem-solving.
</p>
</li>
</ul>
</section>
<section class="third-section" id="team">
<h2 class="third-section__title">Our Team</h2>
<ul class="third-section__list">
<li class="list-item">
<img
src="./images/img1.jpg"
alt="Mark Guerrero"
width="264"
/>
<h3 class="member-name">Mark Guerrero</h3>
<p class="text">Product Designer</p>
</li>
<li class="list-item">
<img
src="./images/img2.jpg"
alt="Tom Ford"
width="264"
/>
<h3 class="member-name">Tom Ford</h3>
<p class="text">Frontend Developer</p>
</li>
<li class="list-item">
<img
src="./images/img3.jpg"
alt="Camila Garcia"
width="264"
/>
<h3 class="member-name">Camila Garcia</h3>
<p class="text">Marketing</p>
</li>
<li class="list-item">
<img
src="./images/img4.jpg"
alt="Daniel Wilson"
width="264"
/>
<h3 class="member-name">Daniel Wilson</h3>
<p class="text">UI Designer</p>
</li>
</ul>
</section>
<section class="forth-section" id="portfolio">
<h2 class="forth-section__title">Our Portfolio</h2>
<ul class="forth-section__list">
<li class="list-item">
<img src="./images/portfolio1.jpg" alt="portfolio1" width="360">
<h3 class="list-item__title">Banking App</h3>
<p class="text">App</p>
</li>
<li class="list-item">
<img src="./images/portfolio2.jpg" alt="portfolio2" width="360">
<h3 class="list-item__title">Cashless Payment</h3>
<p class="text">Marketing</p>
</li>
<li class="list-item">
<img src="./images/portfolio3.jpg" alt="portfolio3" width="360">
<h3 class="list-item__title">Meditation App</h3>
<p class="text">App</p>
</li>
<li class="list-item">
<img src="./images/portfolio4.jpg" alt="portfolio4" width="360">
<h3 class="list-item__title">Taxi Service</h3>
<p class="text">Marketing</p>
</li>
<li class="list-item">
<img src="./images/portfolio5.jpg" alt="portfolio5" width="360">
<h3 class="list-item__title">Screen Illustrations</h3>
<p class="text">Design</p>
</li>
<li class="list-item">
<img src="./images/portfolio6.jpg" alt="portfolio6" width="360">
<h3 class="list-item__title">Online Courses</h3>
<p class="text">Marketing</p>
</li>
</ul>
</section>
</main>
<footer class="footer">
<a class="footer-logo" href="./index.html">Web<span class="logo-span">Studio</span></a>
<p class="text">
Increase the flow of customers and sales for your business with
digital marketing & growth solutions.
</p>
</footer>
</body>
</html>

0 comments on commit 1a1ec4f

Please sign in to comment.