diff --git a/assets/css/base.css b/assets/css/base.css
new file mode 100644
index 0000000..9f33c20
--- /dev/null
+++ b/assets/css/base.css
@@ -0,0 +1,150 @@
+ /* resets */
+*,
+*:before,
+*:after {
+box-sizing: border-box;
+margin: 0;
+padding: 0;
+border: 0;
+}
+
+
+/* regions */
+
+body{
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ font-family: 'Roboto', sans-serif;
+ font-size: 1.4rem; /* 14px default before jquery scalling */
+ color: black;
+ background-color: white;
+}
+
+
+.section {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+/* mobile first column */
+.section__container {
+ width:95%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+
+
+ /* Typography */
+
+ body {
+ font-size: 12px;
+ }
+
+h1, h2, h3, h4, h5, h6 {
+ /* display: block; */
+ font-weight: bold;
+ line-height: 1.45;
+ text-align: center;
+}
+
+h1 {font-size: 2em;}
+h2 {font-size: 1.5em;}
+h3 {font-size: 1.17em;}
+h4 {font-size: 1em;}
+h5 {font-size: .83em;}
+h6 {font-size: .67em;}
+
+p {font-size: 1em;
+ text-align: left;
+ line-height: 1.2;
+}
+
+li { font-size: 1em}
+
+/* elements */
+
+ul, nav {
+ list-style: none;
+}
+
+
+a {
+ text-decoration: none;
+ color: inherit;
+ cursor: pointer;
+ opacity: 0.9;
+}
+
+a:hover {
+ opacity: 1;
+}
+
+
+.btn>a {
+ color: white;
+ background-color: darkslategrey;
+ text-transform: uppercase;
+ padding: .5em;
+ border-radius: 5px;
+ border: 3px solid #566963;
+ cursor: pointer;
+ font-weight: bold;
+ text-shadow: 0 1px 0 grey;
+}
+
+img {
+ max-width: 100%;
+}
+
+figure {
+ display: block;
+ padding: 1em;
+}
+
+figcaption {
+ display: block;
+ text-align: center;
+ margin: 1em 0;
+ font-style: italic;
+ orphans: 2;
+}
+
+/* html5 video tag, override any iframe width */
+/*video, iframe {
+ width: 100%!important;
+ height: auto!important;/
+}*/
+
+hr {
+ margin: 4px auto 4px auto;
+ height: 0;
+ width: 50%;
+ border-style: solid;
+ border-width: 2px;
+ border-top-color: white;
+ border-bottom-color: rgba(0, 0, 0, 0.2);
+}
+
+.flex-col-center {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+.flex-col-left {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+}
+
+.flex-row {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ justify-content: flex-start;
+ align-content: center;
+}
diff --git a/assets/css/navbar.css b/assets/css/navbar.css
index f5712a5..47977f5 100644
--- a/assets/css/navbar.css
+++ b/assets/css/navbar.css
@@ -1,121 +1,91 @@
-#nav-container > nav > ul {
- list-style-type: none;
-}
+/* NAVIGATION BAR */
-/* NAVIGATION */
-#nav-background {
- position: fixed;
- top: 0;
- z-index: 1000;
- width: 100%;
- background-color: white;
- border-bottom: 1px solid #ddd;
- /*
- box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
- */
-}
-
-#nav-container {
- display: flex;
- max-width: 1200px;
- margin: 0 auto;
- justify-content: space-between;
- font-family: Arial, Helvetica, sans-serif;
-}
-
-#nav-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
-}
-
-#nav-logo {
- font-size: 1em;
- font-weight: bold;
-}
-#nav-logo:hover {
- /*color: #666;*/
-}
-
-.nav-ul {
- display: flex;
- max-width: 700px;
-}
-
-.nav-ul > li {
- display: flex;
-}
-
-.nav-link {
- flex: 1;
- color: black;
- text-decoration: none;
- font-weight: 600;
- font-size: 1.2rem;
- transition: 200ms;
-}
-
-.nav-link:hover {
- background-color: #f1f1f1;
-}
-
-.active-link {
- background-color: #f1f1f1;
-}
-
-/* END NAVIGATION */
-
-
-/* MOBILE MENU */
-@media screen and (max-width: 899px) {
-
- #nav-container {
+.nav-bar {
+ display: flex;
flex-direction: column;
- text-align: center;
- }
+ align-items: flex-start;
+ justify-content: flex-start;
+ position: fixed;
+ top: 0;
+ left: 0;
+ z-index: 1000;
+ width: 100%;
+ background-color: white;
+ border-bottom: 1px solid #ddd;
+}
- #nav-menu-button {
- padding: 1rem;
- background-color: #f1f1f1;
+.nav-bar__header {
+ display: flex;
+ flex-direction: row;
+ justify-content: flex-start;
+ align-content: center;
+ font-weight: bold;
+}
+
+.nav-bar__header a {
+ font-size: 1.5em;
+ padding: 1em 1em;
+ font-weight: bold;
+}
+
+.nav-bar__logo {
+ order: 2;
+ padding-right: 1em;
+}
+
+.nav-bar__menu-button {
+ font-size: 1.5em;
+ padding: .8em 1em;
cursor: pointer;
- }
+ order: 1;
+}
- .nav-ul {
- display: block;
+.nav-bar__menu {
+ display: flex;
flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ flex-basis: 100%;
overflow-y: scroll;
- direction: rtl;
- max-height: 80vh;
- }
+ /*max-height: 80vh;*/
+}
- .hide-ul {
- max-height: 0vh;
- }
+.display-menu {
+ height: auto;
+}
- .nav-link {
- padding: 1rem 0;
- font-size: 1.3rem;
+.nav-bar__link {
+ padding: 1em;
+ flex-grow: 1;
+ font-size: 1em;
border-bottom: 1px solid #f4f4f4;
- }
-}
-/* END MOBILE MENU */
-
-/* DESKTOP MENU */
-@media screen and (min-width: 900px) {
-
- #nav-menu-button {
- display: none;
- }
-
- .nav-link {
- padding: 1rem 1.5rem;
- }
+ font-weight: 600;
+ transition: 200ms;
}
-/* This moves the logo so that it's not touching the left side */
-@media screen and (max-width: 1040px) {
- #nav-logo {
- margin-left: 1rem;
- }
+@media only screen and (min-width: 801px) {
+ .nav-bar {
+ flex-direction: row;
+ align-content: center;
+ justify-content: space-between;
+ }
+ .nav-bar__logo {
+ margin-left: 1em;
+ }
+ .nav-bar__link, .nav-bar__header a {
+ font-size: 2em;
+ padding: 1em .5em;
+ }
+ .nav-bar__menu-button {
+ display: none;
+ }
+ .nav-bar_menu {
+ flex-direction: row;
+ align-content: center;
+ justify-content: flex-end;
+ }
}
-/* END DESKTOP MENU */
+
+/* Desktop */
+
+@media screen and (min-width: 1200px) {}
diff --git a/assets/css/page.css b/assets/css/page.css
index fc32e88..3c9dd6f 100644
--- a/assets/css/page.css
+++ b/assets/css/page.css
@@ -1,397 +1,106 @@
-/*-------------
- General
--------------*/
+/* sections */
-*{
- margin: 0;
- padding: 0;
- box-sizing: border-box;
+.section__container {
}
-html{
- font-family: 'Roboto', sans-serif;
- font-size: 1em;
- color: black;
+.section-headline {
+ text-align: center;
}
-ul, nav{
- list-style: none;
+.section__content {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
}
-ul.grid{
- width: 100%;
- display: flex;
- flex-wrap: wrap;
- justify-content: center;
+.section--even {
+ color: white;
+ background-color: silver;
}
-a{
- text-decoration: none;
- color: inherit;
- cursor: pointer;
- opacity: 0.7;
+.section--footer {
+ color: white;
+ background-color: darkslategrey;
}
-a:hover{
- opacity: 1;
-}
-
-a.btn{
- color: #fff;
- border-radius: 4px;
- text-transform: uppercase;
- background-color: #2196F3;
- font-weight: 800;
- text-align: center;
-}
-
-hr {
- margin: 4px auto 4px auto;
- height:0px;
- width:50%;
- border-style: solid;
- border-width : 2px;
- border-top-color: white;
- border-bottom-color: rgba(0,0,0,0.2);
-}
-
-/*----------------
- Common Section Styling
-----------------*/
-
-section{
- display: flex;
- flex-direction: column;
- align-items: center;
- padding: 20px 50px;
-}
-
-.section-even {
- color: white;
- background-color: silver;
-}
-
-section h1{
- font-size: 1.25em;
-}
-
-section p{
-}
-
-@media (min-width: 600px){
-
- section{
- padding: 60px 60px;
- }
-
- section h1{
- font-size: 2em;
- }
-
-}
-
-@media (min-width: 1000px){
-
- section{
- padding: 80px 125px;
- }
-
- section h1{
- font-size: 2.5em;
- }
-
-}
-
-
-
/*----------------
Hero Section
----------------*/
-#hero{
- background-image: url("../images/hero.jpg");
- background-size:cover;
- background-position: center;
- display: flex;
- align-items: center;
- justify-content: center;
+
+#hero {
+ background-image: url("../images/hero.jpg");
+ background-size: cover;
+ background-position: center;
+ display: flex;
+ align-items: center;
+ justify-content: center;
}
#hero .text {
- text-align:center;
- width:auto;
- color:white;
- font-weight: bold;
- font-size: 1em;
-}
-
-/* #hero h1, #hero h2, #hero h3, #hero h4, #hero p { color:white; }*/
-
-#hero h1{
- font-size: 5em;
-}
-
-#hero h2{
- font-size: 3em;
-}
-
-#hero h3{
- font-size: 2em;
-}
-
-#hero a.btn{
- padding: 20px 46px;
-}
-
-@media (max-width: 800px){
-
- #hero h1{
- font-size: 48px;
- }
-
- #hero h3{
- font-size: 24px;
- }
-
- #hero a.btn{
- padding: 15px 40px;
- }
-
+ text-align: center;
+ color: white;
}
-/*--------------------
- Our Work Section
----------------------*/
+/*----------------
+ Components/Shortcodes Styling
+----------------*/
-.оur-work{
- background-color: #fff;
+/* box creates a flexbox wrapper*/
+
+.box {
+ display: flex;
+ flex-direction: row;
+ flex-wrap:wrap;
+ align-content: center;
+ justify-content: center;
}
-.our-work .grid li{
- padding: 20px;
- height: 350px;
- border-radius: 3px;
+.box--headline {}
- background-clip: content-box;
- background-size: cover;
- background-position: center;
- background-color: #333;
+.box--text {}
+
+.box--btn {
+ padding: 1rem;
}
-.our-work .grid li.small{
- flex-basis: 40%;
+.box__embed {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
}
-.our-work .grid li.large{
- flex-basis: 60%;
+.box--gallery {
+ /*justify-content: flex-start;*/
+}
+
+.gallery__item {
+ padding: 3px;
+}
+
+.section__content ul {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ max-width:80%;
+ padding-top: .3em;
+ padding-bottom: 1em;
}
-@media (max-width: 1000px){
-
- .our-work .grid li.small,
- .our-work .grid li.large{
- flex-basis: 100%;
- }
-
+.section__content li {
+ padding-bottom: .7em;
}
-
-
-/*----------------------
- Features Section
-----------------------*/
-
-.features{
- background-color: #f7f7f7;
+.section__content li::before {
+font-family: FontAwesome;
+content: "\f18e";
+padding-right:.5em;
+padding-left:1em
}
-.features .grid li{
- padding: 0 30px;
- flex-basis: 33%;
- text-align: center;
-}
-
-.features .grid li i{
- font-size: 50px;
- color: #2196F3;
- margin-bottom: 25px;
-}
-
-.features .grid li h4{
- color: #555;
- font-size: 20px;
- margin-bottom: 25px;
-}
-
-.features .grid li p{
- margin: 0;
-}
-
-@media (max-width: 1000px){
-
- .features .grid li{
- flex-basis: 70%;
- margin-bottom: 65px;
- }
-
- .features .grid li:last-child{
- margin-bottom: 0;
- }
-
-}
-
-
-@media (max-width: 600px){
-
- .features .grid li{
- flex-basis: 100%;
- }
-
-}
-
-
-
-/*--------------------
- Reviews Section
---------------------*/
-
-.reviews{
- background-color: #fff;
-}
-
-.reviews .quote{
- text-align: center;
- width: 80%;
- font-size: 22px;
- font-weight: 300;
- line-height: 1.5;
- margin-bottom: 20px;
- padding: 0;
-}
-
-.reviews .author{
- font-size: 18px;
- margin-bottom: 50px;
-}
-
-.reviews .author:last-child{
- margin-bottom: 0;
-}
-
-@media (max-width: 1000px){
-
- .reviews .quote{
- font-size: 20px;
- }
-
- .reviews .author{
- font-size: 16px;
- }
-
-}
-
-
-
-/*---------------------
- Contact Section
----------------------*/
-
-.contact{
- background-color: #f7f7f7;
-}
-
-.contact form{
- display: flex;
- align-items: center;
- justify-content: center;
- flex-wrap: wrap;
-
- max-width: 800px;
- width: 80%;
-}
-
-.contact form input{
- padding: 15px;
- flex: 1;
- margin-right: 30px;
- font-size: 18px;
- color: #555;
-}
-
-.contact form .btn{
- padding: 18px 42px;
-}
-
-
-@media (max-width: 800px){
-
- .contact form input{
- flex-basis: 100%;
- margin: 0 0 20px 0;
- }
-
-}
-
-
-
-
-/*-------------
- Footer
--------------*/
-
-footer{
- display: flex;
- flex-direction: column;
- align-items: center;
- text-align: center;
- color: #fff;
- background-color: #414a4f;
- padding: 60px 0;
-}
-
-footer ul{
- display: flex;
- margin-bottom: 25px;
- font-size: 32px;
-}
-
-footer ul li{
- margin: 0 8px;
-}
-
-footer ul li:first-child{
- margin-left: 0;
-}
-
-footer ul li:last-child{
- margin-right: 0;
-}
-
-footer p{
- text-transform: uppercase;
- font-size: 14px;
- color: rgba(255,255,255,0.6);
- margin-bottom: 10px;
-}
-
-footer p a{
- color: #fff;
-}
-
-@media (max-width: 700px){
-
- footer{
- padding: 80px 15px;
- }
-
-}
-
-
-/* -- Demo ads -- */
-
-@media (max-width: 1200px) {
- #bsaHolder{ display:none;}
+.section__content ul li {
+ text-indent: -3rem;
}
diff --git a/assets/css/responsive.css b/assets/css/responsive.css
new file mode 100644
index 0000000..0516e9f
--- /dev/null
+++ b/assets/css/responsive.css
@@ -0,0 +1,42 @@
+/* mobile in base and page css*/
+
+/* small tablets */
+@media only screen and (min-width: 40rem) {
+ .section__container {
+
+ }
+}
+
+@media only screen and (min-device-width: 40rem) and (max-device-width: 79rem) {
+}
+
+
+/* tablets */
+@media only screen and (min-width: 800px) {
+ .section__container {
+
+ }
+}
+
+@media only screen and (min-device-width: 800px) and (max-device-width: 1190px) {
+}
+
+
+/* desktop */
+
+@media only screen and (min-width: 1200px) {
+
+.section__container {
+ max-width: 1200px;
+ }
+}
+
+
+@media only screen and (min-device-width: 1200px) and (max-device-width: 1800px) {
+ /* Styles */
+}
+
+
+/* large*/
+
+@media screen and (min-width: 1800px) {}
diff --git a/assets/css/temp.css b/assets/css/temp.css
new file mode 100644
index 0000000..15cff6e
--- /dev/null
+++ b/assets/css/temp.css
@@ -0,0 +1,172 @@
+
+
+/*--------------------
+ Our Work Section
+---------------------*/
+ .оur-work {
+ background-color: #fff;
+ }
+ .our-work .grid li {
+ padding: 20px;
+ height: 350px;
+ border-radius: 3px;
+ background-clip: content-box;
+ background-size: cover;
+ background-position: center;
+ background-color: #333;
+ }
+ .our-work .grid li.small {
+ flex-basis: 40%;
+ }
+ .our-work .grid li.large {
+ flex-basis: 60%;
+ }
+ @media (max-width: 1000px) {
+ .our-work .grid li.small, .our-work .grid li.large {
+ flex-basis: 100%;
+ }
+ }
+ /*----------------------
+ Features Section
+----------------------*/
+ .features {
+ background-color: #f7f7f7;
+ }
+ .features .grid li {
+ padding: 0 30px;
+ flex-basis: 33%;
+ text-align: center;
+ }
+ .features .grid li i {
+ font-size: 50px;
+ color: #2196F3;
+ margin-bottom: 25px;
+ }
+ .features .grid li h4 {
+ color: #555;
+ font-size: 20px;
+ margin-bottom: 25px;
+ }
+ .features .grid li p {
+ margin: 0;
+ }
+ @media (max-width: 1000px) {
+ .features .grid li {
+ flex-basis: 70%;
+ margin-bottom: 65px;
+ }
+ .features .grid li:last-child {
+ margin-bottom: 0;
+ }
+ }
+ @media (max-width: 600px) {
+ .features .grid li {
+ flex-basis: 100%;
+ }
+ }
+ /*--------------------
+ Reviews Section
+--------------------*/
+ .reviews {
+ background-color: #fff;
+ }
+ .reviews .quote {
+ text-align: center;
+ width: 80%;
+ font-size: 22px;
+ font-weight: 300;
+ line-height: 1.5;
+ margin-bottom: 20px;
+ padding: 0;
+ }
+ .reviews .author {
+ font-size: 18px;
+ margin-bottom: 50px;
+ }
+ .reviews .author:last-child {
+ margin-bottom: 0;
+ }
+ @media (max-width: 1000px) {
+ .reviews .quote {
+ font-size: 20px;
+ }
+ .reviews .author {
+ font-size: 16px;
+ }
+ }
+ /*---------------------
+ Contact Section
+---------------------*/
+ .contact {
+ background-color: #f7f7f7;
+ }
+ .contact form {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-wrap: wrap;
+ max-width: 800px;
+ width: 80%;
+ }
+ .contact form input {
+ padding: 15px;
+ flex: 1;
+ margin-right: 30px;
+ font-size: 18px;
+ color: #555;
+ }
+ .contact form .btn {
+ padding: 18px 42px;
+ }
+ @media (max-width: 800px) {
+ .contact form input {
+ flex-basis: 100%;
+ margin: 0 0 20px 0;
+ }
+ }
+ /*-------------
+ Footer
+-------------*/
+ footer {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ text-align: center;
+ color: #fff;
+ background-color: #414a4f;
+ padding: 60px 0;
+ }
+ footer ul {
+ display: flex;
+ margin-bottom: 25px;
+ font-size: 32px;
+ }
+ footer ul li {
+ margin: 0 8px;
+ }
+ footer ul li:first-child {
+ margin-left: 0;
+ }
+ footer ul li:last-child {
+ margin-right: 0;
+ }
+ footer p {
+ text-transform: uppercase;
+ font-size: 14px;
+ color: rgba(255, 255, 255, 0.6);
+ margin-bottom: 10px;
+ }
+ footer p a {
+ color: #fff;
+ }
+ @media (max-width: 700px) {
+ footer {
+ padding: 80px 15px;
+ }
+ }
+ /* -- Demo ads -- */
+ @media (max-width: 1200px) {
+ #bsaHolder {
+ display: none;
+ }
+ }
diff --git a/assets/fonts/glyphicons-halflings-regular.eot b/assets/fonts/glyphicons-halflings-regular.eot
deleted file mode 100644
index 4a4ca86..0000000
Binary files a/assets/fonts/glyphicons-halflings-regular.eot and /dev/null differ
diff --git a/assets/fonts/glyphicons-halflings-regular.svg b/assets/fonts/glyphicons-halflings-regular.svg
deleted file mode 100644
index e3e2dc7..0000000
--- a/assets/fonts/glyphicons-halflings-regular.svg
+++ /dev/null
@@ -1,229 +0,0 @@
-
-
-
\ No newline at end of file
diff --git a/assets/fonts/glyphicons-halflings-regular.ttf b/assets/fonts/glyphicons-halflings-regular.ttf
deleted file mode 100644
index 67fa00b..0000000
Binary files a/assets/fonts/glyphicons-halflings-regular.ttf and /dev/null differ
diff --git a/assets/fonts/glyphicons-halflings-regular.woff b/assets/fonts/glyphicons-halflings-regular.woff
deleted file mode 100644
index 8c54182..0000000
Binary files a/assets/fonts/glyphicons-halflings-regular.woff and /dev/null differ
diff --git a/assets/js/docready.js b/assets/js/docready.js
index fd2db34..cb64f1f 100644
--- a/assets/js/docready.js
+++ b/assets/js/docready.js
@@ -1,6 +1,8 @@
// requires jquery
$(document).ready(function () {
- $("#media").lightGallery({
+ // Intialize all the media i.e. photos with "media" id
+ // TODO use Hugo params to initialize multiple galleries/albums
+ $("#4005").lightGallery({
thumbnail: true,
thumbWidth: 80,
controls: true,
@@ -9,9 +11,29 @@ $(document).ready(function () {
counter: true,
// videojs: true
});
- hero() // size the hero section initially
- // Resize event will run hero function.
- $(window).resize(function () {
- hero();
+
+ // initialize hero size
+ heroResize();
+ // iframeResize();
+ // jQuery('iframe').fitToParent(); // for all iframes
+
+ $('section').flowtype({
+ // maximum: 1000,
+ minFont: 12,
+ maxFont: 25,
+ fontRatio: 20
});
+
+ $('#hero').flowtype({
+ maxFont: 60,
+ fontRatio: 15
+ });
+
+ // resize elements on change
+ $(window).resize(function () {
+ heroResize();
+ // iframeResize();
+ // jQuery('iframe').fitToParent();
+ });
+
});
diff --git a/assets/js/fitToParent.js b/assets/js/fitToParent.js
new file mode 100644
index 0000000..9229f31
--- /dev/null
+++ b/assets/js/fitToParent.js
@@ -0,0 +1,67 @@
+/*!
+ * jQuery fitToParent; version: 1.2.1
+ * https://github.com/drewbaker/fitToParent
+ */
+jQuery.fn.fitToParent = function (options) {
+
+ this.each(function () {
+ // Vars
+ var $el = jQuery(this);
+ var $box;
+
+ // Get size parent (box to fit element in)
+ if ($el.closest('.size-parent').length) {
+ $box = $el.closest('.size-parent');
+ } else {
+ $box = $el.parent();
+ }
+
+ // These are the defaults.
+ var settings = jQuery.extend({
+ heightOffset: 0,
+ widthOffset: 0,
+ boxHeight: $box.height(),
+ boxWidth: $box.width(),
+ callback: null
+ }, options);
+
+ // Setup box and element widths
+ var width = $el.attr('width');
+ var height = $el.attr('height');
+
+ if (!width || !height) {
+ var width = $el.width();
+ var height = $el.height();
+ }
+
+ var parentWidth = settings.boxWidth - settings.widthOffset;
+ var parentHeight = settings.boxHeight - settings.heightOffset;
+
+ // Maintain aspect ratio
+ var aspect = $el.data('aspect');
+ if (!aspect) {
+ aspect = width / height;
+ $el.data('aspect', aspect);
+ }
+ var parentAspect = parentWidth / parentHeight;
+
+ // Resize to fit box
+ if (aspect > parentAspect) {
+ newWidth = parentWidth;
+ newHeight = (newWidth / aspect);
+ } else {
+ newHeight = parentHeight;
+ newWidth = newHeight * aspect;
+ }
+
+ // Set new size of element
+ $el.width(newWidth);
+ $el.height(newHeight);
+
+ // Fire callback
+ if (typeof (settings.callback) == "function") {
+ settings.callback(newWidth, newHeight);
+ }
+
+ });
+};
diff --git a/assets/js/junk.js b/assets/js/junk.js
new file mode 100644
index 0000000..2c0e97d
--- /dev/null
+++ b/assets/js/junk.js
@@ -0,0 +1,27 @@
+// videos - preload
+(function videoInit() {
+
+ var $allVideos = $("iframe[src*='//player.vimeo.com'], iframe[src*='//www.youtube.com'], object, embed"),
+ $fluidEl = $("figure");
+
+ $allVideos.each(function () {
+ $(this)
+ // jQuery .data does not work on object/embed elements
+ .attr('data-aspectRatio', this.height / this.width)
+ .removeAttr('height')
+ .removeAttr('width');
+ })
+}());
+
+// resize videos on window change
+function videoResize() {
+
+ $allVideos.each(function () {
+
+ var $el = $(this);
+ var newWidth = $el.parents('figure').width();
+ $el
+ .width(newWidth)
+ .height(newWidth * $el.attr('data-aspectRatio'));
+ });
+}
diff --git a/assets/js/page.js b/assets/js/page.js
index 7d20b43..eaadc2f 100644
--- a/assets/js/page.js
+++ b/assets/js/page.js
@@ -1,12 +1,12 @@
// hero resizer
-function hero() {
+function heroResize() {
jQuery('#hero').css({
width: jQuery(window).width(),
height: jQuery(window).height()
});
}
-// Smooth Scroll Register click handler for ID anchors
+// Smooth Scroll Init - Register click handler for ID anchors
$('a[href*="#"]:not([href="#"])').click(function () {
if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
var target = $(this.hash);
@@ -21,18 +21,40 @@ $('a[href*="#"]:not([href="#"])').click(function () {
});
// navbar - preload
-(function navbar() {
+(function navbarInit() {
// var navButton = document.getElementById("nav-menu-button"),
// var navButton = document.getElementById("nav-container"),
// navUl = document.getElementsByClassName("nav-ul");
function toggleMobileMenu() {
- $('.nav-ul')[0].style.transition = "max-height 0.5s";
- $('.nav-ul')[0].classList.toggle("hide-ul");
+ $('.nav-bar__menu-list')[0].style.transition = "max-height 0.5s";
+ $('.nav-bar__menu-list')[0].classList.toggle("hide-ul");
}
// navLink.onclick = toggleMobileMenu;
// navButton.onclick = toggleMobileMenu;
- $('#nav-menu-button, nav a').click(toggleMobileMenu)
+ $('.nav-bar__menu-button, .nav-bar__menu a').click(toggleMobileMenu)
}());
+
+function iframeResize(percent = 1) {
+ console.log('window width', percent, $(window).width())
+ console.log('section_content', percent, $('.section__content').width())
+ console.log('box embed width', percent, $('.box__embed').width())
+ $('iframe').each(function (i) {
+ console.log('aspect', this.aspect)
+ $(this).attr('height', this.aspect * $('.box__embed').width())
+ $(this).attr('width', $('.box__embed').width())
+ })
+ console.log('new width and height', $('iframe')[0].width, $('iframe')[0].height)
+ console.log('new width and height', $('iframe')[1].width, $('iframe')[1].height)
+}
+
+// get all original iframe dimensions
+(function iframeInit() {
+ $('iframe').each(function (i) {
+ console.log(i, $(this).attr('height'), $(this).attr('width'));
+ this.aspect = $(this).attr('height') / $(this).attr('width')
+ console.log('aspect iframe', i, this.aspect)
+ })
+}());
diff --git a/config.toml b/config.toml
index dc112c7..fd510a6 100644
--- a/config.toml
+++ b/config.toml
@@ -1,4 +1,4 @@
-baseurl = "4005.kebler.net"
+baseurl = ""
languageCode = "en-us"
title = "For Sale: 4005 Rock Way, Central Point, OR"
canonifyUrls = "true"
@@ -7,13 +7,14 @@ publishDir = "dist"
[params]
custom_css = ["css/custom.css"]
- font = "Baloo" # a valid google font name, default Roboto
+ font = "Lato" # a valid google font name, default Roboto
# For List of html colors
# http://www.quackit.com/css/color/charts/css_color_names_chart.cfm
[params.navbar]
# text = "For Sale By Owner: 4005 Rock Way" # default is to use the page title
+ # text_small = ""
text_size="1" # unit is em, 1em is default
# font = "Ranga"
color = "white"
@@ -25,7 +26,8 @@ publishDir = "dist"
# img_small "intro-small.jpg"
font = "Acme" # a valid google font name, default Roboto for all hero text
# color = "green"
- # font_headline = "Gloria Hallelujah" # a valid google font name, defaults to intro font
+ # background-color = "red"
+ # headlines_font = "Gloria Hallelujah" # a valid google font name, defaults to intro font
headline = "For Sale"
headline_color = "red"
# headline_size = "10"
@@ -37,13 +39,15 @@ publishDir = "dist"
# subsubheadline_size = "1"
lines = ["A Rambler Style House","Close to Schools"]
# lines_color = "purple"
- lines_size = "1.5"
+ # lines_size = "1.5"
divider = true
divider_color = "seagreen"
# divider_thickness = "3"
[params.sections]
font = "Lato"
+ # maxFont =
+ # fontRatio =
headline_font = "Lato"
headline_size = "3"
[params.sections.odd]
@@ -51,7 +55,7 @@ publishDir = "dist"
# bg_color = ""
[params.sections.even]
# color = ""
- # bg_color = ""
+ bg_color = "seagreen"
[[params.social]]
diff --git a/content/about.md b/content/about.md
index c4a00f8..bd6b5d0 100644
--- a/content/about.md
+++ b/content/about.md
@@ -4,10 +4,11 @@ date = "2017-02-22"
draft = false
title = "About This House"
link_text = "About"
-anchor="about"
+anchor="atext ut"
+
+++
-{{% lorem 1s %}}
-{{% lorem 1s %}}
-{{% lorem 1s %}}
-{{% lorem 1s %}}
-{{% lorem 1s %}}
+Built in 1977 in Central Point, Oregon this 1548 sq. ft. Rambler/Ranch Style House has 3 bedrooms, 2 baths, covered patio, and an attached 2-car garage. It would be perfect for two child family or a couple wanting a spare bedroom and an office. Since 2007 the house has had numerous updates and is move-in ready. It is located within easy walking distance to Central Point's high and middle schools as well as the Bear Creek Greenway, Jackson County Expo and a RVTD bus stop.
+
+{{< embed type="google-map" title="A Title" caption="A caption" >}}
+
+{{< /embed >}}
diff --git a/content/details.md b/content/details.md
index eb97da9..cecf5a4 100644
--- a/content/details.md
+++ b/content/details.md
@@ -5,7 +5,36 @@ title = "Details"
link_text = "Details"
weight = 4
+++
-* Man Cave
-* Shop
-* Shed
-* Hot Tub
+## Amenities
+
+* Two mature trees in front yard provide summer shade
+* Sliding doors from master bedroom and dining room open to patio
+* Additional off street parking
+* Fenced back yard for Bowser
+* Fenced side yard with 10ft wide gated street access
+* 8' x 12' matching storage shed
+* Dog door
+* Great neighbors
+* All appliances included
+* One block to convenience store (and growler fills)
+* Middle school across the street with access to track and playing fields
+* One block to Crater Rock Museum
+
+## House Updates Since 2007
+
+* Architect designed and professionally installed landscaping (now 10 years mature) with automated sprinkler/irrigation
+* Hot Tub!
+* Complete kitchen remodel with tile back splash and custom maple cabinets
+* Heil furnace and heat pump, plus all ducting replaced
+* R-38 Attic Insulation and Solar Attic Fan
+* Solar tubes in kitchen, family, and living rooms
+* 50 gallon water heater
+* All windows, sliding doors replaced with vinyl ones using argon low-e glass
+* Entry door replaced featuring argon low-e window and built in shade.
+* All light fixtures replaced with LED bulbs
+* All vinyl flooring replaced with high quality with Mannington Adura locking tiles.
+* Custom birch fireplace mantle and cabinets on north wall of family room
+* Raised beds garden with automated irrigation
+* Additional shelving and workbench in garage
+* Closet pantry/laundry
+* Bathroom updates
diff --git a/content/footer.md b/content/footer.md
new file mode 100644
index 0000000..4f023aa
--- /dev/null
+++ b/content/footer.md
@@ -0,0 +1,6 @@
++++
+draft = false
+weight = 100
+link_text = "Contact"
++++
+This is the footer
diff --git a/content/offers.md b/content/offers.md
new file mode 100644
index 0000000..2faac79
--- /dev/null
+++ b/content/offers.md
@@ -0,0 +1,14 @@
++++
+date = "2015-07-18T14:53:21+02:00"
+draft = false
+title = "Making an Offer"
+link_text = "Offers"
+weight = 6
++++
+
+* Done kicking the tires?
+* Ready to make an offer on our house?
+
+* Simply click the button and fill in our offer form.
+
+{{< jotform 70640438290151 "Make an Offer" "on 4005 Rock Way" >}}
diff --git a/content/openhouse.md b/content/openhouse.md
index e5f4927..1dc9a67 100644
--- a/content/openhouse.md
+++ b/content/openhouse.md
@@ -2,7 +2,14 @@
date = "2015-07-18T14:53:21+02:00"
draft = false
title = "Open House"
-link_text = "Open House"
+link_text = "OpenHouse"
weight = 5
+++
-Blah Blah Dates
+# Saturday and Sunday
+## March 25/26th
+## 1-4pm# Wednesday
+## March 29th
+## 4-7pm
+#### and the following weekend and Wednesday if necessary
+
+{{< jotform 70645504427152 "RSVP Please" >}}
diff --git a/content/video.md b/content/video.md
index 57457fb..bd65b88 100644
--- a/content/video.md
+++ b/content/video.md
@@ -4,4 +4,6 @@ title = "Video Walk Through"
weight = 3
link_text = "Video"
+++
-{{% youtube ZhF0fkGRgSo %}}
+{{< embed youtube-video >}}
+
+{{< /embed }}
diff --git a/layouts/index.html b/layouts/index.html
index a7431ae..873d35e 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -1,5 +1,12 @@
+
+
{{ partial "head.html" . }}
+
{{ partial "navbar.html" . }}
+
{{ partial "hero.html" . }}
{{ partial "sections.html" . }}
-{{ partial "footer.html" . }}
+
+{{ partial "js.html" . }}
+
+
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
deleted file mode 100644
index d00f6ef..0000000
--- a/layouts/partials/footer.html
+++ /dev/null
@@ -1,36 +0,0 @@
-
-
-{{ partial "js.html" . }}
-
-