Skip to content
GitLab
Commit c5c6ccd0 authored by Mihajlo Srebrenoski's avatar Mihajlo Srebrenoski
Browse files

Challenge-07 added

parent 44800fb3
Challenge-07
Hide whitespace changes
Inline Side-by-side
Showing
with 185 additions and 0 deletions
+185 -0
Challenge-07/README.md 0 → 100644
+ 1
- 0
View file @ c5c6ccd0
# Challenge-07
\ No newline at end of file
Challenge-07/images/create-section11.jpg 0 → 100644
+ 0
- 0
View file @ c5c6ccd0
Challenge-07/images/create-section11.jpg

70.5 KB

Challenge-07/images/explore-section11.jpg 0 → 100644
+ 0
- 0
View file @ c5c6ccd0
Challenge-07/images/explore-section11.jpg

592 KB

Challenge-07/images/home.jpg 0 → 100644
+ 0
- 0
View file @ c5c6ccd0
Challenge-07/images/home.jpg

307 KB

Challenge-07/images/share-section11.jpg 0 → 100644
+ 0
- 0
View file @ c5c6ccd0
Challenge-07/images/share-section11.jpg

23.6 KB

Challenge-07/index.html 0 → 100644
+ 170
- 0
View file @ c5c6ccd0
<!DOCTYPE html>
<html>
<head>
<title>Challenge-07</title>
<meta charset="utf-8" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<!-- Latest compiled and minified Bootstrap 4.6 CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
<!-- CSS script -->
<link rel="stylesheet" href="./style.css">
<!-- Latest Font-Awesome CDN -->
<script src="https://kit.fontawesome.com/3a818acd01.js" crossorigin="anonymous"></script>
</head>
<body data-spy="scroll" data-target="#nav-control" data-offset="56">
<!-- Nav-Section -->
<nav id="nav-control" class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
<a class="navbar-brand text-uppercase" href="#">Blogger</a>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#nav-content"
aria-controls="nav-content"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="nav-content">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="#home">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#explore">Explore</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#create">Create</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#share">Share</a>
</li>
</ul>
</div>
</nav>
<!-- Home-Section -->
<main class="py-5" id="home">
<div class="container py-5 mz-4">
<div class="row py-5 my-5 ">
<div class="col-lg-7 d-none d-lg-block ">
<h2 class="text-white">Bild <span class="text-danger">social profiles</span> and gain revenue and <span class="text-danger">profits</span></h2>
<ul class="fa-ul">
<li class="text-white mb-3"><span class="fa-li"><i class="fa-solid fa-check text-primary rounded bg-light p-1"></i></span>Nulla ipsum cupdatat laboris aute amet. Nisi culpa cupidatat et laboris deserunt ut qui incididunt proident duis mollit. Sit amet ea magna repregenderit deserunt sit.</li>
<li class="text-white mb-3"><span class="fa-li"><i class="fa-solid fa-check text-primary rounded bg-light p-1"></i></span>Nulla ipsum cupdatat laboris aute amet. Nisi culpa cupidatat et laboris deserunt ut qui incididunt proident duis mollit. Sit amet ea magna repregenderit deserunt sit.</li>
<li class="text-white"><span class="fa-li"><i class="fa-solid fa-check text-primary rounded bg-light p-1"></i></span>Nulla ipsum cupdatat laboris aute amet. Nisi culpa cupidatat et laboris deserunt ut qui incididunt proident duis mollit. Sit amet ea magna repregenderit deserunt sit.</li>
</ul>
</div>
<div class="col ">
<div class="bg-prple p-3">
<h2 class="text-center text-white text-capitalize">Sing up today</h2>
<p class="text-center text-white">please fill out this form to register</p>
<form>
<div class="form-group">
<input type="text" class="form-control mb-3" name="Username" id="userName" aria-describedby="emailHelpId" placeholder="Username">
</div>
<div class="form-group">
<input type="email" class="form-control mb-3" name="email" id="email" aria-describedby="emailHelpId" placeholder="Email">
</div>
<div class="form-group">
<input type="password" class="form-control mb-3" name="password" id="password" aria-describedby="emailHelpId" placeholder="Password">
</div>
<div class="form-group">
<input type="password" class="form-control mb-3" name="confirmPassword" id="confirmPassword" aria-describedby="emailHelpId" placeholder="Confirm Password">
</div>
<button type="button" name="" id="" class="btn btn-outline-light btn-block">Subbmit</button>
</form>
</div>
</div>
</div>
</div>
</main>
<div class="container-fuid">
<!-- Explore-Section -->
<section id="explore" class="bg-dark text-white text-center p-5">
<h3 class="">Explore</h3>
<p>Ut eu cupidatat tempor non. Ex culpa officia cillum sunt fugiat incididunt proident commodo amet tempor officia esse culpa est. Excepteur veniam enim incididunt enim occaecat commodo ex. Aliqua esse magna eiusmod enim irure qui sit ex consequat ex sint. Ea consectetur eu laborum dolor exceptur proident aliqua tempor tempor cupidatat cillum proident laborum. Qui qui officia in non. Et sunt ipsum enim aute eu in nisi.</p>
<a name="" id="" class="btn btn-outline-light" href="#" role="button">Find Out More</a>
</section>
<section class="bg-white p-5">
<div class="row align-items-center ">
<div class="col-lg-6 col-12 ">
<img class="w-100 rounded-circle" src="./images/explore-section11.jpg" alt="Explore">
</div>
<div class="col-lg-6 col-12 ">
<h3>Explore & Connect</h3>
<p> Ex culpa officia cillum sunt fugiat incididunt proident commodo amet tempor officia esse culpa est. Excepteur veniam enim incididunt enim occaecat commodo ex. Aliqua esse magna eiusmod enim irure qui sit ex consequat ex sint. Ea consectetur eu laborum dolor exceptur proident aliqua tempor tempor cupidatat cillum proident laborum. Qui qui officia in non. Et sunt ipsum enim aute eu in nisi.</p>
<ul class="fa-ul">
<li class=" mb-3"><span class="fa-li"><i class="fa-solid fa-check text-white rounded bg-dark p-1"></i></span>Nulla ipsum cupdatat laboris aute amet. Nisi culpa cupidatat et laboris deserunt ut qui incididunt proident duis mollit. Sit amet ea magna repregenderit deserunt sit.</li>
<li class=" mb-3"><span class="fa-li"><i class="fa-solid fa-check text-white rounded bg-dark p-1"></i></span>Nulla ipsum cupdatat laboris aute amet. Nisi culpa cupidatat et laboris deserunt ut qui incididunt proident duis mollit. Sit amet ea magna repregenderit deserunt sit.</li>
</ul>
</div>
</div>
</section>
<!-- Create - Section -->
<section id="create" class="bg-prple text-white text-center p-5">
<h3 class="">Create</h3>
<p>Ut eu cupidatat tempor non. Ex culpa officia cillum sunt fugiat incididunt proident commodo amet tempor officia esse culpa est. Excepteur veniam enim incididunt enim occaecat commodo ex. Aliqua esse magna eiusmod enim irure qui sit ex consequat ex sint. Ea consectetur eu laborum dolor exceptur proident aliqua tempor tempor cupidatat cillum proident laborum. Qui qui officia in non. Et sunt ipsum enim aute eu in nisi.</p>
<a name="" id="" class="btn btn-outline-light" href="#" role="button">Find Out More</a>
</section>
<section class=" bg-dark p-5">
<div class="row align-items-center ">
<div class="col-lg-6 col-12 text-white">
<h3>Create Your Passion</h3>
<p> Ex culpa officia cillum sunt fugiat incididunt proident commodo amet tempor officia esse culpa est. Excepteur veniam enim incididunt enim occaecat commodo ex. Aliqua esse magna eiusmod enim irure qui sit ex consequat ex sint. Ea consectetur eu laborum dolor exceptur proident aliqua tempor tempor cupidatat cillum proident laborum. Qui qui officia in non. Et sunt ipsum enim aute eu in nisi.</p>
<ul class="fa-ul">
<li class=" mb-3"><span class="fa-li"><i class="fa-solid fa-check text-primary rounded bg-light p-1"></i></span>Nulla ipsum cupdatat laboris aute amet. Nisi
culpa cupidatat et laboris deserunt ut qui incididunt proident duis mollit. Sit amet ea magna repregenderit deserunt sit.</li>
<li class=" mb-3"><span class="fa-li"><i class="fa-solid fa-check text-primary rounded bg-light p-1"></i></span>Nulla ipsum cupdatat laboris aute amet. Nisi
culpa cupidatat et laboris deserunt ut qui incididunt proident duis mollit. Sit amet ea magna repregenderit deserunt sit.</li>
</ul>
</div>
<div class="col-lg-6 col-12 ">
<img class="w-100 rounded-circle" src="./images/create-section11.jpg" alt="Create">
</div>
</div>
</section>
<!-- Share-Section -->
<section id="share" class="bg-prple text-white text-center p-5">
<h3 class="">Share</h3>
<p>Ut eu cupidatat tempor non. Ex culpa officia cillum sunt fugiat incididunt proident commodo amet tempor officia esse culpa est. Excepteur veniam enim incididunt enim occaecat commodo ex. Aliqua esse magna eiusmod enim irure qui sit ex consequat ex sint. Ea consectetur eu laborum dolor exceptur proident aliqua tempor tempor cupidatat cillum proident laborum. Qui qui officia in non. Et sunt ipsum enim aute eu in nisi.</p>
<a name="" id="" class="btn btn-outline-light" href="#" role="button">Find Out More</a>
</section>
<section class="bg-white p-5">
<div class="row align-items-center ">
<div class="col-lg-6 col-12 ">
<img class="w-100 rounded-circle" src="./images/share-section11.jpg" alt="Shere">
</div>
<div class="col-lg-6 col-12 ">
<h3>Shere What You Create</h3>
<p> Ex culpa officia cillum sunt fugiat incididunt proident commodo amet tempor officia esse culpa est. Excepteur veniam enim incididunt enim occaecat commodo ex. Aliqua esse magna eiusmod enim irure qui sit ex consequat ex sint. Ea consectetur eu laborum dolor exceptur proident aliqua tempor tempor cupidatat cillum proident laborum. Qui qui officia in non. Et sunt ipsum enim aute eu in nisi.</p>
<ul class="fa-ul">
<li class=" mb-3"><span class="fa-li"><i class="fa-solid fa-check text-white rounded bg-dark p-1"></i></span>Nulla ipsum cupdatat laboris aute amet. Nisi culpa cupidatat et laboris deserunt ut qui incididunt proident duis mollit. Sit amet ea magna repregenderit deserunt sit.</li>
<li class=" mb-3"><span class="fa-li"><i class="fa-solid fa-check text-white rounded bg-dark p-1"></i></span>Nulla ipsum cupdatat laboris aute amet. Nisi culpa cupidatat et laboris deserunt ut qui incididunt proident duis mollit. Sit amet ea magna repregenderit deserunt sit.</li>
</ul>
</div>
</div>
</section>
<!-- Footer-Section -->
<footer class="bg-dark text-center text-white p-4">
<h4>BOLGGER</h4>
<p>Copyright &copy; 2017</p>
<a name="" id="" class="btn btn-primary" href="#" role="button">Contact Us</a>
</footer>
</div>
<!-- jQuery library -->
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="ha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<!-- Latest Compiled Bootstrap 4.6 JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.min.js" integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+" crossorigin="anonymous"></script>
</body>
</html>
\ No newline at end of file
Challenge-07/screenshots _ video/07_Предизвик_Видео.webm 0 → 100644
+ 0
- 0
View file @ c5c6ccd0
File added
Challenge-07/screenshots _ video/Laptop.png 0 → 100644
+ 0
- 0
View file @ c5c6ccd0
Challenge-07/screenshots _ video/Laptop.png

2.71 MB

Challenge-07/screenshots _ video/Mobile-L.png 0 → 100644
+ 0
- 0
View file @ c5c6ccd0
Challenge-07/screenshots _ video/Mobile-L.png

673 KB

Challenge-07/screenshots _ video/Mobile-S.png 0 → 100644
+ 0
- 0
View file @ c5c6ccd0
Challenge-07/screenshots _ video/Mobile-S.png

483 KB

Challenge-07/screenshots _ video/Mobile_Menu.png 0 → 100644
+ 0
- 0
View file @ c5c6ccd0
Challenge-07/screenshots _ video/Mobile_Menu.png

107 KB

Challenge-07/screenshots _ video/Tablet.png 0 → 100644
+ 0
- 0
View file @ c5c6ccd0
Challenge-07/screenshots _ video/Tablet.png

1.46 MB

Challenge-07/style.css 0 → 100644
+ 14
- 0
View file @ c5c6ccd0
body{
position: relative;
padding-top: 56px;
}
main{
background-image: linear-gradient(rgba(0, 0, 0, 0.7),rgba(0, 0, 0, 0.7)), url(./images/home.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
.bg-prple {
background-color: #4900D5;
}
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment