rdd.ro/nunta
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

SCSS update - changed some variables and removed some redundant classes

Browse Source
This commit is contained in:
David Miller 2017-10-20 18:22:10 -04:00
parent 6fd3c9bff5
commit 35edb7f9e9
17 changed files with 170 additions and 205 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

201
css/agency.css
View File

@ -15,6 +15,9 @@ a {
a.active, a:active, a:focus, a:hover { a.active, a:active, a:focus, a:hover {
color: #fec503; } color: #fec503; }
.text-primary {
color: #fed136 !important; }
h1, h1,
h2, h2,
h3, h3,
@ -22,8 +25,7 @@ h4,
h5, h5,
h6 { h6 {
font-weight: 700; font-weight: 700;
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
text-transform: uppercase; }
section { section {
padding: 100px 0; } padding: 100px 0; }
@ -43,6 +45,51 @@ section {
section { section {
padding: 150px 0; } } padding: 150px 0; } }
.btn {
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-weight: 700; }
.btn-primary {
color: white;
border-color: #fed136;
background-color: #fed136; }
.btn-primary.focus, .btn-primary:focus {
color: white;
border-color: #b48b01;
background-color: #fec503; }
.btn-primary:hover {
color: white;
border-color: #f6bf01;
background-color: #fec503; }
.btn-primary.active, .btn-primary:active,
.open > .btn-primary.dropdown-toggle {
color: white;
border-color: #f6bf01;
background-color: #fec503; }
.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover,
.open > .btn-primary.dropdown-toggle.focus,
.open > .btn-primary.dropdown-toggle:focus,
.open > .btn-primary.dropdown-toggle:hover {
color: white;
border-color: #b48b01;
background-color: #dcab01; }
.btn-primary.active, .btn-primary:active,
.open > .btn-primary.dropdown-toggle {
background-image: none; }
.btn-primary.disabled.focus, .btn-primary.disabled:focus, .btn-primary.disabled:hover, .btn-primary[disabled].focus, .btn-primary[disabled]:focus, .btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary.focus,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary:hover {
border-color: #fed136;
background-color: #fed136; }
.btn-primary .badge {
color: #fed136;
background-color: white; }
.btn-xl {
font-size: 18px;
padding: 20px 40px; }
::-moz-selection { ::-moz-selection {
background: #fed136; background: #fed136;
text-shadow: none; } text-shadow: none; }
@ -61,7 +108,7 @@ body {
-webkit-tap-highlight-color: #fed136; } -webkit-tap-highlight-color: #fed136; }
#mainNav { #mainNav {
background-color: #222222; } background-color: #212529; }
#mainNav .navbar-toggler { #mainNav .navbar-toggler {
font-size: 12px; font-size: 12px;
right: 0; right: 0;
@ -70,8 +117,7 @@ body {
color: white; color: white;
border: 0; border: 0;
background-color: #fed136; background-color: #fed136;
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
text-transform: uppercase; }
#mainNav .navbar-brand { #mainNav .navbar-brand {
color: #fed136; color: #fed136;
font-family: 'Kaushan Script', 'Helvetica Neue', Helvetica, Arial, cursive; } font-family: 'Kaushan Script', 'Helvetica Neue', Helvetica, Arial, cursive; }
@ -83,8 +129,7 @@ body {
padding: 0.75em 0; padding: 0.75em 0;
letter-spacing: 1px; letter-spacing: 1px;
color: white; color: white;
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
text-transform: uppercase; }
#mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover { #mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover {
color: #fed136; } color: #fed136; }
@ -107,7 +152,7 @@ body {
#mainNav.navbar-shrink { #mainNav.navbar-shrink {
padding-top: 0; padding-top: 0;
padding-bottom: 0; padding-bottom: 0;
background-color: #222222; } background-color: #212529; }
#mainNav.navbar-shrink .navbar-brand { #mainNav.navbar-shrink .navbar-brand {
font-size: 1.25em; font-size: 1.25em;
padding: 12px 0; } } padding: 12px 0; } }
@ -137,8 +182,7 @@ header.masthead {
font-weight: 700; font-weight: 700;
line-height: 50px; line-height: 50px;
margin-bottom: 25px; margin-bottom: 25px;
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
text-transform: uppercase; }
@media (min-width: 768px) { @media (min-width: 768px) {
header.masthead .intro-text { header.masthead .intro-text {
@ -155,8 +199,7 @@ header.masthead {
font-weight: 700; font-weight: 700;
line-height: 75px; line-height: 75px;
margin-bottom: 50px; margin-bottom: 50px;
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; } }
text-transform: uppercase; } }
.service-heading { .service-heading {
margin: 15px 0; margin: 15px 0;
@ -201,7 +244,7 @@ header.masthead {
margin: 0 auto; margin: 0 auto;
padding: 25px; padding: 25px;
text-align: center; text-align: center;
background-color: white; } background-color: #fff; }
#portfolio .portfolio-item .portfolio-caption h4 { #portfolio .portfolio-item .portfolio-caption h4 {
margin: 0; margin: 0;
text-transform: none; } text-transform: none; }
@ -270,7 +313,7 @@ header.masthead {
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg); -ms-transform: rotate(45deg);
transform: rotate(45deg); transform: rotate(45deg);
background-color: #222222; } background-color: #212529; }
.portfolio-modal .close-modal .lr .rl { .portfolio-modal .close-modal .lr .rl {
/* Safari and Chrome */ /* Safari and Chrome */
z-index: 1052; z-index: 1052;
@ -280,7 +323,7 @@ header.masthead {
-webkit-transform: rotate(90deg); -webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg); -ms-transform: rotate(90deg);
transform: rotate(90deg); transform: rotate(90deg);
background-color: #222222; } background-color: #212529; }
.portfolio-modal .modal-backdrop { .portfolio-modal .modal-backdrop {
display: none; display: none;
@ -298,7 +341,7 @@ header.masthead {
width: 2px; width: 2px;
margin-left: -1.5px; margin-left: -1.5px;
content: ''; content: '';
background-color: #f1f1f1; } background-color: #e9ecef; }
.timeline > li { .timeline > li {
position: relative; position: relative;
min-height: 50px; min-height: 50px;
@ -333,7 +376,7 @@ header.masthead {
margin-left: 0; margin-left: 0;
text-align: center; text-align: center;
color: white; color: white;
border: 7px solid #f1f1f1; border: 7px solid #e9ecef;
border-radius: 100%; border-radius: 100%;
background-color: #fed136; } background-color: #fed136; }
.timeline > li .timeline-image h4 { .timeline > li .timeline-image h4 {
@ -426,7 +469,7 @@ header.masthead {
.team-member img { .team-member img {
width: 225px; width: 225px;
height: 225px; height: 225px;
border: 7px solid white; } border: 7px solid #fff; }
.team-member h4 { .team-member h4 {
margin-top: 25px; margin-top: 25px;
margin-bottom: 0; margin-bottom: 0;
@ -435,12 +478,12 @@ header.masthead {
margin-top: 0; } margin-top: 0; }
section#contact { section#contact {
background-color: #222222; background-color: #212529;
background-image: url("../img/map-image.png"); background-image: url("../img/map-image.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; } background-position: center; }
section#contact .section-heading { section#contact .section-heading {
color: white; } color: #fff; }
section#contact .form-group { section#contact .form-group {
margin-bottom: 25px; } margin-bottom: 25px; }
section#contact .form-group input, section#contact .form-group input,
@ -449,34 +492,28 @@ section#contact {
section#contact .form-group input.form-control { section#contact .form-group input.form-control {
height: auto; } height: auto; }
section#contact .form-group textarea.form-control { section#contact .form-group textarea.form-control {
height: 236px; } height: 248px; }
section#contact .form-control:focus { section#contact .form-control:focus {
border-color: #fed136; border-color: #fed136;
box-shadow: none; } box-shadow: none; }
section#contact ::-webkit-input-placeholder { section#contact ::-webkit-input-placeholder {
font-weight: 700; font-weight: 700;
color: #eeeeee; color: #ced4da;
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
text-transform: uppercase; }
section#contact :-moz-placeholder { section#contact :-moz-placeholder {
font-weight: 700; font-weight: 700;
color: #eeeeee; color: #ced4da;
/* Firefox 18- */ /* Firefox 18- */
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
text-transform: uppercase; }
section#contact ::-moz-placeholder { section#contact ::-moz-placeholder {
font-weight: 700; font-weight: 700;
color: #eeeeee; color: #ced4da;
/* Firefox 19+ */ /* Firefox 19+ */
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
text-transform: uppercase; }
section#contact :-ms-input-placeholder { section#contact :-ms-input-placeholder {
font-weight: 700; font-weight: 700;
color: #eeeeee; color: #ced4da;
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
text-transform: uppercase; }
section#contact .text-danger {
color: #e74c3c; }
footer { footer {
padding: 25px 0; padding: 25px 0;
@ -485,15 +522,13 @@ footer {
font-size: 90%; font-size: 90%;
line-height: 40px; line-height: 40px;
text-transform: none; text-transform: none;
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
text-transform: uppercase; }
footer ul.quicklinks { footer ul.quicklinks {
font-size: 90%; font-size: 90%;
line-height: 40px; line-height: 40px;
margin-bottom: 0; margin-bottom: 0;
text-transform: none; text-transform: none;
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
text-transform: uppercase; }
ul.social-buttons { ul.social-buttons {
margin-bottom: 0; } margin-bottom: 0; }
@ -509,92 +544,6 @@ ul.social-buttons {
color: white; color: white;
border-radius: 100%; border-radius: 100%;
outline: none; outline: none;
background-color: #222222; } background-color: #212529; }
ul.social-buttons li a:active, ul.social-buttons li a:focus, ul.social-buttons li a:hover { ul.social-buttons li a:active, ul.social-buttons li a:focus, ul.social-buttons li a:hover {
background-color: #fed136; } background-color: #fed136; }
.text-primary {
color: #fed136 !important; }
.btn-primary {
font-weight: 700;
color: white;
border-color: #fed136;
background-color: #fed136;
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
text-transform: uppercase; }
.btn-primary.focus, .btn-primary:focus {
color: white;
border-color: #b48b01;
background-color: #fec503; }
.btn-primary:hover {
color: white;
border-color: #f6bf01;
background-color: #fec503; }
.btn-primary.active, .btn-primary:active,
.open > .btn-primary.dropdown-toggle {
color: white;
border-color: #f6bf01;
background-color: #fec503; }
.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover,
.open > .btn-primary.dropdown-toggle.focus,
.open > .btn-primary.dropdown-toggle:focus,
.open > .btn-primary.dropdown-toggle:hover {
color: white;
border-color: #b48b01;
background-color: #dcab01; }
.btn-primary.active, .btn-primary:active,
.open > .btn-primary.dropdown-toggle {
background-image: none; }
.btn-primary.disabled.focus, .btn-primary.disabled:focus, .btn-primary.disabled:hover, .btn-primary[disabled].focus, .btn-primary[disabled]:focus, .btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary.focus,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary:hover {
border-color: #fed136;
background-color: #fed136; }
.btn-primary .badge {
color: #fed136;
background-color: white; }
.btn-xl {
font-size: 18px;
font-weight: 700;
padding: 20px 40px;
border-radius: 3px;
color: white;
border-color: #fed136;
background-color: #fed136;
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
text-transform: uppercase; }
.btn-xl.focus, .btn-xl:focus {
color: white;
border-color: #b48b01;
background-color: #fec503; }
.btn-xl:hover {
color: white;
border-color: #f6bf01;
background-color: #fec503; }
.btn-xl.active, .btn-xl:active,
.open > .btn-xl.dropdown-toggle {
color: white;
border-color: #f6bf01;
background-color: #fec503; }
.btn-xl.active.focus, .btn-xl.active:focus, .btn-xl.active:hover, .btn-xl:active.focus, .btn-xl:active:focus, .btn-xl:active:hover,
.open > .btn-xl.dropdown-toggle.focus,
.open > .btn-xl.dropdown-toggle:focus,
.open > .btn-xl.dropdown-toggle:hover {
color: white;
border-color: #b48b01;
background-color: #dcab01; }
.btn-xl.active, .btn-xl:active,
.open > .btn-xl.dropdown-toggle {
background-image: none; }
.btn-xl.disabled.focus, .btn-xl.disabled:focus, .btn-xl.disabled:hover, .btn-xl[disabled].focus, .btn-xl[disabled]:focus, .btn-xl[disabled]:hover,
fieldset[disabled] .btn-xl.focus,
fieldset[disabled] .btn-xl:focus,
fieldset[disabled] .btn-xl:hover {
border-color: #fed136;
background-color: #fed136; }
.btn-xl .badge {
color: #fed136;
background-color: white; }

2
css/agency.min.css vendored
View File

File diff suppressed because one or more lines are too long

BIN
img/team/1.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 209 KiB

BIN
img/team/2.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 211 KiB

BIN
img/team/3.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 221 KiB

30
index.html
View File

@ -36,7 +36,7 @@
<i class="fa fa-bars"></i> <i class="fa fa-bars"></i>
</button> </button>
<div class="collapse navbar-collapse" id="navbarResponsive"> <div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto"> <ul class="navbar-nav text-uppercase ml-auto">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#services">Services</a> <a class="nav-link js-scroll-trigger" href="#services">Services</a>
</li> </li>
@ -62,8 +62,8 @@
<div class="container"> <div class="container">
<div class="intro-text"> <div class="intro-text">
<div class="intro-lead-in">Welcome To Our Studio!</div> <div class="intro-lead-in">Welcome To Our Studio!</div>
<div class="intro-heading">It's Nice To Meet You</div> <div class="intro-heading text-uppercase">It's Nice To Meet You</div>
<a class="btn btn-xl js-scroll-trigger" href="#services">Tell Me More</a> <a class="btn btn-primary btn-xl text-uppercase js-scroll-trigger" href="#services">Tell Me More</a>
</div> </div>
</div> </div>
</header> </header>
@ -73,7 +73,7 @@
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-lg-12 text-center"> <div class="col-lg-12 text-center">
<h2 class="section-heading">Services</h2> <h2 class="section-heading text-uppercase">Services</h2>
<h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet consectetur.</h3> <h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet consectetur.</h3>
</div> </div>
</div> </div>
@ -111,7 +111,7 @@
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-lg-12 text-center"> <div class="col-lg-12 text-center">
<h2 class="section-heading">Portfolio</h2> <h2 class="section-heading text-uppercase">Portfolio</h2>
<h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet consectetur.</h3> <h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet consectetur.</h3>
</div> </div>
</div> </div>
@ -209,7 +209,7 @@
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-lg-12 text-center"> <div class="col-lg-12 text-center">
<h2 class="section-heading">About</h2> <h2 class="section-heading text-uppercase">About</h2>
<h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet consectetur.</h3> <h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet consectetur.</h3>
</div> </div>
</div> </div>
@ -290,7 +290,7 @@
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-lg-12 text-center"> <div class="col-lg-12 text-center">
<h2 class="section-heading">Our Amazing Team</h2> <h2 class="section-heading text-uppercase">Our Amazing Team</h2>
<h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet consectetur.</h3> <h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet consectetur.</h3>
</div> </div>
</div> </div>
@ -409,7 +409,7 @@
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-lg-12 text-center"> <div class="col-lg-12 text-center">
<h2 class="section-heading">Contact Us</h2> <h2 class="section-heading text-uppercase">Contact Us</h2>
<h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet consectetur.</h3> <h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet consectetur.</h3>
</div> </div>
</div> </div>
@ -440,7 +440,7 @@
<div class="clearfix"></div> <div class="clearfix"></div>
<div class="col-lg-12 text-center"> <div class="col-lg-12 text-center">
<div id="success"></div> <div id="success"></div>
<button id="sendMessageButton" class="btn btn-xl" type="submit">Send Message</button> <button id="sendMessageButton" class="btn btn-primary btn-xl text-uppercase" type="submit">Send Message</button>
</div> </div>
</div> </div>
</form> </form>
@ -505,7 +505,7 @@
<div class="col-lg-8 mx-auto"> <div class="col-lg-8 mx-auto">
<div class="modal-body"> <div class="modal-body">
<!-- Project Details Go Here --> <!-- Project Details Go Here -->
<h2>Project Name</h2> <h2 class="text-uppercase">Project Name</h2>
<p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p> <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
<img class="img-fluid d-block mx-auto" src="img/portfolio/01-full.jpg" alt=""> <img class="img-fluid d-block mx-auto" src="img/portfolio/01-full.jpg" alt="">
<p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p> <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
@ -539,7 +539,7 @@
<div class="col-lg-8 mx-auto"> <div class="col-lg-8 mx-auto">
<div class="modal-body"> <div class="modal-body">
<!-- Project Details Go Here --> <!-- Project Details Go Here -->
<h2>Project Name</h2> <h2 class="text-uppercase">Project Name</h2>
<p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p> <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
<img class="img-fluid d-block mx-auto" src="img/portfolio/02-full.jpg" alt=""> <img class="img-fluid d-block mx-auto" src="img/portfolio/02-full.jpg" alt="">
<p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p> <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
@ -573,7 +573,7 @@
<div class="col-lg-8 mx-auto"> <div class="col-lg-8 mx-auto">
<div class="modal-body"> <div class="modal-body">
<!-- Project Details Go Here --> <!-- Project Details Go Here -->
<h2>Project Name</h2> <h2 class="text-uppercase">Project Name</h2>
<p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p> <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
<img class="img-fluid d-block mx-auto" src="img/portfolio/03-full.jpg" alt=""> <img class="img-fluid d-block mx-auto" src="img/portfolio/03-full.jpg" alt="">
<p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p> <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
@ -607,7 +607,7 @@
<div class="col-lg-8 mx-auto"> <div class="col-lg-8 mx-auto">
<div class="modal-body"> <div class="modal-body">
<!-- Project Details Go Here --> <!-- Project Details Go Here -->
<h2>Project Name</h2> <h2 class="text-uppercase">Project Name</h2>
<p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p> <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
<img class="img-fluid d-block mx-auto" src="img/portfolio/04-full.jpg" alt=""> <img class="img-fluid d-block mx-auto" src="img/portfolio/04-full.jpg" alt="">
<p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p> <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
@ -641,7 +641,7 @@
<div class="col-lg-8 mx-auto"> <div class="col-lg-8 mx-auto">
<div class="modal-body"> <div class="modal-body">
<!-- Project Details Go Here --> <!-- Project Details Go Here -->
<h2>Project Name</h2> <h2 class="text-uppercase">Project Name</h2>
<p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p> <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
<img class="img-fluid d-block mx-auto" src="img/portfolio/05-full.jpg" alt=""> <img class="img-fluid d-block mx-auto" src="img/portfolio/05-full.jpg" alt="">
<p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p> <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
@ -675,7 +675,7 @@
<div class="col-lg-8 mx-auto"> <div class="col-lg-8 mx-auto">
<div class="modal-body"> <div class="modal-body">
<!-- Project Details Go Here --> <!-- Project Details Go Here -->
<h2>Project Name</h2> <h2 class="text-uppercase">Project Name</h2>
<p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p> <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
<img class="img-fluid d-block mx-auto" src="img/portfolio/06-full.jpg" alt=""> <img class="img-fluid d-block mx-auto" src="img/portfolio/06-full.jpg" alt="">
<p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p> <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>

19
scss/_bootstrap-overrides.scss
View File

@ -1,19 +0,0 @@
// Bootstrap overrides for this template
.text-primary {
color: $theme-primary !important;
}
.btn-primary {
font-weight: 700;
@include button-variant(white, $theme-primary, $theme-primary);
@include heading-font;
}
.btn-xl {
font-size: 18px;
font-weight: 700;
padding: 20px 40px;
border-radius: 3px;
@include button-variant(white, $theme-primary, $theme-primary);
@include heading-font;
}

19
scss/_contact.scss
View File

@ -1,11 +1,11 @@
// Styling for the contact section // Styling for the contact section
section#contact { section#contact {
background-color: $gray-darker; background-color: $gray-900;
background-image: url('../img/map-image.png'); background-image: url('../img/map-image.png');
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
.section-heading { .section-heading {
color: white; color: $white;
} }
.form-group { .form-group {
margin-bottom: 25px; margin-bottom: 25px;
@ -17,36 +17,33 @@ section#contact {
height: auto; height: auto;
} }
textarea.form-control { textarea.form-control {
height: 236px; height: 248px;
} }
} }
.form-control:focus { .form-control:focus {
border-color: $theme-primary; border-color: $primary;
box-shadow: none; box-shadow: none;
} }
::-webkit-input-placeholder { ::-webkit-input-placeholder {
font-weight: 700; font-weight: 700;
color: $gray-lighter; color: $gray-400;
@include heading-font; @include heading-font;
} }
:-moz-placeholder { :-moz-placeholder {
font-weight: 700; font-weight: 700;
color: $gray-lighter; color: $gray-400;
/* Firefox 18- */ /* Firefox 18- */
@include heading-font; @include heading-font;
} }
::-moz-placeholder { ::-moz-placeholder {
font-weight: 700; font-weight: 700;
color: $gray-lighter; color: $gray-400;
/* Firefox 19+ */ /* Firefox 19+ */
@include heading-font; @include heading-font;
} }
:-ms-input-placeholder { :-ms-input-placeholder {
font-weight: 700; font-weight: 700;
color: $gray-lighter; color: $gray-400;
@include heading-font; @include heading-font;
} }
.text-danger {
color: $theme-danger;
}
} }

4
scss/_footer.scss
View File

@ -32,11 +32,11 @@ ul.social-buttons {
color: white; color: white;
border-radius: 100%; border-radius: 100%;
outline: none; outline: none;
background-color: $gray-darker; background-color: $gray-900;
&:active, &:active,
&:focus, &:focus,
&:hover { &:hover {
background-color: $theme-primary; background-color: $primary;
} }
} }
} }

29
scss/_global.scss
View File

@ -9,15 +9,19 @@ p {
} }
a { a {
color: $theme-primary; color: $primary;
&.active, &.active,
&:active, &:active,
&:focus, &:focus,
&:hover { &:hover {
color: darken($theme-primary, 10%); color: darken($primary, 10%);
} }
} }
.text-primary {
color: $primary !important;
}
h1, h1,
h2, h2,
h3, h3,
@ -50,14 +54,29 @@ section {
} }
} }
// Button Styles
.btn {
@include heading-font;
font-weight: 700;
}
.btn-primary {
@include button-variant(white, $primary, $primary);
}
.btn-xl {
font-size: 18px;
padding: 20px 40px;
}
// Highlight color customization // Highlight color customization
::-moz-selection { ::-moz-selection {
background: $theme-primary; background: $primary;
text-shadow: none; text-shadow: none;
} }
::selection { ::selection {
background: $theme-primary; background: $primary;
text-shadow: none; text-shadow: none;
} }
@ -70,5 +89,5 @@ img::-moz-selection {
} }
body { body {
-webkit-tap-highlight-color: $theme-primary; -webkit-tap-highlight-color: $primary;
} }

1
scss/_mixins.scss
View File

@ -70,5 +70,4 @@
} }
@mixin heading-font { @mixin heading-font {
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
text-transform: uppercase;
} }

12
scss/_navbar.scss
View File

@ -1,6 +1,6 @@
// Styling for the navbar // Styling for the navbar
#mainNav { #mainNav {
background-color: $gray-darker; background-color: $gray-900;
.navbar-toggler { .navbar-toggler {
font-size: 12px; font-size: 12px;
right: 0; right: 0;
@ -8,17 +8,17 @@
text-transform: uppercase; text-transform: uppercase;
color: white; color: white;
border: 0; border: 0;
background-color: $theme-primary; background-color: $primary;
@include heading-font; @include heading-font;
} }
.navbar-brand { .navbar-brand {
color: $theme-primary; color: $primary;
@include script-font; @include script-font;
&.active, &.active,
&:active, &:active,
&:focus, &:focus,
&:hover { &:hover {
color: darken($theme-primary, 10%); color: darken($primary, 10%);
} }
} }
.navbar-nav { .navbar-nav {
@ -32,7 +32,7 @@
@include heading-font; @include heading-font;
&.active, &.active,
&:hover { &:hover {
color: $theme-primary; color: $primary;
} }
} }
} }
@ -63,7 +63,7 @@
&.navbar-shrink { &.navbar-shrink {
padding-top: 0; padding-top: 0;
padding-bottom: 0; padding-bottom: 0;
background-color: $gray-darker; background-color: $gray-900;
.navbar-brand { .navbar-brand {
font-size: 1.25em; font-size: 1.25em;
padding: 12px 0; padding: 12px 0;

8
scss/_portfolio.scss
View File

@ -17,7 +17,7 @@
-moz-transition: all ease 0.5s; -moz-transition: all ease 0.5s;
transition: all ease 0.5s; transition: all ease 0.5s;
opacity: 0; opacity: 0;
background: fade-out($theme-primary, .1); background: fade-out($primary, .1);
&:hover { &:hover {
opacity: 1; opacity: 1;
} }
@ -45,7 +45,7 @@
margin: 0 auto; margin: 0 auto;
padding: 25px; padding: 25px;
text-align: center; text-align: center;
background-color: white; background-color: $white;
h4 { h4 {
margin: 0; margin: 0;
text-transform: none; text-transform: none;
@ -130,7 +130,7 @@
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg); -ms-transform: rotate(45deg);
transform: rotate(45deg); transform: rotate(45deg);
background-color: $gray-darker; background-color: $gray-900;
.rl { .rl {
/* Safari and Chrome */ /* Safari and Chrome */
z-index: 1052; z-index: 1052;
@ -140,7 +140,7 @@
-webkit-transform: rotate(90deg); -webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg); -ms-transform: rotate(90deg);
transform: rotate(90deg); transform: rotate(90deg);
background-color: $gray-darker; background-color: $gray-900;
} }
} }
} }

2
scss/_team.scss
View File

@ -5,7 +5,7 @@
img { img {
width: 225px; width: 225px;
height: 225px; height: 225px;
border: 7px solid white; border: 7px solid $white;
} }
h4 { h4 {
margin-top: 25px; margin-top: 25px;

6
scss/_timeline.scss
View File

@ -11,7 +11,7 @@
width: 2px; width: 2px;
margin-left: -1.5px; margin-left: -1.5px;
content: ''; content: '';
background-color: #f1f1f1; background-color: $gray-200;
} }
> li { > li {
position: relative; position: relative;
@ -53,9 +53,9 @@
margin-left: 0; margin-left: 0;
text-align: center; text-align: center;
color: white; color: white;
border: 7px solid #f1f1f1; border: 7px solid $gray-200;
border-radius: 100%; border-radius: 100%;
background-color: $theme-primary; background-color: $primary;
h4 { h4 {
font-size: 10px; font-size: 10px;
line-height: 14px; line-height: 14px;

40
scss/_variables.scss
View File

@ -1,13 +1,35 @@
// Variables // Variables
// Gray and Brand Colors for use across theme // Restated Bootstrap Variables
$theme-primary: #fed136; $white: #fff !default;
$theme-danger: #e74c3c; $gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
$gray-300: #dee2e6 !default;
$gray-400: #ced4da !default;
$gray-500: #adb5bd !default;
$gray-600: #868e96 !default;
$gray-700: #495057 !default;
$gray-800: #343a40 !default;
$gray-900: #212529 !default;
$black: #000 !default;
$gray-base: #000 !default; $blue: #007bff !default;
$gray-darker: lighten($gray-base, 13.5%) !default; $indigo: #6610f2 !default;
$gray-dark: lighten($gray-base, 20%) !default; $purple: #6f42c1 !default;
$gray: lighten($gray-base, 33.5%) !default; $pink: #e83e8c !default;
$gray-light: lighten($gray-base, 46.7%) !default; $red: #dc3545 !default;
$gray-lighter: lighten($gray-base, 93.5%) !default; $orange: #fd7e14 !default;
$yellow: #fed136 !default;
$green: #28a745 !default;
$teal: #20c997 !default;
$cyan: #17a2b8 !default;
$primary: $yellow !default;
$secondary: $gray-600 !default;
$success: $green !default;
$info: $cyan !default;
$warning: $yellow !default;
$danger: $red !default;
$light: $gray-100 !default;
$dark: $gray-800 !default;

2
scss/agency.scss
View File

@ -12,5 +12,3 @@
@import "team.scss"; @import "team.scss";
@import "contact.scss"; @import "contact.scss";
@import "footer.scss"; @import "footer.scss";
// Bootstrap Overrides
@import "bootstrap-overrides.scss";