UCOMmandIt
/
uci-hugo-landingpage
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fully working page -yea!

master
David Kebler 2017-03-04 20:02:56 -08:00
parent b86b0e7717
commit 95a7c08d2e
27 changed files with 427 additions and 538 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
assets/css/gallery/video-js.css
View File

File diff suppressed because one or more lines are too long

28
assets/css/gallery/viewer.css
View File

@ -1,28 +0,0 @@
/*
-----------------------------------
Photo and video viewer
This is shared by all templates
-----------------------------------
*/
#lg-gallery .lg-slide .object {
transition-duration: 0.3s;
}
#lg-gallery .video {
height: 100%;
left: 0;
padding-bottom: 100px;
position: absolute;
top: 0;
width: 100%;
}
#lg-gallery video {
max-width: 100%;
}
/* always display captions above the thumbnails */
.lg-sub-html {
bottom: 100px;
}

59
assets/css/navbar.css
View File

@ -1,13 +1,3 @@
/*body, p, h1, h2, h3, h4, ul, li {
margin: 0;
padding: 0;
}*/
/*body {
max-height: 100vh;
}*/
#nav-container > nav > ul {
list-style-type: none;
}
@ -16,7 +6,7 @@
#nav-background {
position: fixed;
top: 0;
z-index: 9000;
z-index: 1000;
width: 100%;
background-color: white;
border-bottom: 1px solid #ddd;
@ -26,67 +16,42 @@
}
#nav-container {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
max-width: 1000px;
max-width: 1200px;
margin: 0 auto;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
font-family: Arial, Helvetica, sans-serif;
}
#nav-header {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
#nav-logo {
color: #444;
text-decoration: none;
font-size: 1em;
font-weight: bold;
}
#nav-logo:hover {
color: #666;
/*color: #666;*/
}
.nav-ul {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
max-width: 700px;
}
.nav-ul > li {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.nav-link {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
color: #444;
color: black;
text-decoration: none;
font-weight: 600;
font-size: 1.2rem;
-webkit-transition: 200ms;
transition: 200ms;
}
@ -102,13 +67,9 @@
/* MOBILE MENU */
@media screen and (max-width: 700px) {
@media screen and (max-width: 899px) {
#nav-container {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
text-align: center;
}
@ -121,10 +82,6 @@
.nav-ul {
display: block;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
overflow-y: scroll;
direction: rtl;
@ -144,7 +101,7 @@
/* END MOBILE MENU */
/* DESKTOP MENU */
@media screen and (min-width: 701px) {
@media screen and (min-width: 900px) {
#nav-menu-button {
display: none;

218
assets/css/page.css
View File

@ -9,20 +9,27 @@
}
html{
font: normal 16px sans-serif;
color: #555;
font-family: 'Roboto', sans-serif;
font-size: 1em;
color: black;
}
ul, nav{
list-style: none;
}
ul.grid{
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
a{
text-decoration: none;
color: inherit;
cursor: pointer;
opacity: 0.9;
opacity: 0.7;
}
a:hover{
@ -38,201 +45,122 @@ a.btn{
text-align: center;
}
hr{
width: 150px;
height: 2px;
background-color: #2196F3;
border: 0;
margin-bottom: 80px;
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);
}
.divider {
width: 400px;
border-top: 1px solid #f8f8f8;
border-bottom: 1px solid rgba(0,0,0,0.2);
}
/*----------------
Common Section Styling
----------------*/
section{
display: flex;
flex-direction: column;
align-items: center;
padding: 125px 100px;
padding: 20px 50px;
}
@media (max-width: 1000px){
section{
padding: 100px 50px;
}
.section-even {
color: white;
background-color: silver;
}
@media (max-width: 600px){
section{
padding: 80px 30px;
}
}
section h3.title{
color: #414a4f;
text-transform: capitalize;
font: bold 32px 'Open Sans', sans-serif;
margin-bottom: 35px;
text-align: center;
section h1{
font-size: 1.25em;
}
section p{
max-width: 800px;
text-align: center;
margin-bottom: 35px;
padding: 0 20px;
line-height: 2;
}
ul.grid{
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
@media (min-width: 600px){
/*-------------
Header
-------------
header{
position: absolute;
top: 0;
left: 0;
z-index: 10;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
color: #fff;
padding: 35px 100px 0;
}
header h2{
font-family: 'Quicksand', sans-serif;
}
header nav{
display: flex;
}
header nav li{
margin: 0 15px;
}
header nav li:first-child{
margin-left: 0;
}
header nav li:last-child{
margin-right: 0;
}
@media (max-width: 1000px){
header{
padding: 20px 50px;
}
}
@media (max-width: 700px){
header{
flex-direction: column;
section{
padding: 60px 60px;
}
header h2{
margin-bottom: 15px;
section h1{
font-size: 2em;
}
}
*/
@media (min-width: 1000px){
section{
padding: 80px 125px;
}
section h1{
font-size: 2.5em;
}
}
/*----------------
Hero Section
----------------*/
.hero{
/*position: relative;*/
#hero{
background-image: url("../images/hero.jpg");
background-size:cover;
background-position: center;
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
color: #fff;
text-align: center;
padding-top: 10%; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */
padding-bottom: 10%;
text-align: center;
background-size: contain;
}
.hero .background-image{
background-image: url("../images/intro.jpg") no-repeat center center;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
background-color: #2196F3;
z-index: -1;
#hero .text {
text-align:center;
width:auto;
color:white;
font-weight: bold;
font-size: 1em;
}
.hero .background-image:after{
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #414a4f;
opacity: 0.75;
/* #hero h1, #hero h2, #hero h3, #hero h4, #hero p { color:white; }*/
#hero h1{
font-size: 5em;
}
.hero h1{
font: bold 60px 'Open Sans', sans-serif;
margin-bottom: 15px;
#hero h2{
font-size: 3em;
}
.hero h3{
font: normal 28px 'Open Sans', sans-serif;
margin-bottom: 40px;
#hero h3{
font-size: 2em;
}
.hero a.btn{
#hero a.btn{
padding: 20px 46px;
}
@media (max-width: 800px){
.hero{
min-height: 600px;
}
.hero h1{
#hero h1{
font-size: 48px;
}
.hero h3{
#hero h3{
font-size: 24px;
}
.hero a.btn{
#hero a.btn{
padding: 15px 40px;
}
}
/*--------------------
Our Work Section
---------------------*/

199
assets/css/singlepage.css
View File

@ -1,199 +0,0 @@
/*
*/
body,
html {
width: 100%;
height: 100%;
}
body,h1,h2,h3,h4,h5,h6 {
font-family: Roboto,Helvetica,Arial,sans-serif;
font-weight: 700;
}
/* section tag */
section {
}
.navbar {
background-color: white;
}
.navbar-header div a , .navbar-nav > li > a {
color: black;
text-decoration: none;
}
#intro {
height: 100%;
padding-top: 10%; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */
padding-bottom: 10%;
text-align: center;
/*background-image: url("../images/intro.jpg") no-repeat center center;
background-size: contain;*/
}
#intro, #intro h1, #intro h2, #intro h3, #intro h4, #intro p {
color: white;
}
.intro-text {
position: relative;
padding-top: 20%;
padding-bottom: 20%;
}
.intro-text > h1 {
margin: 0;
text-shadow: 5px 5px 5px rgba(0,0,0,0.6);
font-size: 6em;
}
.intro-text > h2 {
text-shadow: 2px 2px 3px rgba(0,0,0,0.6);
font-size: 4em;
}
.intro-text > h3 {
font-size: 2em;
}
.intro-divider {
width: 400px;
border-top: 1px solid #f8f8f8;
border-bottom: 1px solid rgba(0,0,0,0.2);
}
/*section class*/
.section {
padding: 50px 0;
border-top: 2px solid black;
}
.section-heading {
margin-bottom: 30px;
}
.section-heading-spacer {
float: left;
width: 200px;
border-top: 3px solid #e7e7e7;
}
.section-odd {
color: black;
background-color: white;
}
.section-even {
color: white;
background-color: dimgrey;
}
@media(max-width:767px) {
#intro {
background-image: url(./imgs/intro-phone.jpg);
}
.intro-text {
padding-bottom: 15%;
}
.intro-text > h1 {
font-size: 3em;
}
ul.intro-social-buttons > li {
display: block;
margin-bottom: 20px;
padding: 0;
}
ul.intro-social-buttons > li:last-child {
margin-bottom: 0;
}
.intro-divider {
width: 100%;
}
}
.contact {
padding: 100px 0;
color: #f8f8f8;
background: url(../img/intro.jpg) no-repeat center center;
background-size: cover;
}
.contact h2 {
margin: 0;
text-shadow: 2px 2px 3px rgba(0,0,0,0.6);
font-size: 3em;
}
.contact ul {
margin-bottom: 0;
}
.contact-social-buttons {
float: right;
margin-top: 0;
}
@media(max-width:1199px) {
ul.contact-social-buttons {
float: left;
margin-top: 15px;
}
}
@media(max-width:767px) {
.contact h2 {
margin: 0;
text-shadow: 2px 2px 3px rgba(0,0,0,0.6);
font-size: 3em;
}
ul.contact-social-buttons > li {
display: block;
margin-bottom: 20px;
padding: 0;
}
ul.contact-social-buttons > li:last-child {
margin-bottom: 0;
}
}
footer {
padding: 50px 0;
font-size: 1.1em;
background-color: slategray;
color: white;
}
footer a, a:visited {
color: white;
text-decoration: none;
}
footer a:hover {
color: black;
text-decoration: none;
}

0
assets/css/gallery/style.css → assets/css/thumbsup.css
View File

0
assets/images/intro.jpg → assets/images/4005front.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 282 KiB

After

Width:  |  Height:  |  Size: 282 KiB

5
assets/js/docready.js
View File

@ -9,4 +9,9 @@ $(document).ready(function () {
counter: true,
// videojs: true
});
hero() // size the hero section initially
// Resize event will run hero function.
$(window).resize(function () {
hero();
});
});

141
assets/js/lorem.js Normal file
View File

@ -0,0 +1,141 @@
var Lorem;
(function() {
//Create a class named Lorem and constructor
Lorem = function() {
//Default values.
this.type = null;
this.query = null;
this.data = null;
};
//Static variables
Lorem.IMAGE = 1;
Lorem.TEXT = 2;
Lorem.TYPE = {
PARAGRAPH: 1,
SENTENCE: 2,
WORD: 3
};
//Words to create lorem ipsum text.
Lorem.WORDS = [
"lorem", "ipsum", "dolor", "sit", "amet,", "consectetur", "adipiscing", "elit", "ut", "aliquam,", "purus", "sit", "amet", "luctus", "venenatis,", "lectus", "magna", "fringilla", "urna,", "porttitor", "rhoncus", "dolor", "purus", "non", "enim", "praesent", "elementum", "facilisis", "leo,", "vel", "fringilla", "est", "ullamcorper", "eget", "nulla", "facilisi", "etiam", "dignissim", "diam", "quis", "enim", "lobortis", "scelerisque", "fermentum", "dui", "faucibus", "in", "ornare", "quam", "viverra", "orci", "sagittis", "eu", "volutpat", "odio", "facilisis", "mauris", "sit", "amet", "massa", "vitae", "tortor", "condimentum", "lacinia", "quis", "vel", "eros", "donec", "ac", "odio", "tempor", "orci", "dapibus", "ultrices", "in", "iaculis", "nunc", "sed", "augue", "lacus,", "viverra", "vitae", "congue", "eu,", "consequat", "ac", "felis", "donec", "et", "odio", "pellentesque", "diam", "volutpat", "commodo", "sed", "egestas", "egestas", "fringilla", "phasellus", "faucibus", "scelerisque", "eleifend", "donec", "pretium", "vulputate", "sapien", "nec", "sagittis", "aliquam", "malesuada", "bibendum", "arcu", "vitae", "elementum",
"curabitur", "vitae", "nunc", "sed", "velit", "dignissim", "sodales", "ut", "eu", "sem", "integer", "vitae", "justo", "eget", "magna", "fermentum", "iaculis", "eu", "non", "diam", "phasellus", "vestibulum", "lorem", "sed", "risus", "ultricies", "tristique", "nulla", "aliquet", "enim", "tortor,", "at", "auctor", "urna", "nunc", "id", "cursus", "metus", "aliquam", "eleifend", "mi", "in", "nulla", "posuere", "sollicitudin", "aliquam", "ultrices", "sagittis", "orci,", "a", "scelerisque", "purus", "semper", "eget", "duis", "at", "tellus", "at", "urna", "condimentum", "mattis", "pellentesque", "id", "nibh", "tortor,", "id", "aliquet", "lectus", "proin", "nibh", "nisl,", "condimentum", "id", "venenatis", "a,", "condimentum", "vitae", "sapien", "pellentesque", "habitant", "morbi", "tristique", "senectus", "et", "netus", "et", "malesuada", "fames", "ac", "turpis", "egestas", "sed", "tempus,", "urna", "et", "pharetra", "pharetra,", "massa", "massa", "ultricies", "mi,", "quis", "hendrerit", "dolor", "magna", "eget", "est", "lorem", "ipsum", "dolor", "sit", "amet,", "consectetur", "adipiscing", "elit", "pellentesque", "habitant", "morbi", "tristique", "senectus", "et", "netus", "et", "malesuada", "fames", "ac", "turpis", "egestas", "integer", "eget", "aliquet", "nibh", "praesent", "tristique", "magna", "sit", "amet", "purus", "gravida", "quis", "blandit", "turpis", "cursus", "in", "hac", "habitasse", "platea", "dictumst", "quisque", "sagittis,", "purus", "sit", "amet", "volutpat", "consequat,", "mauris", "nunc", "congue", "nisi,", "vitae", "suscipit", "tellus", "mauris", "a", "diam",
"maecenas", "sed", "enim", "ut", "sem", "viverra", "aliquet", "eget", "sit", "amet", "tellus", "cras", "adipiscing", "enim", "eu", "turpis", "egestas", "pretium", "aenean", "pharetra,", "magna", "ac", "placerat", "vestibulum,", "lectus", "mauris", "ultrices", "eros,", "in", "cursus", "turpis", "massa", "tincidunt", "dui", "ut", "ornare", "lectus", "sit", "amet", "est", "placerat", "in", "egestas", "erat", "imperdiet", "sed", "euismod", "nisi", "porta", "lorem", "mollis", "aliquam", "ut", "porttitor", "leo", "a", "diam", "sollicitudin", "tempor", "id", "eu", "nisl", "nunc", "mi", "ipsum,", "faucibus", "vitae", "aliquet", "nec,", "ullamcorper", "sit", "amet", "risus", "nullam", "eget", "felis", "eget", "nunc", "lobortis", "mattis", "aliquam", "faucibus", "purus", "in", "massa", "tempor", "nec", "feugiat", "nisl", "pretium", "fusce", "id", "velit", "ut", "tortor", "pretium", "viverra", "suspendisse", "potenti", "nullam", "ac", "tortor", "vitae", "purus", "faucibus", "ornare", "suspendisse", "sed", "nisi", "lacus,", "sed", "viverra", "tellus", "in", "hac", "habitasse", "platea", "dictumst", "vestibulum", "rhoncus", "est", "pellentesque", "elit", "ullamcorper", "dignissim", "cras", "tincidunt", "lobortis", "feugiat", "vivamus", "at", "augue", "eget", "arcu", "dictum", "varius", "duis", "at", "consectetur", "lorem",
"donec", "massa", "sapien,", "faucibus", "et", "molestie", "ac,", "feugiat", "sed", "lectus", "vestibulum", "mattis", "ullamcorper", "velit", "sed", "ullamcorper", "morbi", "tincidunt", "ornare", "massa,", "eget", "egestas", "purus", "viverra", "accumsan", "in", "nisl", "nisi,", "scelerisque", "eu", "ultrices", "vitae,", "auctor", "eu", "augue", "ut", "lectus", "arcu,", "bibendum", "at", "varius", "vel,", "pharetra", "vel", "turpis", "nunc", "eget", "lorem", "dolor,", "sed", "viverra", "ipsum", "nunc", "aliquet", "bibendum", "enim,", "facilisis", "gravida", "neque", "convallis", "a", "cras", "semper", "auctor", "neque,", "vitae", "tempus", "quam", "pellentesque", "nec", "nam", "aliquam", "sem", "et", "tortor", "consequat", "id", "porta", "nibh", "venenatis", "cras", "sed", "felis", "eget", "velit", "aliquet", "sagittis", "id", "consectetur", "purus", "ut", "faucibus", "pulvinar", "elementum", "integer", "enim", "neque,", "volutpat", "ac", "tincidunt", "vitae,", "semper", "quis", "lectus", "nulla", "at", "volutpat", "diam", "ut", "venenatis", "tellus", "in", "metus", "vulputate", "eu", "scelerisque", "felis", "imperdiet", "proin", "fermentum", "leo", "vel", "orci", "porta", "non", "pulvinar", "neque", "laoreet", "suspendisse", "interdum", "consectetur", "libero,", "id", "faucibus", "nisl", "tincidunt", "eget", "nullam", "non", "nisi", "est,", "sit", "amet", "facilisis", "magna",
"etiam", "tempor,", "orci", "eu", "lobortis", "elementum,", "nibh", "tellus", "molestie", "nunc,", "non", "blandit", "massa", "enim", "nec", "dui", "nunc", "mattis", "enim", "ut", "tellus", "elementum", "sagittis", "vitae", "et", "leo", "duis", "ut", "diam", "quam", "nulla", "porttitor", "massa", "id", "neque", "aliquam", "vestibulum", "morbi", "blandit", "cursus", "risus,", "at", "ultrices", "mi", "tempus", "imperdiet", "nulla", "malesuada", "pellentesque", "elit", "eget", "gravida", "cum", "sociis", "natoque", "penatibus", "et", "magnis", "dis", "parturient", "montes,", "nascetur", "ridiculus", "mus", "mauris", "vitae", "ultricies", "leo", "integer", "malesuada", "nunc", "vel", "risus", "commodo", "viverra", "maecenas", "accumsan,", "lacus", "vel", "facilisis", "volutpat,", "est", "velit", "egestas", "dui,", "id", "ornare", "arcu", "odio", "ut", "sem", "nulla", "pharetra", "diam", "sit", "amet", "nisl", "suscipit", "adipiscing", "bibendum", "est", "ultricies", "integer", "quis", "auctor", "elit",
"sed", "vulputate", "mi", "sit", "amet", "mauris", "commodo", "quis", "imperdiet", "massa", "tincidunt", "nunc", "pulvinar", "sapien", "et", "ligula", "ullamcorper", "malesuada", "proin", "libero", "nunc,", "consequat", "interdum", "varius", "sit", "amet,", "mattis", "vulputate", "enim", "nulla", "aliquet", "porttitor", "lacus,", "luctus", "accumsan", "tortor", "posuere", "ac", "ut", "consequat", "semper", "viverra", "nam", "libero", "justo,", "laoreet", "sit", "amet", "cursus", "sit", "amet,", "dictum", "sit", "amet", "justo", "donec", "enim", "diam,", "vulputate", "ut", "pharetra", "sit", "amet,", "aliquam", "id", "diam", "maecenas", "ultricies", "mi", "eget", "mauris", "pharetra", "et", "ultrices", "neque", "ornare", "aenean", "euismod", "elementum", "nisi,", "quis", "eleifend", "quam", "adipiscing", "vitae", "proin", "sagittis,", "nisl", "rhoncus", "mattis", "rhoncus,", "urna", "neque", "viverra", "justo,", "nec", "ultrices", "dui", "sapien", "eget", "mi", "proin", "sed", "libero", "enim,", "sed", "faucibus", "turpis", "in", "eu", "mi", "bibendum", "neque", "egestas", "congue", "quisque", "egestas", "diam", "in", "arcu", "cursus", "euismod", "quis", "viverra", "nibh", "cras", "pulvinar", "mattis", "nunc,", "sed", "blandit", "libero", "volutpat", "sed", "cras", "ornare", "arcu", "dui", "vivamus", "arcu", "felis,", "bibendum", "ut", "tristique", "et,", "egestas", "quis", "ipsum", "suspendisse", "ultrices", "gravida", "dictum",
"fusce", "ut", "placerat", "orci", "nulla", "pellentesque", "dignissim", "enim,", "sit", "amet", "venenatis", "urna", "cursus", "eget", "nunc", "scelerisque", "viverra", "mauris,", "in", "aliquam", "sem", "fringilla", "ut", "morbi", "tincidunt", "augue", "interdum", "velit", "euismod", "in", "pellentesque", "massa", "placerat", "duis", "ultricies", "lacus", "sed", "turpis", "tincidunt", "id", "aliquet", "risus", "feugiat", "in", "ante", "metus,", "dictum", "at", "tempor", "commodo,", "ullamcorper", "a", "lacus", "vestibulum", "sed", "arcu", "non", "odio", "euismod", "lacinia", "at", "quis", "risus", "sed", "vulputate", "odio", "ut", "enim", "blandit", "volutpat", "maecenas", "volutpat", "blandit", "aliquam", "etiam", "erat", "velit,", "scelerisque", "in", "dictum", "non,", "consectetur", "a", "erat", "nam", "at", "lectus", "urna", "duis", "convallis", "convallis", "tellus,", "id", "interdum", "velit", "laoreet", "id", "donec", "ultrices", "tincidunt", "arcu,", "non", "sodales", "neque", "sodales", "ut", "etiam", "sit", "amet", "nisl", "purus,", "in", "mollis", "nunc",
"sed", "id", "semper", "risus", "in", "hendrerit", "gravida", "rutrum", "quisque", "non", "tellus", "orci,", "ac", "auctor", "augue", "mauris", "augue", "neque,", "gravida", "in", "fermentum", "et,", "sollicitudin", "ac", "orci", "phasellus", "egestas", "tellus", "rutrum", "tellus", "pellentesque", "eu", "tincidunt", "tortor", "aliquam", "nulla", "facilisi", "cras", "fermentum,", "odio", "eu", "feugiat", "pretium,", "nibh", "ipsum", "consequat", "nisl,", "vel", "pretium", "lectus", "quam", "id", "leo", "in", "vitae", "turpis", "massa", "sed", "elementum", "tempus", "egestas", "sed", "sed", "risus", "pretium", "quam", "vulputate", "dignissim", "suspendisse", "in", "est", "ante", "in", "nibh", "mauris,", "cursus", "mattis", "molestie", "a,", "iaculis", "at", "erat",
"pellentesque", "adipiscing", "commodo", "elit,", "at", "imperdiet", "dui", "accumsan", "sit", "amet", "nulla", "facilisi", "morbi", "tempus", "iaculis", "urna,", "id", "volutpat", "lacus", "laoreet", "non", "curabitur", "gravida", "arcu", "ac", "tortor", "dignissim", "convallis", "aenean", "et", "tortor", "at", "risus", "viverra", "adipiscing", "at", "in", "tellus", "integer", "feugiat", "scelerisque", "varius", "morbi", "enim", "nunc,", "faucibus", "a", "pellentesque", "sit", "amet,", "porttitor", "eget", "dolor", "morbi", "non", "arcu", "risus,", "quis", "varius", "quam", "quisque", "id", "diam", "vel", "quam", "elementum", "pulvinar", "etiam", "non", "quam", "lacus", "suspendisse", "faucibus", "interdum", "posuere", "lorem", "ipsum", "dolor", "sit", "amet,", "consectetur", "adipiscing", "elit", "duis", "tristique", "sollicitudin", "nibh", "sit", "amet", "commodo", "nulla", "facilisi",
"nullam", "vehicula", "ipsum", "a", "arcu", "cursus", "vitae", "congue", "mauris", "rhoncus", "aenean", "vel", "elit", "scelerisque", "mauris", "pellentesque", "pulvinar", "pellentesque", "habitant", "morbi", "tristique", "senectus", "et", "netus", "et", "malesuada", "fames", "ac", "turpis", "egestas", "maecenas", "pharetra", "convallis", "posuere", "morbi", "leo", "urna,", "molestie", "at", "elementum", "eu,", "facilisis", "sed", "odio", "morbi", "quis", "commodo", "odio", "aenean", "sed", "adipiscing", "diam", "donec", "adipiscing", "tristique", "risus", "nec", "feugiat", "in", "fermentum", "posuere", "urna", "nec", "tincidunt", "praesent", "semper", "feugiat", "nibh", "sed", "pulvinar", "proin", "gravida", "hendrerit", "lectus", "a", "molestie"
];
//random integer method.
Lorem.prototype.randomInt = function (min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
};
//text creator method with parameters: how many, what
Lorem.prototype.createText = function(count, type) {
switch (type) {
//paragraphs are loads of sentences.
case Lorem.TYPE.PARAGRAPH:
var paragraphs = new Array;
for (var i = 0; i < count; i++) {
var paragraphLength = this.randomInt(10, 20);
var paragraph = this.createText(paragraphLength, Lorem.TYPE.SENTENCE);
paragraphs.push('<p>'+paragraph+'</p>');
}
return paragraphs.join('\n');
break;
//sentences are loads of words.
case Lorem.TYPE.SENTENCE:
var sentences = new Array;
for (var i = 0; i < count; i++) {
var sentenceLength = this.randomInt(5, 10);
var words = this.createText(sentenceLength, Lorem.TYPE.WORD).split(' ');
words[0] = words[0].substr(0, 1).toUpperCase() + words[0].substr(1);
var sentence = words.join(' ');
sentences.push(sentence);
}
return (sentences.join('. ') + '.').replace(/(\.\,|\,\.)/g, '.');
break;
//words are words
case Lorem.TYPE.WORD:
var wordIndex = this.randomInt(0, Lorem.WORDS.length - count - 1);
return Lorem.WORDS.slice(wordIndex, wordIndex + count).join(' ').replace(/\.|\,/g, '');
break;
}
};
Lorem.prototype.createLorem = function(element) {
var lorem = new Array;
var count;
if (/\d+-\d+[psw]/.test(this.query)){
var range = this.query.replace(/[a-z]/,'').split("-");
count = Math.floor(Math.random() * parseInt(range[1])) + parseInt(range[0]);
}else{
count = parseInt(this.query);
}
if (/\d+p/.test(this.query)) {
var type = Lorem.TYPE.PARAGRAPH;
}
else if (/\d+s/.test(this.query)) {
var type = Lorem.TYPE.SENTENCE;
}
else if (/\d+w/.test(this.query)) {
var type = Lorem.TYPE.WORD;
}
lorem.push(this.createText(count, type));
lorem = lorem.join(' ');
if (element) {
if (this.type == Lorem.TEXT)
element.innerHTML += lorem;
else if (this.type == Lorem.IMAGE) {
//TODO: for now, using lorempixum.
var path = '';
var options = this.query.split(' ');
if (options[0] == 'gray') {
path += '/g';
options[0] = '';
}
if (element.getAttribute('width'))
path += '/' + element.getAttribute('width');
if (element.getAttribute('height'))
path += '/' + element.getAttribute('height');
path += '/' + options.join(' ').replace(/(^\s+|\s+$)/, '');
element.src = 'http://lorempixum.com'+path.replace(/\/\//, '/');
}
}
if (element == null)
return lorem;
};
//Register as jQuery
if (typeof jQuery != 'undefined') {
(function($) {
$.fn.lorem = function() {
$(this).each(function() {
var lorem = new Lorem;
lorem.type = $(this).is('img') ? Lorem.IMAGE : Lorem.TEXT;
//data-lorem can be taken with data function (thanks to http://forrst.com/people/webking)
lorem.query = $(this).data('lorem');
lorem.createLorem(this);
})
};
//If developer run this javascript, then we can run the lorem.js
$(document).ready(function() {
$('[data-lorem]').lorem();
});
})(jQuery);
}
})();

12
assets/js/navbar.js
View File

@ -1,12 +0,0 @@
(function () {
var navButton = document.getElementById("nav-menu-button"),
navUl = document.getElementsByClassName("nav-ul");
function toggleMobileMenu() {
navUl[0].style.transition = "max-height 0.5s";
navUl[0].classList.toggle("hide-ul");
}
navButton.onclick = toggleMobileMenu;
}());

38
assets/js/page.js Normal file
View File

@ -0,0 +1,38 @@
// hero resizer
function hero() {
jQuery('#hero').css({
width: jQuery(window).width(),
height: jQuery(window).height()
});
}
// Smooth Scroll 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);
target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
if (target.length) {
$('html, body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
// navbar - preload
(function navbar() {
// 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");
}
// navLink.onclick = toggleMobileMenu;
// navButton.onclick = toggleMobileMenu;
$('#nav-menu-button, nav a').click(toggleMobileMenu)
}());

13
assets/js/scroll.js
View File

@ -1,13 +0,0 @@
// requires jquery
$('a[href*="#"]:not([href="#"])').click(function () {
if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
if (target.length) {
$('html, body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});

65
config.toml
View File

@ -1,4 +1,4 @@
baseurl = ""
baseurl = "4005.kebler.net"
languageCode = "en-us"
title = "For Sale: 4005 Rock Way, Central Point, OR"
canonifyUrls = "true"
@ -7,44 +7,51 @@ publishDir = "dist"
[params]
custom_css = ["css/custom.css"]
# font = "Pridi" # a valid google font name, default Roboto
font = "Baloo" # 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" # default is to use the page title
font = "Baloo"
color = "green"
bg_color = "blue"
# text = "For Sale By Owner: 4005 Rock Way" # default is to use the page title
text_size="1" # unit is em, 1em is default
# font = "Ranga"
color = "white"
bg_color = "seagreen"
[params.intro]
# img = "intro.jpg"
[params.hero]
img = "../images/4005front.jpg" # default is images/hero.jpg, must provide the full path or url
# img_medium = "intro-medium.jpg" # min 1024
# img_small "intro-small.jpg"
# font = "Indie Flower" # a valid google font name, default Roboto
color = "purple"
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
headline = "For Sale"
# font_headline = "Lato" # a valid google font name, defaults to intro font
# color_headline = "red"
headline_color = "red"
# headline_size = "10"
subheadline = "4005 Rock Way"
# color_subheadline = "red"
# subheadline_color = "pink"
# subheadline_size = "1"
subsubheadline = "Central Point, Oregon"
# color_subsubheadline = "blue"
# subsubheadline_color = "brown"
# subsubheadline_size = "1"
lines = ["A Rambler Style House","Close to Schools"]
# color_lines = "blue"
divider = false
# lines_color = "purple"
lines_size = "1.5"
divider = true
divider_color = "seagreen"
# divider_thickness = "3"
# for background image in static/imgs
# put intro.jpg and intro-phone.jpg for background images.
# intro-phone.jpg should be suitable for small devices
# [params.sections]
# # font = "Lato"
# # font_headline = "Lato"
# [params.sections.odd]
# # color = ""
# # bg_color = ""
# [params.sections.even]
# # color = ""
# # bg_color = ""
[params.sections]
font = "Lato"
headline_font = "Lato"
headline_size = "3"
[params.sections.odd]
# color = ""
# bg_color = ""
[params.sections.even]
# color = ""
# bg_color = ""
[[params.social]]

6
content/about.md
View File

@ -6,4 +6,8 @@ title = "About This House"
link_text = "About"
anchor="about"
+++
This House was Built in 1977
{{% lorem 1s %}}
{{% lorem 1s %}}
{{% lorem 1s %}}
{{% lorem 1s %}}
{{% lorem 1s %}}

22
content/details.md
View File

@ -5,21 +5,7 @@ title = "Details"
link_text = "Details"
weight = 4
+++
* Item 1
* Item 2
* Item 3
* Item 1
* Item 2
* Item 3
* Item 1
* Item 2
* Item 3
* Item 1
* Item 2
* Item 3
* Item 1
* Item 2
* Item 3
* Item 1
* Item 2
* Item 3
* Man Cave
* Shop
* Shed
* Hot Tub

5
content/video.md
View File

@ -1,6 +1,7 @@
+++
draft = false
title = "Video"
title = "Video Walk Through"
weight = 3
link_text = "Video"
+++
video player here shortcode
{{% youtube ZhF0fkGRgSo %}}

9
layouts/partials/head/css.html
View File

@ -1,6 +1,7 @@
<!-- CSS External Libraries -->
<!-- Light Gallery-->
<link href="https://cdn.jsdelivr.net/g/lightgallery@1.3.9(css/lightgallery.min.css+css/lg-transitions.css)" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/lightgallery/1.3.9/css/lightgallery.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/lightgallery/1.3.9/css/lg-transitions.min.css" rel="stylesheet">
<!-- Site Base CSS -->
<link href="/css/page.css" rel="stylesheet">
@ -8,11 +9,11 @@
<!-- Site Navigation CSS -->
<link href="/css/navbar.css" rel="stylesheet">
<!-- configurable styles -->
{{ partial "head/styles.html" . }}
<!-- Photo Gallery Styling with thumbsup -->
<link href="/css/thumbsup.css" rel="stylesheet">
<!-- configurable styles -->
{{ partial "head/gallery.html" . }}
{{ partial "head/styles.html" . }}
<!-- Custom/Override CSS files -->
{{ range .Site.Params.custom_css }}

5
layouts/partials/head/fonts.html
View File

@ -10,16 +10,15 @@
<link href="http://fonts.googleapis.com/css?family={{ . }}:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
{{ end }}
<link href="http://fonts.googleapis.com/css?family={{ .font | default "Roboto" }}:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
{{ with .navbar.font }}
<link href="http://fonts.googleapis.com/css?family={{ . }}:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
{{ end }}
{{ with .intro.font }}
{{ with .hero.font }}
<link href="http://fonts.googleapis.com/css?family={{ . }}:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
{{ end }}
{{ with .intro.font_headline }}
{{ with .hero.font_headline }}
<link href="http://fonts.googleapis.com/css?family={{ . }}:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
{{ end }}

76
layouts/partials/head/styles.html
View File

@ -1,7 +1,7 @@
<!-- Configurable Styles partial to appear in head -->
<style>
{{ with .Site.Params.font }}
body,h1,h2,h3,h4,h5,h6 { font-family:{{ . }},Helvetica,Arial,sans-serif; }
html { font-family:{{ . }},Helvetica,Arial,sans-serif; }
{{ end }}
{{ with .Site.Params }}
@ -9,19 +9,87 @@
{{ with .navbar }}
{{ with .font }}
.navbar { font-family:{{ . }},Helvetica,Arial,sans-serif; }
#nav-logo, nav { font-family:{{ . }},Helvetica,Arial,sans-serif; }
{{ end }}
{{ with .bg_color }}
.navbar { background-color: {{ . }}; }
.nav-link:hover {color: {{ . }}; }
#nav-background, #nav-menu-button { background-color: {{ . }}; }
{{ end }}
{{ with .text_size }}
#nav-logo { font-size: {{ . }}em; }
{{ end }}
{{ with .color }}
.navbar-brand div a, .navbar-nav > li > a { color: {{ . }}; }
#nav-logo, .nav-link, #nav-menu-button { color: {{ . }}; }
.nav-link:hover { background-color: {{ . }}; }
{{ end }}
{{ end }} /* end navbar */
{{ with .hero }}
{{ with .img }}
#hero {background-image: url("{{ . }}");}
{{ end }}
{{ with .font }}
#hero .text { font-family:{{ . }},Helvetica,Arial,sans-serif;}
{{ end }}
{{ with .color }}
#hero .text { color: {{ . }}; }
{{ end }}
{{ with .font_headline }}
#hero h1, #hero h2, #hero h3 { font-family: "{{ . }}",Helvetica,Arial,sans-serif; }
{{ end }}
{{ with .headline_color }}
#hero h1 { color: {{ . }}; }
{{ end }}
{{ with .headline_size }}
#hero h1 { font-size: {{ . }}em; }
{{ end }}
{{ with .subheadline_color }}
#hero h2 { color: {{ . }}; }
{{ end }}
{{ with .subheadline_size }}
#hero h2 { font-size: {{ . }}em; }
{{ end }}
{{ with .subsubheadline_color }}
#hero h3 { color: {{ . }}; }
{{ end }}
{{ with .subsubheadline_size }}
#hero h3 { font-size: {{ . }}em; }
{{ end }}
{{ with .lines_color }}
#hero h4 { color: {{ . }}; }
{{ end }}
{{ with .lines_size }}
#hero h4 { font-size: {{ . }}em; }
{{ end }}
{{ with .divider_thickness }}
hr { border-width: {{ . }}px; }
{{ end }}
{{ with .divider_color }}
hr { border-top-color: {{ . }}; }
{{ end }}
{{ end }} /* end hero */
{{ end }}
</style>

9
layouts/partials/hero.html
View File

@ -1,12 +1,13 @@
<section class="hero">
<div class="background-image" ></div>
{{ with .Site.Params.intro }}
<section id="hero">
<div class="text" >
{{ with .Site.Params.hero }}
{{ with .headline }}<h1>{{ . }}</h1>{{ end }}
{{ with .subheadline }}<h2>{{ . }}</h2>{{ end }}
{{ with .subsubheadline }}<h3>{{ . }}</h3>{{ end }}
{{ with .divider }}<hr class="divider">{{ end }}
{{ with .divider }}<hr>{{ end }}
{{ range .lines }}
<h4> {{ . }}</h4>
{{ end }}
{{ end }}
</div>
</section>

10
layouts/partials/js.html
View File

@ -4,15 +4,15 @@
<!-- light gallery and modules/plugins -->
<script src="https://cdn.jsdelivr.net/g/lightgallery,lg-autoplay,lg-pager,lg-thumbnail,lg-video"></script>
<!-- Flex NavBar JavaScript -->
<script src="js/scroll.js"></script>
<!-- Flex NavBar JavaScript -->
<script src="js/navbar.js"></script>
<!-- All functions for page use -->
<script src="js/page.js"></script>
{{ if isset .Site.Params "googleAnalytics" }}
<script src="js/analytics.js"></script>
{{ end }}
<!-- development tools -->
<script src="js/lorem.js"></script>
<!-- Document Ready - Start -->
<script src="js/docready.js"></script>

5
layouts/partials/navbar.html
View File

@ -2,9 +2,8 @@
<div id="nav-background">
<div id="nav-container">
<header id="nav-header">
<h1><a href="#" id="nav-logo">{{ .Site.Params.navbar.text | default .Site.Title }}</a></h1>
<div id="nav-menu-button fa fa-bars">
</div>
<a href="#hero" id="nav-logo">{{ .Site.Params.navbar.text | default .Site.Title }}</a>
<div id="nav-menu-button"> <i class="fa fa-bars"></i></div>
</header>
<nav>
<ul class="nav-ul hide-ul">

11
layouts/partials/sections.html
View File

@ -1,16 +1,9 @@
<!-- Renders Section Based on Content -->
{{ $parity := "odd" }} {{ range $i, $e := .Data.Pages }}
<section id="{{ .File.BaseFileName }}" class="section-{{ if modBool $i 2 }}odd{{ else }}even{{ end }} text-center">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<br/>
<h2>{{ .Title }}</h2>
<br/>
<section id="{{ .File.BaseFileName }}" class="section-{{ if modBool $i 2 }}odd{{ else }}even{{ end }}">
<h1>{{ .Title }}</h1>
<div class="section-content">
{{ .Content }}
</div>
<br/>
</div>
</div>
</section>
{{ end }}

10
layouts/shortcodes/list.html Normal file
View File

@ -0,0 +1,10 @@
<div class="list">
<ul>
{{ range .Params }}
<li>
{{ . }}
</li>
{{ end }}
</ul>
</div>

8
layouts/shortcodes/lorem.html
View File

@ -1 +1,7 @@
<div data-lorem={{ index .Params 0 }}></div>
<!-- https://github.com/f/loremjs
shorcode parameter
2p = 2 paragraphs
5s = 5 sentences
6w = 6 words
1-6w = between 1 and 6 words -->
<div data-lorem={{ .Get 0 | default "2p" }}></div>

1
layouts/shortcodes/params.html
View File

@ -1 +0,0 @@
<div class={{ index .Params 0 }}>

3
layouts/shortcodes/youtube.html Normal file
View File

@ -0,0 +1,3 @@
<div class="videoplayer">
<iframe type="text/html" width="640" height="360" src="//www.youtube.com/embed/{{ index .Params 0 }}?autoplay=1" allowfullscreen frameborder="0"><br /></iframe>
</div>