iniital build bare bones

master
Kebler Network System Administrator 2021-10-30 07:52:57 -07:00
commit 72c7966f8e
30 changed files with 2215 additions and 0 deletions

21
archive/index.xml Normal file
View File

@ -0,0 +1,21 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Archives on GPCCA</title>
<link>https://www.gpccaor.org/archive/</link>
<description>Recent content in Archives on GPCCA</description>
<generator>Hugo -- gohugo.io</generator>
<language>en-us</language><atom:link href="https://www.gpccaor.org/archive/index.xml" rel="self" type="application/rss+xml" />
<item>
<title>Custom Home Section</title>
<link>https://www.gpccaor.org/archive/first/</link>
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
<guid>https://www.gpccaor.org/archive/first/</guid>
<description>This section is used like a hero but one can put anything here like a live cam
Can removed or hidden by deleting the file or uncommenting hidden = true in the front matter
Some examples:</description>
</item>
</channel>
</rss>

10
categories/index.xml Normal file
View File

@ -0,0 +1,10 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Categories on GPCCA</title>
<link>https://www.gpccaor.org/categories/</link>
<description>Recent content in Categories on GPCCA</description>
<generator>Hugo -- gohugo.io</generator>
<language>en-us</language><atom:link href="https://www.gpccaor.org/categories/index.xml" rel="self" type="application/rss+xml" />
</channel>
</rss>

216
css/base.css Normal file
View File

@ -0,0 +1,216 @@
/* resets */
*,
*::after,
*::before {
box-sizing: border-box;
margin: 0;
padding: 0;
border: 0;
}
/* regions */
body {
display: flex;
color: black;
background-color: white;
align-items: center;
font-family: 'Roboto', sans-serif;
font-size: 1.4rem;
flex-direction: column;
width: 100vw;
overflow-x: hidden;
/* 14px default before jquery scalling */
}
.section {
display: flex;
padding-top: 1em;
padding-bottom: 1em;
align-items: center;
flex-direction: column;
width: 100vw;
}
/* mobile first column */
.section__container {
display: flex;
width: 95%;
align-items: center;
flex-direction: column;
}
#footer {
min-height: 300px;
}
/* Typography */
body {
font-size: 12px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
text-align: center;
font-weight: bold;
line-height: 1.45;
}
h1 {
font-size: 2em;
}
h2 {
font-size: 1.5em;
}
h3 {
font-size: 1.17em;
}
h4 {
font-size: 1em;
}
h5 {
font-size: 0.83em;
}
h6 {
font-size: 0.67em;
}
p {
text-align: left;
font-size: 1em;
line-height: 1.2;
margin-bottom: 0.5em;
}
/* using ::before for list numbers and icons */
nav,
ul,
ol {
list-style: none;
}
a,
.clickable {
color:inherit;
outline: 0;
text-decoration: none;
cursor: pointer;
font-weight: bold;
/* font-style: italic;
filter: saturate(200%); */
}
a:hover,
.clickable:hover {
color: black;
filter: saturate(100%);
}
.btn {
padding: 0.3em;
color: white;
background-color: black;
border: 4px solid grey;
border-radius: 10px;
text-transform: uppercase;
font-weight: bold;
cursor: pointer;
}
img {
max-width: 95vw;
}
img.avatar {
object-fit: cover;
border-radius: 50%;
width: 100px;
height: 100px;
padding: 0.5em;
}
figure {
display: block;
padding: 1em;
}
figcaption {
display: block;
margin: 1em 0;
text-align: center;
font-style: italic;
orphans: 2;
}
/* divider */
hr {
width: 50%;
height: 0;
border-top-color: white;
border-bottom-color: rgba(0, 0, 0, 0.2);
border-width: 2px;
border-style: solid;
margin-top: 0.5em;
margin-bottom: 1em;
}
.flex-col-center {
display: flex;
align-items: center;
flex-direction: column;
}
.flex-col-left {
display: flex;
align-items: flex-start;
flex-direction: column;
}
.flex-row {
display: flex;
align-content: center;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
}
.text-center p {
text-align: center;
}
.text-left p {
text-align: left;
}
.text-right p {
text-align: right;
}
/* keeps in the DOM but moves from the page */
.invisible {
position: absolute;
left: -999em;
}
/*keeps in the same location and maintains it's layout space even though hidden*/
.hide {
visibility: hidden;
}
/*completely removes from DOM */
.remove {
display: none;
}

43
css/custom-responsive.css Normal file
View File

@ -0,0 +1,43 @@
/* mobile first in base and page css*/
/* small tablets */
@media only screen and (min-width: 600px) {
}
/*images width will be 95% of view port width until this pixel width with you can set */
@media only screen and (min-width: 450px) {
}
@media only screen and (min-device-width: 600px) and (max-device-width: 799px) {
}
/* tablets */
@media only screen and (min-width: 800px) {
}
@media only screen and (min-device-width: 800px) and (max-device-width: 1199px) {
}
/* desktop */
@media only screen and (min-width: 1200px) {
/*this left justifies the individual elements left*/
/*.section__content--hero {
align-items: flex-start;
}*/
/*this moves all the elements together left and down*/
/*.section--hero {
align-items: flex-start;
justify-content: flex-end;
}*/
}
@media only screen and (min-device-width: 1200px) and (max-device-width: 1800px) {
}
/* large */
@media screen and (min-width: 1800px) {
}

6
css/custom.css Normal file
View File

@ -0,0 +1,6 @@
.box--maps .embed--map {
padding: 5px;
background-color: black;
}

134
css/navbar.css Normal file
View File

@ -0,0 +1,134 @@
/* NAVIGATION BAR */
/* mobile first at <1000px */
.nav-bar {
display: flex;
flex-direction: column;
position: fixed;
top: 0;
left: 0;
z-index: 10000;
width: 100vw;
color: black;
background-color: white;
border-bottom: 1px solid grey;
font-weight: bold;
font-size: 2em;
padding-left: 1em;
padding-right: 1em;
}
.nav-bar__header {
display: flex;
flex-direction: row;
justify-content: flex-start;
align-content: center;
padding-top: 0.9em;
padding-bottom: 0.9em;
}
.nav-bar__logo {
padding-left: 10em;
}
.nav-bar__logo {
order: 2;
}
.nav-bar__draft {
padding-left: 1em;
color: red !important;
}
.nav-bar__draft {
order: 3;
}
.nav-bar__menu-button {
order: 1;
cursor: pointer;
}
.nav-bar__menu {
overflow-y: scroll;
max-height: 75vh;
padding-right: .5em;
}
.hide-menu {
height: 0;
}
.nav-bar__menu-item {
display: flex;
justify-content: center;
transition: 200ms;
border-top: 2px solid;
padding: .35em;
}
.nav-bar__menu-item > a {
flex-grow: 1;
text-align: center;
opacity: 1;
}
.nav-bar__menu-item:hover, .nav-bar__menu-item >a:hover {
background-color: white;
color: black;
}
/* bigger than small tablet */
@media only screen and (min-width: 1000px) {
.nav-bar {
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
font-size: 2.5em;
}
.nav-bar__menu {
display: flex;
overflow-y: hidden;
}
.hide-menu {
height: auto;
}
.nav-bar__menu {
display: flex;
justify-content: flex-end;
overflow-y: hidden;
overflow-x: auto;
}
.nav-bar__header {
padding-top: 0;
padding-bottom: 0;
}
.nav-bar__menu-item,
.nav-bar__logo,
.nav-bar__draft {
padding-left: 0.3em;
padding-right: 0.3em;
padding-top: 0.7em;
padding-bottom: 0.7em;
border-top: 0;
}
.nav-bar__menu-button {
display: none;
}
} /* end responsive */
/* full size */
@media screen and (min-width: 1400px) {
}

360
css/page.css Normal file
View File

@ -0,0 +1,360 @@
/* sections */
.section__headline {
text-align: center;
}
.section__content {
display: flex;
flex-direction: column;
align-items: center;
max-width: 95%;
}
.section__content ul {
display: flex;
flex-direction: column;
align-items: flex-start;
max-width: 85%;
padding-top: 0.3em;
padding-bottom: 1em;
padding-left: 0.5em;
padding-right: 0.5em;
}
.section__content li {
padding-bottom: 0.7em;
}
/* lists in section content */
.section__content li {
font-size: 1em;
list-style-type: none;
line-height: 1.1em;
}
.section__content ul,
.section__content ol {
margin-left: 2em;
list-style-position: inside;
padding-top: 0.5em;
}
.section__content ul > li::before {
font-family: FontAwesome;
content: "\f18e";
padding-right: 1.1em;
margin-left: -2em;
}
.section__content ol {
counter-reset: foo;
}
.section__content ol > li {
counter-increment: foo;
}
.section__content ol > li::before {
content: counter(foo) ".";
padding-right: 0.8em;
margin-left: -1.4em;
}
.section--odd {
color: white;
background-color: black;
}
.section--hero {
color: white;
background-color: grey;
}
.section--odd .btn {
color: black;
background-color: white;
text-transform: uppercase;
}
.section--footer {
color: white;
background-color: darkgrey;
min-height: 4000px;
}
/* modal */
.section--modal {
display: none;
color: white;
justify-content: center;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
}
.section__container--modal {
margin: 0.5em;
margin-top: 2em;
background-color: black;
color: white;
max-height: 85%;
border-radius: 1em;
width: auto;
padding-bottom: 1em;
border-style: solid;
border-width: medium;
}
.section__headline--modal {
padding-top: 0.5em;
position: relative;
width: 100%;
padding-right: 1.2em;
}
.section__headline--modal > h1 {
font-size: 1.2em;
}
.section__headline--modal > a[modal-close] {
position: absolute;
font-size: 1em;
top: 0.4em;
right: 0.4em;
}
.section__content--modal {
overflow-y: auto;
position: relative;
align-items: flex-start;
font-size: 0.9em;
padding: 1em;
}
/*fix for fucking google chrome pushing up overflow content */
.section__content--modal * {
flex-shrink: 0;
}
/* ----------------
Hero Section
---------------- */
.section--hero {
background-size: cover;
background-position: center;
display: flex;
align-items: center;
justify-content: center;
width: 100vw;
}
.section--hero .section-content--hero {
text-align: center;
line-height: 1;
}
/*mobile first*/
.section--hero h1,
.section--hero h2,
.section--hero h3,
.section--hero h4,
.section--hero h5,
.section--hero h6 {
line-height: 1;
}
/* ----------------
Components/Shortcodes Styling
---------------- */
/* box creates a flexbox wrapper, row default */
.box {
display: flex;
flex-flow: wrap;
align-content: center;
justify-content: center;
padding-left: 0.5em;
padding-right: 0.5em;
}
.box--embed {
flex-direction: column;
flex-wrap: nowrap;
padding-bottom: 0;
justify-content: center;
align-items: center;
}
.box--embed::before,
.box--image::before {
content: "";
height: 0.5em;
}
.box--embed::after,
.box--image::after {
content: "";
height: 0.5em;
}
.box--btn-bar {
padding-top: 0.5em;
padding-bottom: 0.5em;
}
.box--column {
flex-direction: column;
align-items: center;
}
.box__caption {
font-style: italic;
}
.box__title {
text-transform: capitalize;
font-weight: bold;
}
.box--headline {
}
.box--text {
}
.box--btn {
padding: 0.5em;
margin-bottom: 0.5em;
}
.box--btn-bar > .box--btn {
margin-right: 0.2em;
}
.btn__text {
align-self: center;
}
.btn__icon {
align-self: center;
padding-right: 0.2em;
}
.btn--large .btn__text,
.btn--large .btn__icon {
font-size: 3rem;
}
.btn--small .btn__text,
.btn--small .btn__icon {
font-size: 1rem;
}
.btn--circle {
border-radius: 50%;
padding: 0.5em;
}
.highlight {
font-size: 0.7em;
align-items: left;
color: red;
background-color: white;
padding: 0.5em;
border-color: black;
border-width: 3px;
border-radius: 1em;
}
.highlight > ul > li::before {
font-family: FontAwesome;
content: "\f054"; /* chevron-right */
padding-right: 1.1em;
margin-left: -2em;
}
.box--avatar > a {
opacity: 1;
}
.thumb--yt {
display: flex;
align-items: center;
justify-content: center;
background-repeat: no-repeat;
background-size: cover;
filter: brightness(0.8);
}
.thumb--yt:hover {
-webkit-filter: brightness(1);
cursor: pointer;
}
.thumb--yt > .play-button {
font-size: 3.5em;
color: red;
text-shadow: 3px 3px black;
}
.box__embed--disqus {
width: 90vw;
max-width: 800px;
}
.box__contact-info > * {
padding: 0.1em;
align-self: center;
}
.box__contact-info > * > * {
margin: 0.2em;
align-self: center;
}
/*turn off default bullets*/
.box--gallery {
list-style: none;
}
.box--gallery li,
.box--gallery__item {
padding: 0.2em;
}
/*turn off fontawesome bullets*/
.box--gallery li::before,
.box--gallery__item li::before {
display: none;
}
code {
font-size: 0.8em;
font-family: 'Roboto Mono', monospace;
background-color: black;
border-radius: 0.2em;
color: white;
padding-left: 0.2em;
padding-right: 0.2em;
padding-top: 0.05em;
padding-bottom: 0.07em;
overflow-x: scroll;
}
code.hljs {
font-size: 0.75em;
border-radius: 0.2em;
background-color: black;
color: white;
padding: 1em;
margin-bottom: 0.7em;
width: inherit;
max-width: 90vw;
border-style: solid;
border-width: 3px;
border-color: dimgrey;
}

62
css/responsive.css Normal file
View File

@ -0,0 +1,62 @@
/* mobile first in base and page css*/
/* small tablets */
@media only screen and (min-width: 600px) {
}
@media only screen and (min-device-width: 600px) and (max-device-width: 799px) {
}
/* tablets */
@media only screen and (min-width: 800px) {
.section__headline--modal > h1 {
font-size: 1.8em;
}
.section__headline--modal > a[modal-close] {
font-size: 1.2em;
}
}
@media only screen and (min-device-width: 800px) and (max-device-width: 1199px) {
.section--hero h1,
.section--hero h2,
.section--hero h3,
.section--hero h4,
.section--hero h5,
.section--hero h6 {
line-height: 1.1;
}
}
/* desktop */
@media only screen and (min-width: 1200px) {
.section__container {
max-width: 1200px;
}
/* help with centering content with hidden phone number */
.box__contact {
margin-left: 6em;
}
.section--hero h1,
.section--hero h2,
.section--hero h3,
.section--hero h4,
.section--hero h5,
.section--hero h6 {
line-height: inherit;
}
}
@media only screen and (min-device-width: 1200px) and (max-device-width: 1800px) {
/* Styles */
}
/* large */
@media screen and (min-width: 1800px) {
.section__container {
max-width: 1200px;
}
}

View File

@ -0,0 +1,6 @@
/* picture captions */
.lg-sub-html {
font-size: 2em;
font-weight: bold;
}

191
css/uci-shortcodes.css Normal file
View File

@ -0,0 +1,191 @@
/* ----------------
Components/Shortcodes Styling
---------------- */
/* box creates a flexbox wrapper, row default */
.box {
display: flex;
flex-flow: wrap;
align-content: center;
justify-content: center;
padding-left: 0.5em;
padding-right: 0.5em;
}
.box--embed {
flex-direction: column;
flex-wrap: nowrap;
padding-bottom: 0;
justify-content: center;
align-items: center;
}
.box--embed::before,
.box--image::before {
content: "";
height: 0.5em;
}
.box--embed::after,
.box--image::after {
content: "";
height: 0.5em;
}
.box--btn-bar {
padding-top: 0.5em;
padding-bottom: 0.5em;
}
.box--column {
flex-direction: column;
align-items: center;
}
.box__caption {
font-style: italic;
}
.box__title {
text-transform: capitalize;
font-weight: bold;
}
.box--headline {
}
.box--text {
}
.box--btn {
padding: 0.5em;
margin-bottom: 0.5em;
}
.box--btn-bar > .box--btn {
margin-right: 0.2em;
}
.btn__text {
align-self: center;
}
.btn__icon {
align-self: center;
padding-right: 0.2em;
}
.btn--large .btn__text,
.btn--large .btn__icon {
font-size: 3rem;
}
.btn--small .btn__text,
.btn--small .btn__icon {
font-size: 1rem;
}
.btn--circle {
border-radius: 50%;
padding: 0.5em;
}
.highlight {
font-size: 0.7em;
align-items: left;
color: red;
background-color: white;
padding: 0.5em;
border-color: black;
border-width: 3px;
border-radius: 1em;
}
.highlight > ul > li::before {
font-family: FontAwesome;
content: "\f054"; /* chevron-right */
padding-right: 1.1em;
margin-left: -2em;
}
.box--avatar > a {
opacity: 1;
}
.thumb--yt {
display: flex;
align-items: center;
justify-content: center;
background-repeat: no-repeat;
background-size: cover;
filter: brightness(0.8);
}
.thumb--yt:hover {
-webkit-filter: brightness(1);
cursor: pointer;
}
.thumb--yt > .play-button {
font-size: 3.5em;
color: red;
text-shadow: 3px 3px black;
}
.box__embed--disqus {
width: 90vw;
max-width: 800px;
}
.box__contact-info > * {
padding: 0.1em;
align-self: center;
}
.box__contact-info > * > * {
margin: 0.2em;
align-self: center;
}
/*turn off default bullets*/
.box--gallery {
list-style: none;
}
.box--gallery li,
.box--gallery__item {
padding: 0.2em;
}
/*turn off fontawesome bullets*/
.box--gallery li::before,
.box--gallery__item li::before {
display: none;
}
code {
font-size: 0.8em;
font-family: 'Roboto Mono', monospace;
background-color: black;
border-radius: 0.2em;
color: white;
padding-left: 0.2em;
padding-right: 0.2em;
padding-top: 0.05em;
padding-bottom: 0.07em;
overflow-x: scroll;
}
code.hljs {
font-size: 0.75em;
border-radius: 0.2em;
background-color: black;
color: white;
padding: 1em;
margin-bottom: 0.7em;
width: inherit;
max-width: 90vw;
border-style: solid;
border-width: 3px;
border-color: dimgrey;
}

BIN
files/latest-minutes.pdf Normal file

Binary file not shown.

BIN
images/city-park.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 MiB

BIN
images/community-center.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 399 KiB

BIN
images/strawberrys.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 MiB

452
index.html Normal file
View File

@ -0,0 +1,452 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="generator" content="Hugo 0.88.1" />
<title>GPCCA</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<meta http-equiv="Cache-Control" content="max-age= 3600" />
<base href="https://www.gpccaor.org/">
<link href="https://cdn.jsdelivr.net/fontawesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon" />
<link href="//fonts.googleapis.com/css?family=Roboto" rel="stylesheet" type="text/css">
<link href="//fonts.googleapis.com/css?family=Roboto+Mono" rel="stylesheet" type="text/css">
<link href="//fonts.googleapis.com/css?family=Open%20Sans" rel="stylesheet" type="text/css">
<link href="//fonts.googleapis.com/css?family=Roboto" rel="stylesheet" type="text/css">
<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">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.perfect-scrollbar/0.6.16/css/perfect-scrollbar.min.css" type="text/css" media="screen" />
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.10.0/styles/default.min.css">
<link href="/css/base.css" rel="stylesheet">
<link href="/css/page.css" rel="stylesheet">
<link href="/css/navbar.css" rel="stylesheet">
<link href="/css/responsive.css" rel="stylesheet">
<style>
body { font-family:Open Sans,Helvetica,Arial,sans-serif; }
.nav-bar__menu-item:hover, .nav-bar__menu-item >a:hover {color: #26ad60; }
.nav-bar, .section--footer { background-color: #26ad60; }
.nav-bar__logo,.nav-bar__logo:hover, .nav-bar__menu, .nav-bar__menu-button, .section--footer { color: #1f5e3a; }
.nav-bar__menu-item:hover, .nav-bar__menu-item >a:hover { background-color: #1f5e3a; }
#hero { color: red; }
#hero { background-color: #6fc695; }
#hero h1 { color: red; }
#hero h2 { color: red; }
#hero h3 { color: red; }
#hero h4 { color: red; }
#hero hr { border-top-color: red; }
#hero { background-image: url("https://www.gpccaor.org/images/city-park.jpg"); }
.section--odd, .section--even .btn {
color: #1f5e3a;
background-color: #6fc695;
}
.section--even, .section--odd .btn {
color: #6fc695;
background-color: #1f5e3a;
}
.section--footer {
color: green;
background-color: black;
}
</style>
<link rel="stylesheet" href="/css/uci-shortcodes-custom.css">
<link rel="stylesheet" href="/css/uci-shortcodes.css">
<link rel="stylesheet" href="/css/custom.css">
</head>
<body>
<div id="nav-bar" class="nav-bar">
<div class="nav-bar__header">
<a href="#hero" class="nav-bar__logo">
GPCCA
</a>
<div class="nav-bar__menu-button"> <i class="fa fa-bars"></i></div>
<div class="nav-bar__draft"></div>
</div>
<ul class="nav-bar__menu hide-menu">
<li >
<a class="nav-bar__menu-item" href="#about">
About
</a>
</li>
</ul>
</div>
<div class="nav-bar-spacer"></div>
<section id="hero" class="section section--hero">
<div class="section__container" >
<div class="section__content section__content--hero" >
<h1>Greater Prairie City Community Association</h1>
<h2>GPCCA</h2>
<hr>
<h4> Serving Prairie City</h4>
</div>
</div>
</section>
<main class="sections">
<section id="about" class="section section--about section--odd"
style="color:; background-color:;"
>
<div class="section__container">
<div class="section__headline section__headline--about">
<h1>The GPCCA</h1>
</div>
<div class="section__content section-content--about" >
</div>
</div>
</section>
<section id="footer" class="section section--footer section--even"
style="color:; background-color:;"
>
<div class="section__container">
<div class="section__headline section__headline--footer">
<h1></h1>
</div>
<div class="section__content section-content--footer" >
<div class="updated">
<p>site updated: October 29, 2021@8:08 pm</br>
status: initial development</br></p>
</div>
</div>
</div>
</section>
<div id="modal-test" class="section section--modal">
<div class="section__container section__container--modal">
<div class="section__headline section__headline--modal">
<h1>Example Modal</h1>
</div>
<div class="section__content section__content--modal" >
<p>Here is how you can add additional content to your page without having it take up space&hellip;use a modal!</p>
<p>To do that make a .md file in the <code>content/modals</code> directory.</p>
<p>Put any markdown content in it including shortcodes.</p>
<p>Then just link to it in a section markdown file using the link shortcode.</p>
<p><strong>example</strong></p>
<pre tabindex="0"><code>{{&lt; link url=&quot;#modal-test&quot; text=&quot;A test modal&quot; type=&quot;btn&quot; display=&quot;modal&quot; &gt;}}
</code></pre><p>where there is a file <code>test.md</code> in the <code>content/modals directory</code></p>
<p>and the url is `url=&quot;#modal-&lt;modal file name without .md&gt;&quot;``</p>
</div>
</div>
</div>
<div id="modal-map" class="section section--modal">
<div class="section__container section__container--modal">
<div class="section__headline section__headline--modal">
<h1>More Markdown</h1>
</div>
<div class="section__content section__content--modal" style="align-items: center;" >
<h3 id="and-now-for-the-rest-of-the-show">And now for the rest of the show</h3>
<div class="box ">
<div class="box box--column ">
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
</ul>
</div>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-markdown" data-lang="markdown"><span style="color:#66d9ef">*</span> One
<span style="color:#66d9ef">*</span> Two
<span style="color:#66d9ef">*</span> Three
</code></pre></div></div>
<hr>
<div class="box ">
<div class="box box--column ">
<ol>
<li>Buy flour and salt</li>
<li>Mix together with water</li>
<li>Bake</li>
</ol>
</div>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-markdown" data-lang="markdown"><span style="color:#66d9ef">1.</span> Buy flour and salt
<span style="color:#66d9ef">1.</span> Mix together with water
<span style="color:#66d9ef">1.</span> Bake
</code></pre></div></div>
<hr>
<p>Monspaced Font Box:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-markdown" data-lang="markdown">Monospaced type box primarily for showing code
Indent three or enclose in```
</code></pre></div><p>or put it <code>inline</code> like this</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-markdown" data-lang="markdown">or put it <span style="color:#e6db74">`inline`</span> like this
</code></pre></div><hr>
<p>a separator line <br>
* * *</p>
<hr>
<p>This is <a href="http://example.com" title="example">an example</a> simple markdown link.</p>
<p><a href="http://example.com">This link</a> has no title attr.</p>
<p>This is [an example] <a href="http://example.com" title="Optional Title">someid</a> reference-style link.</p>
<pre><code>This is [an example](http://example.com &quot;Example&quot;) link.
[This link](http://example.com) has no title attr.
This is [an example] [id] reference-style link.
[id]: http://example.com &quot;Optional Title&quot;
</code></pre>
<p>Use the link plugin shortcode for doing more fancy things.</p>
<a
class="box box--btn btn btn--regular"
href="javascript:void( window.open('https://dkebler.github.io/landingpage-guide', 'blank', 'scrollbars=yes, toolbar=no, width=1000 ' ))">
<i class="btn__icon fa fa-space-shuttle"></i>
<div class="btn__text">A Button Styled Link with icon opens in window</div>
</a>
<hr>
<p>You can put images from external sources in this way</p>
<p><img src="http://placehold.it/200x50" alt="Alt Text" title="Image Title"></p>
<pre><code>![Alt Text](http://placehold.it/200x50 &quot;Image Title&quot;)
</code></pre>
<p>but it&rsquo;s probably better to use the plugin shortcode for your images</p>
<div class="box box--column box--image
"
style="
"
>
<div class="box__title">Where I Want To Be</div>
<a href="/images/green-landscape.jpg" target="_blank" >
<img
style="
"
src="/images/green-landscape.jpg" />
</a>
<div class="box__caption">Sure is Green</div>
</div>
<pre tabindex="0"><code>{{&lt; image filename=&quot;green-landscape.jpg&quot; title=&quot;Where I Want To Be&quot; caption=&quot;Sure is Green&quot; &gt;}}
</code></pre>
</div>
</div>
</div>
</main>
<script src="https://cdn.jsdelivr.net/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/g/lightgallery,lg-autoplay,lg-pager,lg-thumbnail,lg-video"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.perfect-scrollbar/0.6.16/js/perfect-scrollbar.jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.10.0/highlight.min.js"></script>
<script src="/js/util.js"></script>
<script src="/js/fitToWindow.js"></script>
<script src="/js/flowType.js"></script>
<script src="/js/youtube.js"></script>
<script src="/js/page.js"></script>
<script src="/js/docready.js"></script>
<script>
$(document).ready(function () {
lightgallery('#photos')
});
</script>
<script>
$(document).ready(function () {
lightgallery('.box--image-lightbox')
});
</script>
</body>
</html>

65
index.xml Normal file
View File

@ -0,0 +1,65 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>GPCCA</title>
<link>https://www.gpccaor.org/</link>
<description>Recent content on GPCCA</description>
<generator>Hugo -- gohugo.io</generator>
<language>en-us</language><atom:link href="https://www.gpccaor.org/index.xml" rel="self" type="application/rss+xml" />
<item>
<title>Custom Home Section</title>
<link>https://www.gpccaor.org/archive/first/</link>
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
<guid>https://www.gpccaor.org/archive/first/</guid>
<description>This section is used like a hero but one can put anything here like a live cam
Can removed or hidden by deleting the file or uncommenting hidden = true in the front matter
Some examples:</description>
</item>
<item>
<title>The GPCCA</title>
<link>https://www.gpccaor.org/sections/about/</link>
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
<guid>https://www.gpccaor.org/sections/about/</guid>
<description></description>
</item>
<item>
<title></title>
<link>https://www.gpccaor.org/sections/footer/</link>
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
<guid>https://www.gpccaor.org/sections/footer/</guid>
<description>site updated: October 29, 2021@8:08 pm status: initial development
</description>
</item>
<item>
<title>Example Modal</title>
<link>https://www.gpccaor.org/modals/test/</link>
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
<guid>https://www.gpccaor.org/modals/test/</guid>
<description>Here is how you can add additional content to your page without having it take up space&amp;hellip;use a modal!
To do that make a .md file in the content/modals directory.
Put any markdown content in it including shortcodes.
Then just link to it in a section markdown file using the link shortcode.
example
{{&amp;lt; link url=&amp;quot;#modal-test&amp;quot; text=&amp;quot;A test modal&amp;quot; type=&amp;quot;btn&amp;quot; display=&amp;quot;modal&amp;quot; &amp;gt;}} where there is a file test.md in the content/modals directory</description>
</item>
<item>
<title>More Markdown</title>
<link>https://www.gpccaor.org/modals/map/</link>
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
<guid>https://www.gpccaor.org/modals/map/</guid>
<description>And now for the rest of the show One Two Three * One * Two * Three Buy flour and salt Mix together with water Bake 1. Buy flour and salt 1. Mix together with water 1. Bake Monspaced Font Box:
Monospaced type box primarily for showing code Indent three or enclose in``` or put it inline like this
or put it `inline` like this a separator line * * *</description>
</item>
</channel>
</rss>

15
js/analytics.js Normal file
View File

@ -0,0 +1,15 @@
(function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r;
i[r] = i[r] || function () {
(i[r].q = i[r].q || []).push(arguments)
}, i[r].l = 1 * new
Date();
a = s.createElement(o),
m = s.getElementsByTagName(o)[0];
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m)
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
ga('create', '{{ .Site.Params.googleAnalytics }}', 'auto');
ga('send', 'pageview');

0
js/custom-docready.js Normal file
View File

3
js/custom.js Normal file
View File

@ -0,0 +1,3 @@
function nothing() {
return false;
}

31
js/docready.js Normal file
View File

@ -0,0 +1,31 @@
// TODO register these individually with window resize use self callled function
function resizeElements() {
navbarSpacer();
$('.box--embed iframe').fitToWindow()
$('.box--image img').fitToWindow()
heroResize();
typeResize(); // for section content
$('.section__content--modal').perfectScrollbar('update');
$('.nav-bar__menu').perfectScrollbar('update');
$('.code').perfectScrollbar('update');
};
function initialize() {
hljs.initHighlightingOnLoad();
$('.section__content--modal').perfectScrollbar();
$('.nav-bar__menu').perfectScrollbar();
$('code').perfectScrollbar('update');
resizeElements()
};
initialize();
// requires jquery
$(document).ready(function () {
// bind resize events
$(window).resize(function () {
resizeElements()
});
});

98
js/fitToWindow.js Normal file
View File

@ -0,0 +1,98 @@
/*!
* adapted from
* https://github.com/drewbaker/fitToParent
*/
(function ($) {
$.fn.fitToWindow = function (maxWidth, wPad) {
// console.log("in fit to Window")
// if more than one element
this.each(function () {
let $el = $(this);
// console.log(`element ${$el.prop("tagName")} ${$el.attr("class")} parent ${$el.parent().attr('class')}`)
// console.log(`before ${maxWidth} ${wPad} ${$el.data('maxWidth')} ${$el.data('wPad')}`)
var mw = $el.parent().attr('maxWidth');
maxWidth = mw ? mw : maxWidth
maxWidth = (maxWidth || $el.data('maxWidth')) || 450
var wp = $el.parent().attr('wPad');
wPad = wp ? wp : wPad
wPad = (wPad || $el.data('wPad')) || 5
let windowWidth = $(window).width()
let newWidth = (windowWidth > maxWidth) ? maxWidth : windowWidth - 2 * wPad
// console.log(`after ${maxWidth} ${wPad} ${newWidth}`)
// Initial Aspect given in attributes by element itself
let setWidth = $el.attr('width');
let setHeight = $el.attr('height');
if (!setWidth || !setHeight) {
setWidth = $el.width();
setHeight = $el.height();
}
// retrieve aspect ratio for element if none then set (first time)
var aspect = $el.data('aspect');
if (!aspect) {
aspect = setWidth / setHeight;
$el.data('aspect', aspect);
// console.log(`aspect set ${aspect} = ${$el.data('aspect')}`)
$el.data('maxWidth', maxWidth)
$el.data('wPad', wPad)
// console.log(`values set ${maxWidth} = ${$el.data('maxWidth')} ${wPad} = ${$el.data('wPad')}`)
// console.log("REGISTERING RESIZE")
$(window).resize({ el: $el }, function (event) {
event.data.el.fitToWindow()
})
}
newHeight = (newWidth / aspect);
// TODO conform to enclosing .box with max-height set
// need to detect wrap so adjustement can be made
// http://stackoverflow.com/questions/40012428/how-to-detect-css-flex-wrap-event
// var maxParentHeight = parseInt($el.parents('.box').filter(function () {
// // var mel = $(this).attr('class');
// // var mxh = $(this).css('max-height')
// // console.log(`${mel} ${mxh}`)
// return $(this).css("max-height") != "none"
// }).first().css('max-height'))
//
// console.log(`max-height of parent ${maxParentHeight}`)
//
// if (maxParentHeight) {
// newHeight = maxParentHeight;
// newWidth = (newHeight * aspect);
// }
// console.log(`new width and height before setting ${newWidth} ${newHeight}`)
// Set new size of element
$el.width(newWidth);
$el.height(newHeight);
});
}
}(jQuery));
// one time fit a element based on selector to the window
let fitToWindow = function (sel) {
if (sel) {
$(sel).fitToWindow()
} else { Alert("no selector provided for resize event to call fitToWindow") }
}
// register a selector to be fitted to window on window resize
let onResizeFitToWindow = function (sel) {
if (sel) {
$(window).resize(function () {
$(sel).fitToWindow()
})
} else { Alert("no selector provided for resize event to call fitToWindow") }
}

36
js/flowType.js Normal file
View File

@ -0,0 +1,36 @@
/*
* Adapted from FlowType.JS v1.1
* Copyright 2013-2014, Simple Focus http://simplefocus.com/
*
*/
$.fn.flowtype = function (options) {
// Establish default settings/variables
// ====================================
var settings = $.extend({
maximum: 9999,
minimum: 1,
maxFont: 9999,
minFont: 1,
fontRatio: 35
}, options),
// the magic math
// =================
resize = function (el) {
var $el = $(el),
elw = $el.width(),
width = elw > settings.maximum ? settings.maximum : elw < settings.minimum ? settings.minimum : elw,
fontBase = width / settings.fontRatio,
fontSize = fontBase > settings.maxFont ? settings.maxFont : fontBase < settings.minFont ? settings.minFont : fontBase;
$el.css('font-size', fontSize + 'px');
};
// Make the magic visible
// ======================
this.each(function () {
// resize text in each element
resize(this);
});
};

141
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);
}
})();

168
js/page.js Normal file
View File

@ -0,0 +1,168 @@
// Smooth Scroll Init - Register click handler for ID anchors
$('a[href*="#"]:not(a[modal])').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) {
var targetOffset = target.offset().top - $(".nav-bar__header").outerHeight(true);
// console.log(targetOffset, target.offset().top, $(".nav-bar__header").outerHeight())
$('html, body').animate({
scrollTop: targetOffset
}, 1000);
return false;
}
}
});
// navbar mobile toggle - preload
(function navbarInit() {
function toggleMobileMenu() {
$('.nav-bar__menu')[0].style.transition = "max-height 0.5s";
$('.nav-bar__menu')[0].classList.toggle("hide-menu");
}
function hideMobileMenu() {
$('.nav-bar__menu')[0].style.transition = "max-height 0.5s";
$('.nav-bar__menu')[0].classList.add("hide-menu");
}
$('.nav-bar__menu-button, .nav-bar__menu, .nav-bar__menu-item').click(toggleMobileMenu)
$("main").click(hideMobileMenu)
}());
// using an image for phone and toggle hide it
$('#cell').click(function () { $('#cell-number').toggleClass("hide"); });
// $('#phone').click(function () { alert('phone clicked'); return false; });
function navbarSpacer() {
$('.nav-bar-spacer').css({
height: $(".nav-bar__header").outerHeight(true),
});
}
// hero resizer
function heroResize(bfr = 30) {
var h = $(window).height() - $(".nav-bar__header").outerHeight(true),
w = $(window).width(),
fr = bfr * h / w
// console.log('w,h,fr', w, h, fr)
// minimum base font ratio
fr = (fr > bfr) ? bfr : fr
// adjust for short viewport height
fr = (w / h > 1 && h < 700) ? 30 * w / h : fr
//console.log('fr after', fr)
$('#hero').css({
width: w + 15,
height: h / w > 1.5 ? w * 1.5 : h,
});
var mf = w / h > 1 ? 0 : 12
$('#hero').flowtype({
maxFont: 30,
minFont: mf,
fontRatio: fr
});
}
function typeResize(fr = 20) {
$('main:not(#hero)').flowtype({
// maximum: 1000,
minFont: 12,
maxFont: 25,
fontRatio: fr
})
}
// Lightbox for Gallery
function lightgallery(id) {
// Intialize all the media i.e. photos with "media" id
// TODO use Hugo params to initialize multiple galleries/albums
var lg = $(id).lightGallery({
thumbnail: true,
thumbWidth: 80,
controls: true,
loop: false,
download: false,
counter: true,
// videojs: true
});
lg.on('onBeforeOpen.lg', function (event) {
$('.nav-bar').css("display", "none")
});
lg.on('onCloseAfter.lg', function (event) {
$('.nav-bar').css("display", "flex")
});
}
// Modal tool. Must use modal template for content
(function ($) {
// extend jquery so remove handlers can be added and removed at the right time in a group
$.fn.modalHandlers = function (state = 'on') {
if (state === 'on') {
$(document).on('click', modalClickOutside);
$(document).keypress(modalEsc);
this.find('a[modal-close]').on('click', modalClickCloser);
return this
}
if (state === 'off') {
$(document).off('click', modalClickOutside);
$(document).off('keypress', modalEsc);
this.find('a[modal-close]').off('click', modalClickCloser);
return this
}
return false;
};
// modal event handlers - add more if you want - add them to extension above
function modalEsc(event) {
if (event.key === "Escape") { modalHide() }
}
function modalClickOutside(event) {
var container = $(".section__container--modal");
if (!container.is(event.target) && // If the target of the click isn't the container...
container.has(event.target).length === 0) // ... nor a descendant of the container
{ modalHide(); }
}
function modalClickCloser(event) {
modalHide();
}
// modal show and hide
function modalShow(modal_hash) {
var closer = "<a modal-close class='fa-stack fa-2x' ><i class='fa fa-circle-thin fa-stack-2x'></i><i class='fa fa-close fa-stack-1x'></i></a>"
$(modal_hash).find('.section__headline').append(closer).end().modalHandlers().addClass("current").css('display', 'flex');
}
function modalHide() {
$('.section--modal.current').hide().modalHandlers("off").removeClass("current").find('a[modal-close]').remove;
}
// Register click event for all modal links on page
$("a[modal]").click(function () {
if (location.pathname.replace(/\/$/, "") == this.pathname.replace(/\/$/, "") && location.hostname == this.hostname) {
var target = this.hash;
modalShow(target);
} else {
alert(`modal display of off page content not supported`);
}
return false;
});
}(jQuery));
// end modal

6
js/util.js Normal file
View File

@ -0,0 +1,6 @@
function isMobile(a) {
return (/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a) || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0, 4)));
}
// Call is
// isMobile(navigator.userAgent || navigator.vendor || window.opera)

50
js/youtube.js Normal file
View File

@ -0,0 +1,50 @@
(function ($) {
$(document).bind("DOMContentLoaded",
function () {
var playBtn = '<i class="fa fa-play-circle-o play-button"></i>'
$('div[youtube_id]').each(function () {
if ($(this).attr('nothumb') !== "yes") {
var vid = $(this).attr('youtube_id');
var bgi = `style="background-image: url(https://i.ytimg.com/vi/${vid}/mqdefault.jpg)"`
var thumb = `<div class="thumb--yt" ${bgi} width="560" height="315">`
$(this).append(thumb).children().append(playBtn).click(insertIframe).fitToWindow()
} else { // if image thumbs turned off
insertIframe.call(this)
}
})
})
function insertIframe() {
var $box = $(this).parent()
var id = $box.attr('youtube_id')
var autoplay = "autoplay=1&"
if (!id) { // image thumb is off not called by thumb so don't need parent
$box = $(this)
id = $box.attr('youtube_id')
autoplay = ""
}
var mw = $box.attr('maxWidth');
var wp = $box.attr('wPad');
var start = $box.attr("start") || 1
if ($box.attr("end")) { var end = "&end=" + $box.attr("end") } else { var end = "" }
var list = ""
if ($box.attr("list")) { list = `&list=${$box.attr("list")}` }
var url = `https://www.youtube.com/embed/${id}?${autoplay}start=${start}${end}`
var vIframe = `<iframe width = "560" height = "315" src ="${url}${list}" frameborder = "0" allowfullscreen></iframe>`
$box.html(vIframe).children().fitToWindow($box.data("maxWidth") || mw, $box.data("wPad") || wp)
}
}(jQuery));
// TODO grab the video title as well as the thumb for use in thumb display
// only works if server allows cross domain like s3
//http://stackoverflow.com/questions/1760231/how-do-i-get-the-title-of-a-youtube-video-if-i-have-the-video-id
// #var ytApiKey = "...";
// #var videoId = "ylLzyHk54Z0";
// #$.get("https://www.googleapis.com/youtube/v3/videos?part=snippet&id=" + videoId + "&key=" + ytApiKey, function(data) {
// #alert(data.items[0].snippet.title);
// # });

35
modals/index.xml Normal file
View File

@ -0,0 +1,35 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Modals on GPCCA</title>
<link>https://www.gpccaor.org/modals/</link>
<description>Recent content in Modals on GPCCA</description>
<generator>Hugo -- gohugo.io</generator>
<language>en-us</language><atom:link href="https://www.gpccaor.org/modals/index.xml" rel="self" type="application/rss+xml" />
<item>
<title>Example Modal</title>
<link>https://www.gpccaor.org/modals/test/</link>
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
<guid>https://www.gpccaor.org/modals/test/</guid>
<description>Here is how you can add additional content to your page without having it take up space&amp;hellip;use a modal!
To do that make a .md file in the content/modals directory.
Put any markdown content in it including shortcodes.
Then just link to it in a section markdown file using the link shortcode.
example
{{&amp;lt; link url=&amp;quot;#modal-test&amp;quot; text=&amp;quot;A test modal&amp;quot; type=&amp;quot;btn&amp;quot; display=&amp;quot;modal&amp;quot; &amp;gt;}} where there is a file test.md in the content/modals directory</description>
</item>
<item>
<title>More Markdown</title>
<link>https://www.gpccaor.org/modals/map/</link>
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
<guid>https://www.gpccaor.org/modals/map/</guid>
<description>And now for the rest of the show One Two Three * One * Two * Three Buy flour and salt Mix together with water Bake 1. Buy flour and salt 1. Mix together with water 1. Bake Monspaced Font Box:
Monospaced type box primarily for showing code Indent three or enclose in``` or put it inline like this
or put it `inline` like this a separator line * * *</description>
</item>
</channel>
</rss>

29
sections/index.xml Normal file
View File

@ -0,0 +1,29 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Sections on GPCCA</title>
<link>https://www.gpccaor.org/sections/</link>
<description>Recent content in Sections on GPCCA</description>
<generator>Hugo -- gohugo.io</generator>
<language>en-us</language><atom:link href="https://www.gpccaor.org/sections/index.xml" rel="self" type="application/rss+xml" />
<item>
<title>The GPCCA</title>
<link>https://www.gpccaor.org/sections/about/</link>
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
<guid>https://www.gpccaor.org/sections/about/</guid>
<description></description>
</item>
<item>
<title></title>
<link>https://www.gpccaor.org/sections/footer/</link>
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
<guid>https://www.gpccaor.org/sections/footer/</guid>
<description>site updated: October 29, 2021@8:08 pm status: initial development
</description>
</item>
</channel>
</rss>

27
sitemap.xml Normal file
View File

@ -0,0 +1,27 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:xhtml="http://www.w3.org/1999/xhtml">
<url>
<loc>https://www.gpccaor.org/archive/first/</loc>
</url><url>
<loc>https://www.gpccaor.org/sections/about/</loc>
</url><url>
<loc>https://www.gpccaor.org/sections/footer/</loc>
</url><url>
<loc>https://www.gpccaor.org/archive/</loc>
</url><url>
<loc>https://www.gpccaor.org/categories/</loc>
</url><url>
<loc>https://www.gpccaor.org/modals/test/</loc>
</url><url>
<loc>https://www.gpccaor.org/</loc>
</url><url>
<loc>https://www.gpccaor.org/modals/</loc>
</url><url>
<loc>https://www.gpccaor.org/modals/map/</loc>
</url><url>
<loc>https://www.gpccaor.org/sections/</loc>
</url><url>
<loc>https://www.gpccaor.org/tags/</loc>
</url>
</urlset>

10
tags/index.xml Normal file
View File

@ -0,0 +1,10 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Tags on GPCCA</title>
<link>https://www.gpccaor.org/tags/</link>
<description>Recent content in Tags on GPCCA</description>
<generator>Hugo -- gohugo.io</generator>
<language>en-us</language><atom:link href="https://www.gpccaor.org/tags/index.xml" rel="self" type="application/rss+xml" />
</channel>
</rss>