28 changed files with 1002 additions and 972 deletions
@ -0,0 +1,13 @@
@@ -0,0 +1,13 @@
|
||||
# Editor configuration, see https://editorconfig.org |
||||
root = true |
||||
|
||||
[*] |
||||
charset = utf-8 |
||||
indent_style = space |
||||
indent_size = 4 |
||||
insert_final_newline = true |
||||
trim_trailing_whitespace = true |
||||
|
||||
[*.md] |
||||
max_line_length = off |
||||
trim_trailing_whitespace = false |
||||
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 14 KiB |
@ -0,0 +1,49 @@
@@ -0,0 +1,49 @@
|
||||
// Global styling for this template |
||||
body { |
||||
overflow-x: hidden; |
||||
} |
||||
|
||||
p { |
||||
line-height: 1.75; |
||||
} |
||||
|
||||
.page-section { |
||||
padding: 100px 0; |
||||
h2.section-heading { |
||||
font-size: 40px; |
||||
margin-top: 0; |
||||
margin-bottom: 15px; |
||||
} |
||||
h3.section-subheading { |
||||
font-size: 16px; |
||||
font-weight: 400; |
||||
font-style: italic; |
||||
margin-bottom: 75px; |
||||
text-transform: none; |
||||
font-family: $subheadings-font-family; |
||||
} |
||||
} |
||||
@media (min-width: 768px) { |
||||
section { |
||||
padding: 150px 0; |
||||
} |
||||
} |
||||
|
||||
// Highlight color customization |
||||
::-moz-selection { |
||||
background: $primary; |
||||
text-shadow: none; |
||||
} |
||||
|
||||
::selection { |
||||
background: $primary; |
||||
text-shadow: none; |
||||
} |
||||
|
||||
img::selection { |
||||
background: transparent; |
||||
} |
||||
|
||||
img::-moz-selection { |
||||
background: transparent; |
||||
} |
||||
@ -0,0 +1,4 @@
@@ -0,0 +1,4 @@
|
||||
@import "./variables/colors.scss"; |
||||
@import "./variables/typography.scss"; |
||||
@import "./variables/spacing.scss"; |
||||
@import "./variables/grid.scss"; |
||||
@ -1,13 +0,0 @@
@@ -1,13 +0,0 @@
|
||||
// Font Mixins |
||||
@mixin serif-font { |
||||
font-family: 'Droid Serif', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; |
||||
} |
||||
@mixin script-font { |
||||
font-family: 'Kaushan Script', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; |
||||
} |
||||
@mixin body-font { |
||||
font-family: 'Roboto Slab', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; |
||||
} |
||||
@mixin heading-font { |
||||
font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; |
||||
} |
||||
@ -1,71 +0,0 @@
@@ -1,71 +0,0 @@
|
||||
// Global styling for this template |
||||
body { |
||||
overflow-x: hidden; |
||||
@include body-font; |
||||
} |
||||
|
||||
p { |
||||
line-height: 1.75; |
||||
} |
||||
|
||||
a { |
||||
color: $primary; |
||||
&:hover { |
||||
color: darken($primary, 10%); |
||||
} |
||||
} |
||||
|
||||
.text-primary { |
||||
color: $primary !important; |
||||
} |
||||
|
||||
h1, |
||||
h2, |
||||
h3, |
||||
h4, |
||||
h5, |
||||
h6 { |
||||
font-weight: 700; |
||||
@include heading-font; |
||||
} |
||||
|
||||
.page-section { |
||||
padding: 100px 0; |
||||
h2.section-heading { |
||||
font-size: 40px; |
||||
margin-top: 0; |
||||
margin-bottom: 15px; |
||||
} |
||||
h3.section-subheading { |
||||
font-size: 16px; |
||||
font-weight: 400; |
||||
font-style: italic; |
||||
margin-bottom: 75px; |
||||
text-transform: none; |
||||
@include serif-font; |
||||
} |
||||
} |
||||
@media(min-width:768px) { |
||||
section { |
||||
padding: 150px 0; |
||||
} |
||||
} |
||||
|
||||
// Highlight color customization |
||||
::-moz-selection { |
||||
background: $primary; |
||||
text-shadow: none; |
||||
} |
||||
|
||||
::selection { |
||||
background: $primary; |
||||
text-shadow: none; |
||||
} |
||||
|
||||
img::selection { |
||||
background: transparent; |
||||
} |
||||
|
||||
img::-moz-selection { |
||||
background: transparent; |
||||
} |
||||
@ -1,17 +0,0 @@
@@ -1,17 +0,0 @@
|
||||
// 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; |
||||
|
||||
$primary: #fed136 !default; |
||||
@ -1,8 +1,8 @@
@@ -1,8 +1,8 @@
|
||||
// Button Styles |
||||
|
||||
.btn-xl { |
||||
@include heading-font; |
||||
font-weight: 700; |
||||
font-size: 1.125rem; |
||||
padding: 1.25rem 2.5rem; |
||||
font-family: $headings-font-family; |
||||
font-size: 1.125rem; |
||||
font-weight: $headings-font-weight; |
||||
} |
||||
@ -1,47 +1,56 @@
@@ -1,47 +1,56 @@
|
||||
// Styling for the contact section |
||||
section#contact { |
||||
background-color: $gray-900; |
||||
background-image: url('../assets/img/map-image.png'); |
||||
background-image: url("../assets/img/map-image.png"); |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
.section-heading { |
||||
color: $white; |
||||
} |
||||
form#contactForm { |
||||
.form-group { |
||||
margin-bottom: 25px; |
||||
margin-bottom: $grid-gutter-width; |
||||
input, |
||||
textarea { |
||||
padding: 20px; |
||||
padding: 1.25rem; |
||||
} |
||||
input.form-control { |
||||
height: auto; |
||||
} |
||||
textarea.form-control { |
||||
height: 248px; |
||||
} |
||||
.form-group-textarea { |
||||
height: 100%; |
||||
textarea { |
||||
height: 100%; |
||||
min-height: 10rem; |
||||
} |
||||
} |
||||
p.help-block { |
||||
margin: 0; |
||||
} |
||||
.form-control:focus { |
||||
border-color: $primary; |
||||
box-shadow: none; |
||||
} |
||||
::-webkit-input-placeholder { |
||||
font-weight: 700; |
||||
font-family: $headings-font-family; |
||||
font-weight: $headings-font-weight; |
||||
color: $gray-400; |
||||
@include heading-font; |
||||
} |
||||
:-moz-placeholder { |
||||
font-weight: 700; |
||||
font-family: $headings-font-family; |
||||
font-weight: $headings-font-weight; |
||||
color: $gray-400; |
||||
@include heading-font; |
||||
} |
||||
::-moz-placeholder { |
||||
font-weight: 700; |
||||
font-family: $headings-font-family; |
||||
font-weight: $headings-font-weight; |
||||
color: $gray-400; |
||||
@include heading-font; |
||||
} |
||||
:-ms-input-placeholder { |
||||
font-weight: 700; |
||||
font-family: $headings-font-family; |
||||
font-weight: $headings-font-weight; |
||||
color: $gray-400; |
||||
@include heading-font; |
||||
} |
||||
} |
||||
} |
||||
|
||||
@ -1,22 +1,21 @@
@@ -1,22 +1,21 @@
|
||||
// Core variables and mixins |
||||
@import "base/variables.scss"; |
||||
@import "base/mixins.scss"; |
||||
// Import variables |
||||
@import "./variables.scss"; |
||||
|
||||
// Import Bootstrap |
||||
@import "bootstrap/scss/bootstrap.scss"; |
||||
|
||||
// Global CSS |
||||
@import "base/page.scss"; |
||||
@import "./global.scss"; |
||||
|
||||
// Components |
||||
@import "components/buttons.scss"; |
||||
@import "components/navbar.scss"; |
||||
@import "./components/buttons.scss"; |
||||
@import "./components/navbar.scss"; |
||||
|
||||
// Layout |
||||
@import "layout/masthead.scss"; |
||||
@import "layout/services.scss"; |
||||
@import "layout/portfolio.scss"; |
||||
@import "layout/timeline.scss"; |
||||
@import "layout/team.scss"; |
||||
@import "layout/contact.scss"; |
||||
@import "layout/footer.scss"; |
||||
@import "./layout/masthead.scss"; |
||||
@import "./layout/services.scss"; |
||||
@import "./layout/portfolio.scss"; |
||||
@import "./layout/timeline.scss"; |
||||
@import "./layout/team.scss"; |
||||
@import "./layout/contact.scss"; |
||||
@import "./layout/footer.scss"; |
||||
|
||||
@ -0,0 +1,11 @@
@@ -0,0 +1,11 @@
|
||||
// Override Bootstrap color system |
||||
|
||||
$yellow: #fed136; |
||||
|
||||
// Override Bootstrap default state colors |
||||
|
||||
$primary: $yellow; |
||||
|
||||
// Override Bootstrap yiq lightness value |
||||
|
||||
$yiq-contrasted-threshold: 205; |
||||
@ -0,0 +1,5 @@
@@ -0,0 +1,5 @@
|
||||
// Override Bootstrap grid column variables |
||||
// |
||||
// Override the spacing between columns to add symmetry to the layout |
||||
|
||||
$grid-gutter-width: $spacer * 1.5; |
||||
@ -0,0 +1,7 @@
@@ -0,0 +1,7 @@
|
||||
// Restate and add to the Bootstrap default spacing variables |
||||
// |
||||
// The spacer is restated in order to add new entries to the $spacers map |
||||
// The 10 and n1 through n10 spacers are newly added allowing for larger |
||||
// spacing options and negative padding and margin utilities |
||||
|
||||
$spacer: 1rem; |
||||
@ -0,0 +1,20 @@
@@ -0,0 +1,20 @@
|
||||
// Override Bootstrap typography variables |
||||
|
||||
$font-family-base: "Roboto Slab", -apple-system, BlinkMacSystemFont, "Segoe UI", |
||||
Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", |
||||
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; |
||||
|
||||
$headings-font-family: "Montserrat", -apple-system, BlinkMacSystemFont, |
||||
"Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", |
||||
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; |
||||
|
||||
$subheadings-font-family: "Droid Serif", -apple-system, BlinkMacSystemFont, |
||||
"Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", |
||||
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; |
||||
|
||||
$font-family-script: "Kaushan Script", -apple-system, BlinkMacSystemFont, |
||||
"Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", |
||||
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; |
||||
|
||||
$headings-font-weight: 700; |
||||
$headings-letter-spacing: 0.0625em; |
||||
Loading…
Reference in new issue