mirror of
https://github.com/Nezumi-2711/loi-phan-internship.git
synced 2026-09-23 04:10:00 +00:00
#31 Edit html and css file
This commit is contained in:
@@ -13,18 +13,18 @@
|
||||
<header>
|
||||
<div class="container">
|
||||
<img src="./assets/images/logo.svg" alt="" class="logo" />
|
||||
<nav>
|
||||
<nav class="nav">
|
||||
<ul class="nav__lists">
|
||||
<li class="nav_item">
|
||||
<li class="nav__item">
|
||||
<a href="javascript:void(0)" class="nav__item-link">Home</a>
|
||||
</li>
|
||||
<li class="nav_item">
|
||||
<li class="nav__item">
|
||||
<a href="javascript:void(0)" class="nav__item-link">Portfolio</a>
|
||||
</li>
|
||||
<li class="nav_item">
|
||||
<li class="nav__item">
|
||||
<a href="javascript:void(0)" class="nav__item-link">Services</a>
|
||||
</li>
|
||||
<li class="nav_item">
|
||||
<li class="nav__item">
|
||||
<a href="javascript:void(0)" class="nav__item-link">Contact</a>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -32,7 +32,7 @@
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="welcome__container">
|
||||
<section class="welcome">
|
||||
<div class="welcome__content">
|
||||
<span class="welcome__title">Welcome</span>
|
||||
<h1 class="welcome__heading">
|
||||
@@ -47,7 +47,7 @@
|
||||
</div>
|
||||
<img
|
||||
src="./assets/images/header-image.png"
|
||||
alt="header-image"
|
||||
alt="Header Image"
|
||||
class="welcome__image"
|
||||
/>
|
||||
</section>
|
||||
|
||||
@@ -6,9 +6,9 @@
|
||||
--fs-sm: 15px;
|
||||
--fs-md: 20px;
|
||||
--fs-lg: 40px;
|
||||
--ff-crimsontext-regular: CrimsonText-Regular;
|
||||
--ff-crimsontext-700: CrimsonText-700;
|
||||
--ff-worksans-500: WorkSans-500;
|
||||
--ff-worksans-700: WorkSans-700;
|
||||
--ff-worksans-regular: WorkSans-Regular;
|
||||
--ff-secondary-regular: CrimsonText-Regular;
|
||||
--ff-secondary-bold: CrimsonText-Bold;
|
||||
--ff-primary-medium: WorkSans-Medium;
|
||||
--ff-primary-bold: WorkSans-Bold;
|
||||
--ff-primary-regular: WorkSans-Regular;
|
||||
}
|
||||
|
||||
@@ -4,18 +4,18 @@
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: CrimsonText-700;
|
||||
font-family: CrimsonText-Bold;
|
||||
src: url(../../font/CrimsonText-700.ttf);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: WorkSans-500;
|
||||
font-family: WorkSans-Medium;
|
||||
src: url(../../font/WorkSans-500.ttf);
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: WorkSans-700;
|
||||
font-family: WorkSans-Bold;
|
||||
src: url(../../font/WorkSans-700.ttf);
|
||||
}
|
||||
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
padding-bottom: 40px;
|
||||
margin: auto;
|
||||
color: var(--white);
|
||||
font-family: var(--ff-worksans-regular);
|
||||
font-family: var(--ff-primary-regular);
|
||||
font-size: var(--fs-md);
|
||||
}
|
||||
|
||||
@@ -39,7 +39,7 @@
|
||||
color: var(--text-dark);
|
||||
}
|
||||
|
||||
.welcome__container {
|
||||
.welcome {
|
||||
margin: auto;
|
||||
width: 1180px;
|
||||
display: flex;
|
||||
@@ -60,7 +60,7 @@
|
||||
}
|
||||
|
||||
.welcome__title {
|
||||
font-family: var(--ff-worksans-700);
|
||||
font-family: var(--ff-primary-bold);
|
||||
letter-spacing: 5px;
|
||||
text-transform: uppercase;
|
||||
color: var(--white);
|
||||
@@ -68,7 +68,7 @@
|
||||
|
||||
.welcome__heading {
|
||||
font-size: var(--fs-lg);
|
||||
font-family: var(--ff-crimsontext-700);
|
||||
font-family: var(--ff-secondary-bold);
|
||||
line-height: 125%;
|
||||
color: var(--white);
|
||||
}
|
||||
@@ -77,13 +77,14 @@
|
||||
text-transform: none;
|
||||
font-size: var(--fs-sm);
|
||||
letter-spacing: 0px;
|
||||
font-family: var(--ff-worksans-regular);
|
||||
font-family: var(--ff-primary-regular);
|
||||
line-height: 125%;
|
||||
color: var(--white);
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
/* Display & Box Models */
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -91,15 +92,20 @@
|
||||
width: 170px;
|
||||
height: 48px;
|
||||
border: none;
|
||||
|
||||
/* Color */
|
||||
color: var(--black);
|
||||
background-color: var(--white);
|
||||
|
||||
/* Text */
|
||||
font-family: var(--ff-primary-regular);
|
||||
font-size: var(--fs-md);
|
||||
text-decoration: none;
|
||||
line-height: 125%;
|
||||
|
||||
/* Other */
|
||||
cursor: pointer;
|
||||
transition: 0.2s;
|
||||
text-decoration: none;
|
||||
font-size: var(--fs-md);
|
||||
font-family: Work Sans;
|
||||
line-height: 125%;
|
||||
font-family: var(--ff-worksans-regular);
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
|
||||
Reference in New Issue
Block a user