nyanloutre/site-max
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Favico + bouton

Browse source
This commit is contained in:
nyanloutre 2017-07-14 18:13:15 +02:00
parent 1b892e8ec2
commit 4fb04980fc
No known key found for this signature in database
GPG key ID: 4177A74B460FAFD2
5 changed files with 64 additions and 60 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
css/creative.css
View file

@ -145,7 +145,8 @@ header.masthead {
overflow: hidden;
min-height: auto;
display: flex;
align-items: center; }
align-items: center;
justify-content: center; }
header.masthead video {
right: 0;
bottom: 0;
@ -153,6 +154,27 @@ header.masthead {
z-index: -100;
background-size: cover;
overflow: hidden; }
header.masthead .header-content {
position: relative;
width: 100%;
padding: 100px 15px 100px;
text-align: center; }
header.masthead .header-content .header-content-inner h1 {
font-size: 30px;
font-weight: 700;
margin-top: 0;
margin-bottom: 0;
text-transform: uppercase; }
header.masthead .header-content .header-content-inner hr {
margin: 30px auto; }
header.masthead .header-content .header-content-inner p {
font-size: 16px;
font-weight: 300;
margin-bottom: 50px;
color: rgba(255, 255, 255, 0.7); }
header.masthead a {
position: absolute;
bottom: 2rem; }
@media (min-width: 768px) {
header.masthead {
height: 100%; }

2
css/creative.css.map
View file

File diff suppressed because one or more lines are too long

BIN
img/favicon.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 7.4 KiB

69
index.html
View file

@ -9,6 +9,8 @@
<meta name="author" content="">
<title>Creative - Start Bootstrap Theme</title>
<link rel="icon" type="image/jpg" href="img/favicon.jpg" />
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
@ -71,59 +73,17 @@
<video autoplay loop muted>
<source src="video/intro.webm" type="video/webm">
</video>
</header>
<a class="btn btn-default btn-xl" href="#about">Par ici !</a>
</header>
<section class="bg-primary" id="about">
<div class="container">
<div class="row">
<div class="col-lg-8 offset-lg-2 text-center">
<h2 class="section-heading text-white">We've got what you need!</h2>
<h2 class="section-heading text-white">Voici ce que je sais faire</h2>
<hr class="light">
<p class="text-faded">Start Bootstrap has everything you need to get your new website up and running in no time! All of the templates and themes on Start Bootstrap are open source, free to download, and easy to use. No strings attached!</p>
<a class="btn btn-default btn-xl sr-button" href="#services">Get Started!</a>
</div>
</div>
</div>
</section>
<section id="services">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading">At Your Service</h2>
<hr class="primary">
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-diamond text-primary sr-icons"></i>
<h3>Sturdy Templates</h3>
<p class="text-muted">Our templates are updated regularly so they don't break.</p>
</div>
</div>
<div class="col-lg-3 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-paper-plane text-primary sr-icons"></i>
<h3>Ready to Ship</h3>
<p class="text-muted">You can use this theme as is, or you can make changes!</p>
</div>
</div>
<div class="col-lg-3 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-newspaper-o text-primary sr-icons"></i>
<h3>Up to Date</h3>
<p class="text-muted">We update dependencies to keep things fresh.</p>
</div>
</div>
<div class="col-lg-3 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-heart text-primary sr-icons"></i>
<h3>Made with Love</h3>
<p class="text-muted">You have to make your websites with love these days!</p>
</div>
</div>
</div>
</div>
@ -226,28 +186,21 @@
</div>
</section>
<div class="call-to-action bg-dark">
<div class="container text-center">
<h2>Free Download at Start Bootstrap!</h2>
<a class="btn btn-default btn-xl sr-button" href="http://startbootstrap.com/template-overviews/creative/">Download Now!</a>
</div>
</div>
<section id="contact">
<div class="container">
<div class="row">
<div class="col-lg-8 offset-lg-2 text-center">
<h2 class="section-heading">Let's Get In Touch!</h2>
<h2 class="section-heading">Contactez moi !</h2>
<hr class="primary">
<p>Ready to start your next project with us? That's great! Give us a call or send us an email and we will get back to you as soon as possible!</p>
<p>Je m'appelle pelle</p>
</div>
<div class="col-lg-4 offset-lg-2 text-center">
<i class="fa fa-phone fa-3x sr-contact"></i>
<p>123-456-6789</p>
<p>07 12 34 56 78</p>
</div>
<div class="col-lg-4 text-center">
<i class="fa fa-envelope-o fa-3x sr-contact"></i>
<p><a href="mailto:your-email@your-domain.com">feedback@startbootstrap.com</a></p>
<p><a href="mailto:your-email@your-domain.com">max@swag.fr</a></p>
</div>
</div>
</div>

29
scss/_masthead.scss
View file

@ -6,6 +6,7 @@ header.masthead {
min-height: auto;
display: flex;
align-items: center;
justify-content: center;
video {
right: 0;
bottom: 0;
@ -14,6 +15,34 @@ header.masthead {
background-size: cover;
overflow: hidden;
}
.header-content {
position: relative;
width: 100%;
padding: 100px 15px 100px;
text-align: center;
.header-content-inner {
h1 {
font-size: 30px;
font-weight: 700;
margin-top: 0;
margin-bottom: 0;
text-transform: uppercase;
}
hr {
margin: 30px auto;
}
p {
font-size: 16px;
font-weight: 300;
margin-bottom: 50px;
color: fade-out(white, .3);
}
}
}
a {
position: absolute;
bottom: 2rem;
}
@media (min-width: 768px) {
height: 100%;
.header-content {