dio merda
parent
4be4d30fd5
commit
c4dbba65a5
|
@ -0,0 +1,6 @@
|
|||
/* MODIFY HEDER IMAGE */
|
||||
|
||||
.text-center {
|
||||
text-align: RIGHT!important;
|
||||
}
|
||||
|
|
@ -0,0 +1,111 @@
|
|||
.navigation-clean-search {
|
||||
background: #fff;
|
||||
padding-top: .75rem;
|
||||
padding-bottom: .75rem;
|
||||
color: #333;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.navigation-clean-search {
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.navigation-clean-search .navbar-brand {
|
||||
font-weight: bold;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.navigation-clean-search .navbar-brand:hover {
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.navigation-clean-search .navbar-toggler {
|
||||
border-color: #ddd;
|
||||
}
|
||||
|
||||
.navigation-clean-search .navbar-toggler:hover, .navigation-clean-search .navbar-toggler:focus {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.navigation-clean-search .navbar-toggler {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.navigation-clean-search .navbar-collapse, .navigation-clean-search .form-inline {
|
||||
border-top-color: #ddd;
|
||||
}
|
||||
|
||||
.navigation-clean-search .navbar-nav a.active, .navigation-clean-search .navbar-nav > .show > a {
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.navigation-clean-search.navbar-light .navbar-nav a.active, .navigation-clean-search.navbar-light .navbar-nav a.active:focus, .navigation-clean-search.navbar-light .navbar-nav a.active:hover {
|
||||
color: #8f8f8f;
|
||||
box-shadow: none;
|
||||
background: none;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.navigation-clean-search.navbar .navbar-nav .nav-link {
|
||||
padding-left: 18px;
|
||||
padding-right: 18px;
|
||||
}
|
||||
|
||||
.navigation-clean-search.navbar-light .navbar-nav .nav-link {
|
||||
color: #465765;
|
||||
}
|
||||
|
||||
.navigation-clean-search.navbar-light .navbar-nav .nav-link:focus, .navigation-clean-search.navbar-light .navbar-nav .nav-link:hover {
|
||||
color: #37434d !important;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.navigation-clean-search .action-button, .navigation-clean-button .action-button:active {
|
||||
background: #56c6c6;
|
||||
border-radius: 20px;
|
||||
font-size: inherit;
|
||||
color: #fff !important;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
text-shadow: none;
|
||||
padding: 8px 20px;
|
||||
transition: background-color 0.25s;
|
||||
}
|
||||
|
||||
.navigation-clean-search .action-button:hover, .navigation-clean-search .action-button:focus {
|
||||
background: #66d7d7;
|
||||
}
|
||||
|
||||
.navigation-clean-search .form-inline label {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.navigation-clean-search .form-inline .search-field {
|
||||
background: none;
|
||||
border: none;
|
||||
border-bottom: 1px solid transparent;
|
||||
border-radius: 0;
|
||||
color: #ccc;
|
||||
box-shadow: none;
|
||||
color: inherit;
|
||||
transition: border-bottom-color 0.3s;
|
||||
}
|
||||
|
||||
@media (max-width:767px) {
|
||||
.navigation-clean-search .form-inline .search-field {
|
||||
display: inline-block;
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
.navigation-clean-search .form-inline .search-field:focus {
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
|
Binary file not shown.
After Width: | Height: | Size: 671 KiB |
207
Src/index.html
207
Src/index.html
|
@ -9,126 +9,129 @@
|
|||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Aclonica">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Crimson+Text">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lobster+Two">
|
||||
<link rel="stylesheet" href="assets/fonts/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="assets/fonts/simple-line-icons.min.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
|
||||
<link rel="stylesheet" href="assets/css/BoostrapModify.css">
|
||||
<link rel="stylesheet" href="assets/css/Navigation-with-Search.css">
|
||||
</head>
|
||||
|
||||
<body style="background-color: rgb(0,0,0);">
|
||||
<nav class="navbar navbar-light navbar-expand bg-light navigation-clean" style="background-color: #000000!important;padding: 23px 10px;margin: 17px;">
|
||||
<div class="container"><button data-toggle="collapse" class="navbar-toggler" data-target="#navcol-1" style="background-color: #000000;"></button><a class="navbar-brand" style="color: rgba(255,0,0,0.9);font-size: x-large;font-family: Aclonica, sans-serif;padding: 7px;margin: -89px;">LordChannel</a>
|
||||
<div
|
||||
class="collapse navbar-collapse" id="navcol-1"><a class="btn btn-primary ml-auto" role="button" href="#" style="margin: -97px;padding: 8px;">Sign In</a></div>
|
||||
<body class="justify-content-center m-auto" style="background-color: #1F1F1F;">
|
||||
<nav class="navbar navbar-light navbar-expand bg-light navigation-clean" style="background-color: #000000!important;padding: 23px 10px;margin: 16px;height: 98px;font-family: Aclonica, sans-serif;padding-right: 0px;padding-left: 0px;margin-right: 0px;margin-left: 0px;margin-bottom: 0px;">
|
||||
<div class="container"><a class="navbar-brand text-justify align-self-center" style="color: rgba(255,0,0,0.9);font-size: 50px;font-family: 'Lobster Two', cursive;padding: 7px;margin: -89px;height: 60px;">LordChannel</a>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="btn-group" role="group" style="margin: -89px;padding: 7px;margin-bottom: -139px;"><button class="btn btn-primary text-monospace" type="button" style="background-color: rgba(0,123,255,0);color: red;font-size: 30px;font-family: 'Lobster Two', cursive;border: none;">Film</button>
|
||||
<div class="dropdown btn-group" role="group"><button class="btn btn-primary dropdown-toggle text-monospace text-justify" data-toggle="dropdown" aria-expanded="false" type="button" style="background-color: #000000!important;color: red;font-family: 'Lobster Two', cursive;font-size: 30px;border: none;">Serie TV </button>
|
||||
<div
|
||||
class="dropdown-menu" role="menu"><a class="dropdown-item" role="presentation" href="#">First Item</a><a class="dropdown-item" role="presentation" href="#">Second Item</a><a class="dropdown-item" role="presentation" href="#">Third Item</a></div>
|
||||
</div>
|
||||
<div class="dropdown btn-group" role="group"><button class="btn btn-primary dropdown-toggle text-monospace text-justify" data-toggle="dropdown" aria-expanded="false" type="button" style="background-color: #000000!important;color: red;font-family: 'Lobster Two', cursive;border: none;font-size: 30px;">Anime</button>
|
||||
<div
|
||||
class="dropdown-menu" role="menu"><a class="dropdown-item" role="presentation" href="#">First Item</a><a class="dropdown-item" role="presentation" href="#">Second Item</a><a class="dropdown-item" role="presentation" href="#">Third Item</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<header class="masthead text-white text-center" style="background:url('assets/img/bg-masthead.jpg')no-repeat center center;background-size:cover;">
|
||||
<div class="overlay" style="background-color: rgb(33,37,41);"></div>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-xl-9 mx-auto">
|
||||
<h1 class="mb-5">Build a landing page for your business or project and generate more leads!</h1>
|
||||
</div>
|
||||
<div class="col-md-10 col-lg-8 col-xl-7 mx-auto">
|
||||
<form>
|
||||
<div class="form-row">
|
||||
<div class="col-12 col-md-9 mb-2 mb-md-0"><input class="form-control form-control-lg" type="email" placeholder="Enter your email..."></div>
|
||||
<div class="col-12 col-md-3"><button class="btn btn-primary btn-block btn-lg" type="submit">Sign up!</button></div>
|
||||
</div>
|
||||
</form>
|
||||
<header class="masthead text-white text-center" style="/*background: url('assets/img/bg-masthead.jpg')no-repeat center center;*/background-size: cover;height: 107px;/*border: 1px solid blue;*/padding-top: 0px;padding-bottom: 0px;margin-right: 36px;padding-right: 10px;padding-left: 10px;margin-left: 36px;background-color: #1F1F1F;"><img style="background-image: url(" https://scontent-mxp1-1.xx.fbcdn.net/v/t31.0-8/29983660_1649367048446432_6586102201764230226_o.jpg?_nc_cat=111&_nc_sid=dd9801&_nc_ohc=TLWo4XMML84AX89CZs8&_nc_ht=scontent-mxp1-1.xx&oh=05b116e7f6dc501dbfe7a0f028fe8381&oe=5F3E3214");background-size: cover;height: inherit;width: 180px;margin: 0px;padding-left: 0px;margin-left: 0px;position: absolute;top: 0;left: 0;">
|
||||
<input
|
||||
type="search" style="position: relative;top: 30px;width: 500px;" placeholder="Cerca contenuti" name="Ricerca"></header>
|
||||
<article style="margin-right: 36px;margin-left: 36px;">
|
||||
<div>
|
||||
<div class="carousel slide" data-ride="carousel" id="carousel-1" style="height: 500px;">
|
||||
<div class="carousel-inner" role="listbox">
|
||||
<div class="carousel-item"></div>
|
||||
<div class="carousel-item"></div>
|
||||
<div class="carousel-item active"></div>
|
||||
</div>
|
||||
<div><a class="carousel-control-prev" href="#carousel-1" role="button" data-slide="prev"><span class="carousel-control-prev-icon"></span><span class="sr-only">Previous</span></a><a class="carousel-control-next" href="#carousel-1" role="button"
|
||||
data-slide="next"><span class="carousel-control-next-icon"></span><span class="sr-only">Next</span></a></div>
|
||||
<ol class="carousel-indicators" style="margin: 31px;">
|
||||
<li data-target="#carousel-1" data-slide-to="0"></li>
|
||||
<li data-target="#carousel-1" data-slide-to="1"></li>
|
||||
<li data-target="#carousel-1" data-slide-to="2" class="active"></li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<section class="features-icons bg-light text-center">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-4">
|
||||
<div class="mx-auto features-icons-item mb-5 mb-lg-0 mb-lg-3">
|
||||
<div class="d-flex features-icons-icon"><i class="icon-screen-desktop m-auto text-primary" data-bs-hover-animate="pulse"></i></div>
|
||||
<h3>Fully Responsive</h3>
|
||||
<p class="lead mb-0">This theme will look great on any device, no matter the size!</p>
|
||||
</article>
|
||||
<section style="margin-right: 36px;margin-left: 36px;">
|
||||
<div>
|
||||
<div class="row" style="height: 500;">
|
||||
<div class="col">
|
||||
<div class="container">
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item border rounded" style="margin-top: 15px;background-color: green;"><span>Film</span>
|
||||
<ul>
|
||||
<li>Item 1</li>
|
||||
<li>Item 2</li>
|
||||
<li>Item 3</li>
|
||||
<li>Item 4</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="list-group-item border rounded" style="margin-top: 15px;"><span>Serie TV</span>
|
||||
<ul>
|
||||
<li>Item 1</li>
|
||||
<li>Item 2</li>
|
||||
<li>Item 3</li>
|
||||
<li>Item 4</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="list-group-item border rounded" style="margin-top: 15px;background-color: red;margin-bottom: 15px;"><span>Anime</span>
|
||||
<ul>
|
||||
<li>Item 1</li>
|
||||
<li>Item 2</li>
|
||||
<li>Item 3</li>
|
||||
<li>Item 4</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<div class="mx-auto features-icons-item mb-5 mb-lg-0 mb-lg-3">
|
||||
<div class="d-flex features-icons-icon"><i class="icon-layers m-auto text-primary" data-bs-hover-animate="pulse"></i></div>
|
||||
<h3>Bootstrap 4 Ready</h3>
|
||||
<p class="lead mb-0">Featuring the latest build of the new Bootstrap 4 framework!</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<div class="mx-auto features-icons-item mb-5 mb-lg-0 mb-lg-3">
|
||||
<div class="d-flex features-icons-icon"><i class="icon-check m-auto text-primary" data-bs-hover-animate="pulse"></i></div>
|
||||
<h3>Easy to Use</h3>
|
||||
<p class="lead mb-0">Ready to use with your own content, or customize the source files!</p>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="container" style="height: 496px;">
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item text-monospace text-capitalize text-light border-warning" style="background-color: rgba(255,255,255,0);color: #ffffff;margin-top: 15px;"><span>Contenuti più visti</span>
|
||||
<ul>
|
||||
<li>Item 1</li>
|
||||
<li>Item 2</li>
|
||||
<li>Item 3</li>
|
||||
<li>Item 4</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul><button class="btn btn-primary border rounded" type="button" style="margin-top: 15px;width: 600.5px;height: 307px;padding: 12px 20px;background-image: url("assets/img/LordGaydonazioni.gif");color: black;font-size: 50px;">Donazioni</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="showcase">
|
||||
<div class="container-fluid p-0">
|
||||
<div class="row no-gutters">
|
||||
<div class="col-lg-6 order-lg-2 text-white showcase-img" style="background-image:url("assets/img/bg-showcase-1.jpg");"><span></span></div>
|
||||
<div class="col-lg-6 my-auto order-lg-1 showcase-text">
|
||||
<h2>Fully Responsive Design</h2>
|
||||
<p class="lead mb-0">When you use a theme created with Bootstrap, you know that the theme will look great on any device, whether it's a phone, tablet, or desktop the page will behave responsively!</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row no-gutters">
|
||||
<div class="col-lg-6 text-white showcase-img" style="background-image:url("assets/img/bg-showcase-2.jpg");"><span></span></div>
|
||||
<div class="col-lg-6 my-auto order-lg-1 showcase-text"></div>
|
||||
</div>
|
||||
<div class="row no-gutters">
|
||||
<div class="col-lg-6 order-lg-2 text-white showcase-img" style="background-image:url("assets/img/bg-showcase-3.jpg");"><span></span></div>
|
||||
<div class="col-lg-6 my-auto order-lg-1 showcase-text"></div>
|
||||
</div>
|
||||
<footer class="footer bg-light" style="background-color: #1F1F1F!important;height: 180px;margin-top: 20px;margin-right: 36px;margin-left: 36px;"><div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-3 h-100 text-center text-lg-left"></div>
|
||||
<div class="col-lg-3 invisible h-100 text-center text-lg-left"></div>
|
||||
<div class="col-lg-3 my-auto h-100 text-center text-lg-left">
|
||||
<ul class="list-inline mb-2">
|
||||
<li class="list-inline-item"><a href="#">About</a></li>
|
||||
<li class="list-inline-item"><span>⋅</span></li>
|
||||
<li class="list-inline-item"><a href="#">Contact</a></li>
|
||||
<li class="list-inline-item"><span>⋅</span></li>
|
||||
<li class="list-inline-item"><a href="#">Terms of Use</a></li>
|
||||
<li class="list-inline-item"><span>⋅</span></li>
|
||||
<li class="list-inline-item"><a href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
<p class="text-muted small mb-4 mb-lg-0">© LordChannel 2018. All Rights Reserved.</p>
|
||||
</div>
|
||||
</section>
|
||||
<section class="testimonials text-center bg-light">
|
||||
<div class="container">
|
||||
<h2 class="mb-5">What people are saying...</h2>
|
||||
<div class="row">
|
||||
<div class="col-lg-4">
|
||||
<div class="mx-auto testimonial-item mb-5 mb-lg-0"><img class="rounded-circle img-fluid mb-3" src="assets/img/testimonials-1.jpg">
|
||||
<h5>Margaret E.</h5>
|
||||
<p class="font-weight-light mb-0">"This is fantastic! Thanks so much guys!"</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 my-auto h-100 text-center text-lg-right" style>
|
||||
<ul class="list-inline mb-0">
|
||||
<li class="list-inline-item"><a href="#"><i class="fa fa-facebook fa-2x fa-fw"></i></a></li>
|
||||
<li class="list-inline-item"><a href="#"><i class="fa fa-twitter fa-2x fa-fw"></i></a></li>
|
||||
<li class="list-inline-item"><a href="#"><i class="fa fa-instagram fa-2x fa-fw"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<section class="call-to-action text-white text-center" style="background:url("assets/img/bg-masthead.jpg") no-repeat center center;background-size:cover;">
|
||||
<div class="overlay"></div>
|
||||
</section>
|
||||
<footer class="footer bg-light" style="background-color: #000000!important;">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-6 my-auto h-100 text-center text-lg-left">
|
||||
<ul class="list-inline mb-2">
|
||||
<li class="list-inline-item"><a href="#">About</a></li>
|
||||
<li class="list-inline-item"><span>⋅</span></li>
|
||||
<li class="list-inline-item"><a href="#">Contact</a></li>
|
||||
<li class="list-inline-item"><span>⋅</span></li>
|
||||
<li class="list-inline-item"><a href="#">Terms of Use</a></li>
|
||||
<li class="list-inline-item"><span>⋅</span></li>
|
||||
<li class="list-inline-item"><a href="#">Privacy Policy</a></li>
|
||||
</ul>
|
||||
<p class="text-muted small mb-4 mb-lg-0">© LordChannel 2018. All Rights Reserved.</p>
|
||||
</div>
|
||||
<div class="col-lg-6 my-auto h-100 text-center text-lg-right">
|
||||
<ul class="list-inline mb-0">
|
||||
<li class="list-inline-item"><a href="#"><i class="fa fa-facebook fa-2x fa-fw"></i></a></li>
|
||||
<li class="list-inline-item"><a href="#"><i class="fa fa-twitter fa-2x fa-fw"></i></a></li>
|
||||
<li class="list-inline-item"><a href="#"><i class="fa fa-instagram fa-2x fa-fw"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</div></footer>
|
||||
<script src="assets/js/jquery.min.js"></script>
|
||||
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="assets/js/bs-animation.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
Loading…
Reference in New Issue