Commit 54926c35 by Yolanda Nainggolan

scss

parent f007290e
.call-to-action {
position: relative;
background-color: $gray-800;
background: url('../img/bg-masthead.jpg') no-repeat center center;
@include background-cover;
padding-top: 7rem;
padding-bottom: 7rem;
.overlay {
position: absolute;
background-color: $gray-900;
height: 100%;
width: 100%;
top: 0;
left: 0;
opacity: 0.3;
}
}
footer.footer {
padding-top: 4rem;
padding-bottom: 4rem;
}
body {
@include body-font;
}
h1,
h2,
h3,
h4,
h5,
h6 {
@include body-font;
font-weight: 700;
}
.features-icons {
padding-top: 7rem;
padding-bottom: 7rem;
.features-icons-item {
max-width: 20rem;
.features-icons-icon {
height: 7rem;
i {
font-size: 4.5rem;
}
}
&:hover {
.features-icons-icon {
i {
font-size: 5rem;
}
}
}
}
}
header.masthead {
position: relative;
background-color: $gray-800;
background: url('../img/bg-masthead.jpg') no-repeat center center;
@include background-cover;
padding-top: 8rem;
padding-bottom: 8rem;
.overlay {
position: absolute;
background-color: $gray-900;
height: 100%;
width: 100%;
top: 0;
left: 0;
opacity: 0.3;
}
h1 {
font-size: 2rem;
}
@media (min-width: 768px) {
padding-top: 12rem;
padding-bottom: 12rem;
h1 {
font-size: 3rem;
}
}
}
// Mixins
// Background Cover Mixin
@mixin background-cover {
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
// Font Mixins
@mixin body-font {
font-family: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
.showcase {
.showcase-text {
padding: 3rem;
}
.showcase-img {
min-height: 30rem;
background-size: cover;
}
@media (min-width: 768px) {
.showcase-text {
padding: 7rem;
}
}
}
.testimonials {
padding-top: 7rem;
padding-bottom: 7rem;
.testimonial-item {
max-width: 18rem;
img {
max-width: 12rem;
box-shadow: 0px 5px 5px 0px $gray-500;
}
}
}
// Variables
// Restated Bootstrap Variables
$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;
$blue: #007bff !default;
$indigo: #6610f2 !default;
$purple: #6f42c1 !default;
$pink: #e83e8c !default;
$red: #dc3545 !default;
$orange: #fd7e14 !default;
$yellow: #ffc107 !default;
$green: #28a745 !default;
$teal: #20c997 !default;
$cyan: #17a2b8 !default;
$primary: $blue !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;
// Core variables and mixins
@import "variables.scss";
@import "mixins.scss";
// Global CSS
@import "global.scss";
// Components
@import "masthead.scss";
@import "showcase.scss";
@import "icons.scss";
@import "testimonials.scss";
@import "call-to-action.scss";
@import "footer.scss";
Markdown is supported
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