Instantly share code, notes, and snippets.

@diiocko /Javascript Secret
Last active Aug 9, 2018

Embed
What would you like to do?
CHoP Overlay Login
$(window).init(function() {
$('.co-reminder-header-title').text('Next Live Event');
});
app.on('event:live', function(){
$('.co-chat-tab').trigger('click');
});
app.on('event:loaded', function() {
if (window.current_user) {
$('.content').show();
$('.login_wrapper').hide();
} else {
$('.login_wrapper').show();
}
});
(function(doc,found) {
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
var yourdiv = doc.querySelector(".login-links_wrapper .co-sign-in-button");
if(found && !yourdiv){
// Was there but is gone, do something
$('.content').show();
$('.login_wrapper').hide();
found = false;
}
if(yourdiv){
// Found it, do something
found = true;
}
});
});
observer.observe(doc, { childList: true, subtree: true });
})(document,false);
window.reflowWidgetTabs = function() {
var container, index, items, newTabs, tabContainer, tabs, reflowTabs, willOverflow;
container = $(".more-widgets");
tabContainer = $(".co-widget-tabs");
reflowTabs = [];
container.find("ul li").detach().appendTo(tabContainer);
container.hide().find("ul").remove();
tabContainer.removeClass('has-more-widgets');
tabContainer.find('li').each(function(){ if(this.offsetTop > 0) { willOverflow = true; } });
if( willOverflow ){ tabContainer.addClass('has-more-widgets'); }
tabContainer.find('li').each(function(){
if(this.offsetTop > 0) {
reflowTabs.push(this);
}
});
if (reflowTabs.length > 0) {
newTabs = $("<ul>").append(reflowTabs);
container.show().append(newTabs);
}
};
var lazyReflow = _.debounce(reflowWidgetTabs, 300);
$(window).resize(lazyReflow)
$(function(){ setTimeout(function(){ reflowWidgetTabs(); }, 0); });
app.on('private-chat:add private-chat:remove', function(){ reflowWidgetTabs(); });
console.log( app );
$('.ec-playlists:not(.ec-playlists--live) .playlist').click(function() {
var $iframe = $('<iframe frameborder="0" height="416" width="680" seamless="seamless" allowfullscreen>');
$iframe.attr('src', $(this).data('video-url') );
$('.co-video-player').empty().append( $iframe );
$('html,body').animate({
scrollTop: $('.content').offset().top
}, 1000);
});
console.log( $('.co-reminder-header-title') );
var $interval = window.setInterval( function() {
if( $( '.co-reminder-header-title' ).length > 0 ) {
window.clearInterval( $interval );
}
}, 50);
function setScrimTextMargin() {
$('.ec-scrim-text').each(function() {
$(this).css('margin-top', '-' + ( $(this).height() / 2 ) + 'px' );
});
}
$(window).resize( setScrimTextMargin );
setScrimTextMargin();
//var firstTimeModal = $('[data-remodal-id="modal"]').remodal();
// if the user is arriving for the first time
//if( Cookies.get('firstTime') != 'true' ) {
// firstTimeModal.open();
// Cookies.set('firstTime', 'true');
// }
body {
background: #efefef; }
a {
color: #64b4f2; }
a:hover {
color: white; }
.row {
max-width: 90rem; }
table {
border: none; }
table tr th,
table tr td {
padding: 5px; }
#fixed-page-header {
display: none; }
.content {
display: none; }
.login_wrapper {
padding: 4em 2em;
min-height: 90vh;
background-image: url("https://thechurchco-production.s3.amazonaws.com/uploads/sites/570/2018/07/VFC-SIGNUP-BG.jpg");
background-position: center;
background-repeat: no-repeat;
background-size: cover;
text-align: center; }
img#overlay-icon {
max-width: 30%;
margin-bottom: 1em; }
.login_wrapper h2 {
color: white;
font-weight: 700;
margin-bottom: 1em;
font-size: 22px; }
.login-links_wrapper {
text-align: center; }
.login-links_wrapper .button {
font-family: 'bebas';
text-transform: uppercase; }
.login-links_wrapper #signup {
background-color: #00adef;
margin-bottom: 1em;
border-radius: 30px;
}
.login-links_wrapper #signup:hover {
background-color: #242424; }
.login-links_wrapper #login {
font-family: 'bebas';
text-transform: uppercase;
color: white;
font-weight: 300;
font-size: 12px; }
.login-links_wrapper #login:hover {
color: #eee; }
.co-tab-notification:before {
top: 4px;
left: 2px; }
.more-widgets {
position: absolute;
bottom: 0;
right: 0;
width: 36px;
height: 36px;
line-height: 36px;
text-align: center;
color: #9c9c9f; }
.more-widgets:hover {
color: #9c9c9f;
background-color: #f9f9f9; }
.more-widgets:hover ul {
display: block; }
.more-widgets ul {
display: none;
position: absolute;
bottom: 36px;
right: 0px;
z-index: 1000;
background: #f9f9f9;
list-style: none;
margin: 0; }
.more-widgets ul li {
padding: 7px 13px;
color: #9c9c9f;
cursor: pointer; }
.more-widgets ul li:hover {
background: #f9f9f9; }
.full-width {
width: 100%;
margin-left: auto;
margin-right: auto;
max-width: none; }
.no-padding-right {
padding-right: 0px; }
.no-padding-left {
padding-left: 0px; }
/* TOP BAR */
header {
background-color: #242424;
}
.navigation .top-bar {
margin: 0px; }
.top-bar-section ul {
margin-top: 7px; }
.top-bar-section ul li {
background: none; }
.top-bar-section li:not(.has-form) a:not(.button) {
line-height: 26px;
padding: 0px;
margin: 5px 20px 5px 0;
color: white !important; }
.top-bar-section li.link:not(.has-form) a:not(.button):hover, .top-bar-section ul li.link:hover a, .top-bar-section ul li.link:hover {
background: none !important;
color: #00adef !important; }
.top-bar input, .top-bar .button, .top-bar button {
top: 1px; }
.top-bar-section ul li > a.button {
background: #00adef;
color: #ffffff; }
.top-bar-section ul li > a.button:hover {
background: #242424; }
.nav-margin {
margin: 20px 0px; }
.top-bar .name h1 {
font-size: 22px;
color: #000000; }
.top-bar .name img {
max-height: 50px; }
.box {
border-radius: 2px; }
.transparent-box {
border: 1px solid #a5a6aa; }
.top-bar-section ul li.colored-box {
background-color: #64b4f2; }
.top-bar-section li.colored-box:not(.has-form) a:not(.button) {
color: #000000; }
.top-bar-section ul li > a {
font-size: 12px;
font-family: bebas, sans-serif;
text-transform: uppercase;
letter-spacing: 0.10em; }
.top-bar-section ul.co-account-dropdown li:not(.has-form) a:not(.button) {
padding: 0 15px;
line-height: 45px;
background: rgba(0, 0, 0, 0);
color: white !important; }
#give {
color: #00adef !important; }
#give:hover {
color: white !important; }
@media (min-width: 768px) {
.top-bar-section ul li > a {
font-size: 14px;
letter-spacing: 0.14285714285714em; }
.login_wrapper {
padding: 6em 0; }
img#overlay-icon {
max-width: 10%;
padding-top: 175px;
}
.login_wrapper h2 {
font-size: 1.6875rem;
margin: 0 auto 1em; }
.login-links_wrapper #login {
font-size: 14px; } }
.contain-to-grid .top-bar {
max-width: initial; }
.prayer-tagline {
color: #000000;
padding: 10px 0; }
.prayer-text {
line-height: 57px; }
.co-prayer-button {
display: inline; }
.prayer-box {
color: #000; }
.co-live-prayer {
border-radius: 30px;
background-color: #00a8da;
border: none;
color: #ffffff;
padding: 8px 17px; }
.co-live-prayer:hover {
background-color: black;
color: white; }
.prayer-button {
margin-left: 10px; }
.co-avatar, .co-account-avatar img {
border-radius: 100%; }
.top-bar.expanded .toggle-topbar a {
color: #000000; }
.top-bar .toggle-topbar.menu-icon a span::after, .top-bar .toggle-topbar.menu-icon a:hover span::after {
box-shadow: 0 0px 0 1px #fff, 0 7px 0 1px #fff, 0 14px 0 1px #fff; }
.top-bar .toggle-topbar.menu-icon a {
color: #fff; }
/* Account Signed in*/
.co-account {
margin-top: 0px; }
.co-account .co-avatar {
float: none;
margin-right: 4px; }
.top-bar-section .co-account-dropdown {
content: ' ';
margin-top: 10px;
padding: 5px 0;
border-radius: 2px;
z-index: 10; }
.co-avatar, .co-account-avatar img {
border-radius: 100%; }
.dropdown:before, .co-account-dropdown:before {
content: ' ';
height: 0;
position: absolute;
width: 0;
border: 10px solid rgba(0, 0, 0, 0);
border-bottom-color: #313234;
top: -20px;
left: 50%;
margin-left: -5px; }
.top-bar-section ul.co-account-dropdown li:not(.has-form) {
height: auto; }
.top-bar-section ul.co-account-dropdown li:not(.has-form) a:not(.button) {
padding: 0 15px;
line-height: 45px;
background: rgba(0, 0, 0, 0); }
.co-modal-settings input[type=text] {
width: 62%; }
.co-modal-settings .co-account-avatar {
position: absolute;
width: 210px;
top: 125px;
text-align: center; }
li.co-private-chat-tab img, li.co-private-chat-tab .co-default-avatar {
display: none; }
/* Account Signed in*/
.content {
background-color: #efefef;
background-repeat: no-repeat;
background-position: top center;
background-size: cover; }
.wrapper {
padding-bottom: 66%; }
.wrapper-positioning {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0; }
.full-height {
height: 100%;
position: absolute;
right: 0; }
.relative {
position: relative; }
.co-button {
background-color: #00adef;
font-family: 'bebas';
text-transform: uppercase; }
button:hover, button:focus, .button:hover, .button:focus, .co-button:hover, .co-button:focus {
background-color: #00adef; }
.co-tabs-content {
padding-bottom: 5px;
height: 100%;
padding-bottom: 44px; }
.co-component-header {
color: #a5a6aa;
padding: 0px;
border-bottom: 1px solid #F1F1F3; }
.co-schedule-content .co-scrollable {
padding-left: 10px;
padding-right: 10px; }
.co-component-header {
padding-left: 10px;
padding-right: 10px; }
.co-widgets {
background-color: #fff;
height: 100%;
position: relative; }
.co-widget-tabs {
background-color: #f9f9f9;
position: absolute;
bottom: 0;
width: 100%;
/* height: 36px; */
height: 44px;
overflow: hidden;
color: #878787; }
.co-widget-tabs.has-more-widgets {
padding-right: 36px; }
.co-widget-tabs li {
color: #a5a6aa;
display: inline-block;
font-size: 12px;
padding: 12px 8px;
text-transform: uppercase;
font-family: bebas, sans-serif;
font-weight: bold;
letter-spacing: 0.05em; }
.co-widget-tabs li.co-active {
background-color: #f9f9f9;
color: black; }
.co-component-footer {
border-top: 1px solid #f1f1f3;
padding: 5px;
background-color: #fff; }
.co-tabs-content {
background-color: #fff; }
.co-slide-wrapper {
padding-bottom: 16%; }
.co-slide-manager table td {
color: black; }
.co-slide-manager > a {
color: black; }
.co-chat-list {
padding-top: 0px; }
.event-details {
margin-top: 20px; }
.event-details h2 {
font-size: 1.5rem;
color: #000000;
margin-bottom: 0px; }
.event-details h2 small {
font-size: 85%;
margin-left: 10px;
color: #000000; }
.event-details p {
color: #000000;
margin-bottom: 10px; }
.co-next-service-time {
margin-top: -6px;
margin-bottom: 16px;
color: #FFF; }
.share {
margin-bottom: 20px; }
.share h6, .share .co-share {
display: inline-block; }
.share h6 {
font-size: 14px; }
.share .co-share {
vertical-align: middle;
margin-left: 5px; }
.share .co-share .co-share-button {
font-size: 1.5rem; }
.share h6, .share .co-share .co-share-button {
color: #000000; }
.co-share-google-plus {
display: none; }
footer.row {
padding-top: 10px; }
footer ul li a, footer p {
font-size: 12px;
color: #686869;
text-decoration: none; }
footer ul li a:hover {
color: #757576; }
/* Componet */
.co-component-content {
padding-top: 45px; }
/* Schedule */
.co-event-time {
max-width: 75px; }
.co-event-day-header {
text-transform: capitalize;
background: #efefef;
padding: 6px 8px; }
.co-event-day-header h3 {
font-size: 1rem;
display: inline-block;
margin: 0;
color: #000; }
.co-event-day-date {
float: right; }
a.co-event-reminder-button,
a.co-event-invite-button {
color: #00adef; }
/* Schedule */
/*Pop Over*/
.co-popover.co-active {
display: block; }
.co-popover {
margin: 0px;
box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.2); }
/*Pop Over*/
/* Countdown Clock */
input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
input[type="color"],
textarea {
-webkit-box-shadow: inset 0 2px 2px #F1F1F3;
-moz-box-shadow: inset 0 2px 2px #f1f1f3;
box-shadow: inset 0 2px 2px #F1F1F3;
border: 1px solid #E1E1E3;
border-radius: 2px;
transition: none; }
input[type="text"]:focus,
input[type="password"]:focus,
input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
input[type="color"]:focus,
textarea:focus {
box-shadow: none;
border-color: #000000;
background: #fff; }
/* Countdown Clock */
.co-reminder-header__wrapper {
background-color: #efefef; }
.co-reminder-header {
color: black; }
.co-reminder-header > div {
padding: 16px 0px;
text-align: center; }
.co-reminder-header button {
display: inline-block;
background-color: transparent;
color: black;
border: 1px solid black;
font-size: 1rem;
line-height: 36px;
padding: 0 1.25rem;
margin: 10px 0px 0px 0px;
vertical-align: top; }
.co-reminder-header button:hover {
background-color: #000000;
border-color: #000000; }
.co-reminder-header button i {
margin-right: 8px; }
.co-header-countdown-time {
display: inline-block;
margin: 0px 14px 0px 16px; }
.co-reminder-header-title {
display: inline-block;
vertical-align: top;
line-height: 57px; }
.co-countdown-unit {
display: inline-block;
padding: 8px 10px 0;
text-align: center;
font-weight: 100; }
.co-reminder-header button:hover {
color: white;
border: none; }
.co-countdown-time div:first-child {
border-left: 1px solid #494a4e; }
.co-countdown-time div {
border-right: 1px solid #494a4e; }
.co-countdown-digit {
font-size: 1.8rem;
line-height: 0.8;
display: block; }
.co-countdown-digit-label {
font-size: 12px;
color: #747474; }
.co-countdown {
color: white;
background-color: #1d1d1f;
text-align: center;
position: relative; }
.co-countdown .co-countdown-time div:first-child {
border-left: none; }
.co-countdown .co-countdown-time div:last-child {
border-right: none; }
.co-countdown .co-countdown-time {
height: 100%; }
.co-countdown .co-countdown-wrapper {
padding-bottom: 29.5%;
background-color: #313234;
color: #fff;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d; }
.co-countdown .co-countdown-wrapper > div {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0; }
.co-countdown .co-countdown-unit {
position: relative;
top: 50%;
margin-top: -28.5px; }
.co-countdown .co-countdown-information {
display: none; }
.co-countdown-header {
text-align: center;
background: #313234; }
.co-countdown-header > div {
padding: 20px 0 12px; }
.co-countdown-header h2 {
color: #FFFEFE;
font-size: 24px;
display: inline;
font-weight: 200;
vertical-align: top;
line-height: 60px;
margin-right: 30px; }
.co-countdown-header .co-countdown-unit {
-webkit-transform: initial;
transform: initial;
top: initial;
color: white; }
.co-countdown-header {
background-color: #1d1d1f; }
/* Countdown Clock */
/* Chat */
.co-chat-list.co-component-content {
padding-top: 0px; }
input.co-nickname-box-input {
border-radius: 2px;
width: 50%;
display: inline;
margin: 0;
height: 32px;
border: none; }
.co-chat-overlay .co-button {
height: 32px;
margin: 0;
line-height: 0; }
.co-chat-box {
box-shadow: none; }
.co-chat-box-stretcher {
border-radius: 2px;
padding-top: 0px; }
.co-chat-box-stretcher > div {
margin-left: 42px;
padding-bottom: 0px;
border: 1px solid #f1f1f3; }
.co-chat-container {
padding-bottom: 50px; }
.co-chat-list {
padding: 0px; }
.co-quality-switch {
margin-top: 10px;
text-transform: capitalize; }
.co-quality-switch a {
color: #90929C; }
.co-quality-switch i {
margin-right: 6px; }
footer .powered-by {
float: right;
text-decoration: none;
color: #686869;
font-size: 12px;
position: relative; }
footer .powered-by img {
margin-left: 5px;
position: relative; }
/* Platform/Framework Resets */
/* - - - - - - - - - - - - - - - - - - - - - - - - - */
.co-account-dropdown li:first-child {
padding-top: 0; }
.top-bar-section li:hover a, .top-bar-section li:not(.has-form) a:not(.button):hover {
background-color: none; }
.co-account span {
color: white; }
.co-account span:hover {
color: #00adef; }
.co-account ul li a {
color: #fff; }
.co-account ul li:hover:not(.has-form) > a {
color: #000; }
.co-popover input {
margin-bottom: 0; }
.co-flyout table {
background: transparent; }
.co-flyout {
background: white;
color: black; }
.co-volunteer-settings .co-flyout a {
color: black; }
.co-volunteer-chat .co-message-main {
background: white; }
.co-user-stat-description {
color: black; }
.co-notification-none {
color: black; }
.co-notifications {
top: 65px; }
.co-volunteer-bar ~ .co-notifications {
top: 105px; }
input + .co-error {
margin-top: -15px;
margin-bottom: 10px; }
.ec-section {
padding: 4em 0; }
.ec-section--has-title {
padding: 2em 0 4em; }
.ec-section--light {
background-color: #efefef; }
.ec-section-title {
margin-top: 0;
margin-bottom: 24px;
font-weight: 100;
margin-bottom: 1em;
font-size: 24px; }
.playlist {
position: relative;
margin-bottom: 1.875rem; }
.playlist:before {
content: '';
height: 63px;
background: url(https://chop-v3-media.s3.amazonaws.com/medias/images/000/046/078/original/play-button.png?1458873674);
width: 63px;
position: absolute;
top: 50%;
left: 50%;
margin-left: -32px;
margin-top: -32px;
display: none; }
.playlist:after {
content: ' ';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 50%;
z-index: 1;
opacity: 0.5;
background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%);
background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%);
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, black 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); }
.playlist > .playlist-info {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
color: white;
z-index: 10;
padding: 20px; }
.playlist > .playlist-info > .playlist-title {
color: white;
font-size: 24px;
margin: 0; }
.playlist > .playlist-info > .playlist-subtitle {
margin: 0; }
.ec-playlists .ec-scrim {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.75);
z-index: 999; }
.ec-playlists .ec-scrim-text {
position: absolute;
color: white;
font-family: bebas;
text-transform: uppercase;
letter-spacing: 0.1em;
top: 50%;
padding-left: 30px;
padding-right: 30px;
text-align: center; }
.ec-playlists .playlist:hover {
cursor: pointer; }
.ec-playlists .playlist:hover:before {
display: inline-block; }
.ec-playlists.ec-playlists--live .ec-scrim {
display: block; }
.ec-playlists.ec-playlists--live .playlist:hover {
cursor: auto; }
.ec-playlists.ec-playlists--live .playlist:hover:before {
display: none; }
.co-share-button i {
font-size: 2em;
margin-right: 10px; }
/* Remodal */
.remodal-overlay {
background-color: rgba(0, 0, 0, 0.5); }
.remodal .close-button {
float: right; }
.remodal .close-button:hover {
cursor: pointer; }
.remodal-wrapper .remodal {
max-width: 100%;
width: 500px;
color: #6c6c6c; }
.remodal .orbit-bullets {
display: block; }
.remodal .orbit-bullets li {
margin-right: 10px; }
.remodal .orbit-bullets li.active {
background: black; }
.reveal-modal .close-reveal-modal {
font-size: 2.5rem;
line-height: 1;
position: absolute;
top: 10%;
right: 50%;
color: #FFFFFF;
font-weight: bold;
cursor: pointer;
width: 491px;
transform: translate(150%, -50%); }
.reveal-modal.medium.open {
width: 500px;
max-width: 100% !important;
left: 0px;
right: 0%;
margin: 0 auto;
background-color: transparent;
border: none;
box-shadow: none; }
/* Media Queries */
/* - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Mobile */
@media screen and (max-width: 40em) {
.co-account .co-account-dropdown {
width: 100%; }
.dropdown:before, .co-account-dropdown:before {
left: 10%; }
.contain-to-grid .top-bar.expanded {
overflow: visible; }
.top-bar-section ul li.avatar img {
display: none; }
.content .medium-8.no-padding-right {
padding-right: 0.9375rem; }
.co-reminder-header-title {
display: block;
line-height: initial; }
.co-header-countdown-time {
display: block;
margin: 16px 14px 16px 16px; }
.co-reminder-header button {
display: block;
margin: 0 auto; }
.top-bar .name {
height: 30px;
margin: 0;
font-size: 20px; }
img {
max-width: 90%; } }
@media only screen and (max-width: 30em) {
.reveal-modal.medium.open {
min-height: 100vh;
top: 15%;
left: -35% !important; } }
/* Mobile Tablet */
@media screen and (max-width: 64em) {
.redactor_toolbar.co-component-header {
display: none; }
.redactor_box iframe {
padding-top: 0px; }
.co-close-private-chat a {
font-size: 0px; }
.co-close-private-chat a span {
font-size: 30px;
line-height: 30px; }
.widget-container {
padding-left: 15px !important;
position: relative !important; }
.co-widget-tabs {
position: relative; }
.co-schedule-content {
overflow: scroll; }
.co-tabs-content {
padding-bottom: 0; }
.co-tabs-content > dd.co-active {
max-height: 400px; }
.co-bible, .co-notes {
height: 400px; } }
/* Large */
@media screen and (min-width: 64em) and (max-width: 74.69em) {
.redactor_toolbar :nth-child(14), .redactor_toolbar :nth-child(15) {
display: none; } }
.co-notification-list .co-flyout tr td {
color: black; }
.co-volunteer-info .co-flyout a {
color: #00adef; }
p.co-message-content a {
color: #00adef; }
.co-toggle-button .co-toggle-handle {
width: 20px;
height: 20px;
border-radius: 2px;
position: absolute;
top: 0px;
left: 0px;
background: #2595ed;
font-size: 1px;
line-height: 20px;
text-decoration: none;
color: #D8DAD9;
text-align: center;
transition: all 0.4s cubic-bezi }
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{ organization.name }}</title>
<meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0" />
<meta name='title' content='{{ organization.meta_title }}'>
<meta name='description' content='{{ organization.meta_description }}'>
<meta name='keywords' content='{{ organization.meta_keywords }}'>
<!-- Social Sharing -->
<meta name='og:title' content='{{ organization.meta_title }}'>
<meta name='og:description' content='{{ organization.meta_description }}'>
<meta name='og:url' content='{{ organization.platform_url }}'>
<meta name='og:image' content='{{ organization.logo_url }}'>
<!-- Social Sharing -->
<link href='{{ organization.platform_url }}'>
<link href='{{ organization.favicon }}' rel='icon' type='image/png'>
{{ platform_head }}
{{ foundation_css }}
<link rel="stylesheet" href="https://use.typekit.net/unn8quw.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/remodal/1.0.7/remodal.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/remodal/1.0.7/remodal-default-theme.min.css" rel="stylesheet">
<style type="text/css">
{% include 'stylesheet' %}
</style>
</head>
<body>
<header class="row full-width">
<div class="medium-12 columns nav-margin">
<div class="navigation contain-to-grid">
<nav class="top-bar" data-topbar role="navigation">
<ul class="title-area">
<li class="name">
<h1 class="brand"><a href="{{ organization.website_url }}">{{ organization.brand }}</a></h1>
</li>
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>
</ul>
<section class="top-bar-section">
<!-- Right Nav Section -->
<ul class="right top-bar-actions">
{% for link in organization.header_links %}
<li class="link">
{{ link }}
</li>
{% endfor %}
{% if organization.give_link %}
<li class="link">
<a id="give" href="{{ organization.give_link }}" >{{ 'give' | translate }}</a>
</li>
{% endif %}
<li class="link">
{{ component.sign_in }}
</li>
<li>
{{ component.sign_up }}
</li>
<li class="avatar">{{ component.account }}</li>
</ul>
</section>
</nav>
</div>
</div>
</header>
{{ component.reminder_header }}
<div class="content">
<div class="row prayer-tagline">
<div class="medium-12 columns text-right" role="content">
<a style="color:#00adef" href="https://victoryfamily.church/technical-difficulties/" target="_blank">Technical issues? Contact us here.</a>
</div>
</div>
<div class="row full-width relative">
<div class="medium-8 columns no-padding-right" role="content">
{{ component.video }}
{{ component.slides }}
</div>
<div class="medium-4 columns full-height no-padding-left widget-container">
{% widgets %}
{% content_for_tabs %}
{% if event.chat_enabled? %}
{% tab_content chat %} {{ component.chat }} {% endtab_content %}
{% endif %}
{% if event.notes_enabled? %}
{% tab_content notes %} {{ component.notes }} {% endtab_content %}
{% endif %}
{% tab_content schedule %} {{ component.schedule }} {% endtab_content %}
{% if settings.bible_tab == '1' %}
{% tab_content bible %} {{ component.bible }} {% endtab_content %}
{% endif %}
{% if event.custom_tab_enabled? %}
{% tab_content custom-tab %} {{ component.custom_tab }} {% endtab_content %}
{% endif %}
{% endcontent_for_tabs %}
{% tabs %}
{% if event.chat_enabled? %}
{% tab chat %} {{ 'chat' | translate }} {% endtab %}
{% endif %}
{% if event.notes_enabled? %}
{% tab notes %} {{ 'notes' | translate }} {% endtab %}
{% endif %}
{% tab schedule default %} {{ 'schedule' | translate }} {% endtab %}
{% if settings.bible_tab == '1' %}
{% tab bible %} {{ 'bible' | translate }} {% endtab %}
{% endif %}
{% if event.custom_tab_enabled? %}
{% tab custom-tab %} {{ organization.custom_tab_title }} {% endtab %}
{% endif %}
{% endtabs %}
<a class="more-widgets" href="#" data-behavior="tabs">
<i class="co-icon-ellipsis-h"></i>
</a>
{% endwidgets %}
</div>
</div>
<div class="row full-width event-details">
<div class="medium-7 columns">
<div>
<h2>{{ event.title }} //<small>{{ event.speaker }}</small></h2>
{{ component.next_service_time }}
</div>
<div class="share">
{% if settings.show_social == '1' %}
<h6>{{ 'share' | translate }}</h6>
{{ component.share }}
{% endif %}
{{ component.quality_switch }}
</div>
</div>
<div class="medium-5 columns prayer-text text-right hide-for-small-only" role="content">
<div class="prayer-box" data-behavior="co-prayer-box">
<span class="prayer-button">{{ component.prayer_button }}</span>
</div>
</div>
</div>
</div>
<div class="login_wrapper">
<img src="https://thechurchco-production.s3.amazonaws.com/uploads/sites/570/2018/06/VFC_Icon-Inverted-e1529774054516.png" id="overlay-icon"/>
<h2>ACCESS FULL WORSHIP EXPERIENCES!</h2>
<div class="login-links_wrapper">
<a class="co-sign-up-button button" data-behavior="sign-up" href="#" id="signup">Sign up now</a><br>
<a class="co-sign-in-button" data-behavior="log-in" href="#" id="login">Already have an account? Sign In</a>
</div>
</div>
<footer class="row full-width">
<div class="medium-7 small-12 columns">
<ul class="inline-list left">
{% for link in organization.footer_links %}
<li>{{ link }}</li>
{% endfor %}
{% if organization.facebook_link %}
<li><a href="{{ organization.facebook_link }}" target="blank">{{ 'facebook' | translate }}</a></li>
{% endif %}
{% if organization.twitter_link %}
<li><a href="{{ organization.twitter_link }}" target="blank">{{ 'twitter' | translate }}</a></li>
{% endif %}
<li class="copyright">{% include 'copyright' %}</li>
</ul>
</div>
<div class="medium-5 small-12 columns text-right">
<a class="powered-by" href="http://churchonlineplatform.com" target="_blank">
Powered by
<img alt="Church Online Platform" height="25" src="{{ 'church_online_platform_logo_horizontal.png' | asset_url }}" width="173">
</a>
</div>
</footer>
{{ platform_footer }}
{{ foundation_js }}
<script type="text/javascript">
{% include 'javascript' %}
</script>
{{ organization.google_analytics_code }}
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment