Browse Source

SCSS update - changed some variables and removed some redundant classes

master
David Miller 8 years ago
parent
commit
35edb7f9e9
  1. 201
      css/agency.css
  2. 2
      css/agency.min.css
  3. BIN
      img/team/1.jpg
  4. BIN
      img/team/2.jpg
  5. BIN
      img/team/3.jpg
  6. 30
      index.html
  7. 19
      scss/_bootstrap-overrides.scss
  8. 19
      scss/_contact.scss
  9. 4
      scss/_footer.scss
  10. 29
      scss/_global.scss
  11. 1
      scss/_mixins.scss
  12. 12
      scss/_navbar.scss
  13. 8
      scss/_portfolio.scss
  14. 2
      scss/_team.scss
  15. 6
      scss/_timeline.scss
  16. 40
      scss/_variables.scss
  17. 2
      scss/agency.scss

201
css/agency.css

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

File diff suppressed because one or more lines are too long

BIN
img/team/1.jpg

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 209 KiB

BIN
img/team/2.jpg

Binary file not shown.

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 211 KiB

BIN
img/team/3.jpg

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 221 KiB

30
index.html

@ -36,7 +36,7 @@ @@ -36,7 +36,7 @@
<i class="fa fa-bars"></i>
</button>
<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">
<a class="nav-link js-scroll-trigger" href="#services">Services</a>
</li>
@ -62,8 +62,8 @@ @@ -62,8 +62,8 @@
<div class="container">
<div class="intro-text">
<div class="intro-lead-in">Welcome To Our Studio!</div>
<div class="intro-heading">It's Nice To Meet You</div>
<a class="btn btn-xl js-scroll-trigger" href="#services">Tell Me More</a>
<div class="intro-heading text-uppercase">It's Nice To Meet You</div>
<a class="btn btn-primary btn-xl text-uppercase js-scroll-trigger" href="#services">Tell Me More</a>
</div>
</div>
</header>
@ -73,7 +73,7 @@ @@ -73,7 +73,7 @@
<div class="container">
<div class="row">
<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>
</div>
</div>
@ -111,7 +111,7 @@ @@ -111,7 +111,7 @@
<div class="container">
<div class="row">
<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>
</div>
</div>
@ -209,7 +209,7 @@ @@ -209,7 +209,7 @@
<div class="container">
<div class="row">
<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>
</div>
</div>
@ -290,7 +290,7 @@ @@ -290,7 +290,7 @@
<div class="container">
<div class="row">
<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>
</div>
</div>
@ -409,7 +409,7 @@ @@ -409,7 +409,7 @@
<div class="container">
<div class="row">
<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>
</div>
</div>
@ -440,7 +440,7 @@ @@ -440,7 +440,7 @@
<div class="clearfix"></div>
<div class="col-lg-12 text-center">
<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>
</form>
@ -505,7 +505,7 @@ @@ -505,7 +505,7 @@
<div class="col-lg-8 mx-auto">
<div class="modal-body">
<!-- 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>
<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>
@ -539,7 +539,7 @@ @@ -539,7 +539,7 @@
<div class="col-lg-8 mx-auto">
<div class="modal-body">
<!-- 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>
<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>
@ -573,7 +573,7 @@ @@ -573,7 +573,7 @@
<div class="col-lg-8 mx-auto">
<div class="modal-body">
<!-- 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>
<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>
@ -607,7 +607,7 @@ @@ -607,7 +607,7 @@
<div class="col-lg-8 mx-auto">
<div class="modal-body">
<!-- 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>
<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>
@ -641,7 +641,7 @@ @@ -641,7 +641,7 @@
<div class="col-lg-8 mx-auto">
<div class="modal-body">
<!-- 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>
<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>
@ -675,7 +675,7 @@ @@ -675,7 +675,7 @@
<div class="col-lg-8 mx-auto">
<div class="modal-body">
<!-- 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>
<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>

19
scss/_bootstrap-overrides.scss vendored

@ -1,19 +0,0 @@ @@ -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

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

4
scss/_footer.scss

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

29
scss/_global.scss

@ -9,15 +9,19 @@ p { @@ -9,15 +9,19 @@ p {
}
a {
color: $theme-primary;
color: $primary;
&.active,
&:active,
&:focus,
&:hover {
color: darken($theme-primary, 10%);
color: darken($primary, 10%);
}
}
.text-primary {
color: $primary !important;
}
h1,
h2,
h3,
@ -50,14 +54,29 @@ section { @@ -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
::-moz-selection {
background: $theme-primary;
background: $primary;
text-shadow: none;
}
::selection {
background: $theme-primary;
background: $primary;
text-shadow: none;
}
@ -70,5 +89,5 @@ img::-moz-selection { @@ -70,5 +89,5 @@ img::-moz-selection {
}
body {
-webkit-tap-highlight-color: $theme-primary;
-webkit-tap-highlight-color: $primary;
}

1
scss/_mixins.scss

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

12
scss/_navbar.scss

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

8
scss/_portfolio.scss

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

2
scss/_team.scss

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

6
scss/_timeline.scss

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

40
scss/_variables.scss

@ -1,13 +1,35 @@ @@ -1,13 +1,35 @@
// Variables
// Gray and Brand Colors for use across theme
// Restated Bootstrap Variables
$theme-primary: #fed136;
$theme-danger: #e74c3c;
$white: #fff !default;
$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;
$gray-darker: lighten($gray-base, 13.5%) !default;
$gray-dark: lighten($gray-base, 20%) !default;
$gray: lighten($gray-base, 33.5%) !default;
$gray-light: lighten($gray-base, 46.7%) !default;
$gray-lighter: lighten($gray-base, 93.5%) !default;
$blue: #007bff !default;
$indigo: #6610f2 !default;
$purple: #6f42c1 !default;
$pink: #e83e8c !default;
$red: #dc3545 !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

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

Loading…
Cancel
Save