Add files via upload
This commit is contained in:
Gilbert Hutapea
GitHub
parent
c82ddeb876
commit
352cb5b0ae
5
css/bootstrap.min.css
vendored
Normal file
5
css/bootstrap.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
3351
css/css-animate.css
Normal file
3351
css/css-animate.css
Normal file
File diff suppressed because it is too large
Load Diff
6257
css/css-bootstrap.css
Normal file
6257
css/css-bootstrap.css
Normal file
File diff suppressed because it is too large
Load Diff
1571
css/css-icomoon.css
Normal file
1571
css/css-icomoon.css
Normal file
File diff suppressed because it is too large
Load Diff
368
css/css-magnific-popup.css
Normal file
368
css/css-magnific-popup.css
Normal file
@ -0,0 +1,368 @@
|
|||||||
|
/* Magnific Popup CSS */
|
||||||
|
.mfp-bg {
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 1042;
|
||||||
|
overflow: hidden;
|
||||||
|
position: fixed;
|
||||||
|
background: #0b0b0b;
|
||||||
|
opacity: 0.8;
|
||||||
|
filter: alpha(opacity=80); }
|
||||||
|
|
||||||
|
.mfp-wrap {
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 1043;
|
||||||
|
position: fixed;
|
||||||
|
outline: none !important;
|
||||||
|
-webkit-backface-visibility: hidden; }
|
||||||
|
|
||||||
|
.mfp-container {
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
padding: 0 8px;
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box; }
|
||||||
|
|
||||||
|
.mfp-container:before {
|
||||||
|
content: '';
|
||||||
|
display: inline-block;
|
||||||
|
height: 100%;
|
||||||
|
vertical-align: middle; }
|
||||||
|
|
||||||
|
.mfp-align-top .mfp-container:before {
|
||||||
|
display: none; }
|
||||||
|
|
||||||
|
.mfp-content {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: left;
|
||||||
|
z-index: 1045; }
|
||||||
|
|
||||||
|
.mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content {
|
||||||
|
width: 100%;
|
||||||
|
cursor: auto; }
|
||||||
|
|
||||||
|
.mfp-ajax-cur {
|
||||||
|
cursor: progress; }
|
||||||
|
|
||||||
|
.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
|
||||||
|
cursor: -moz-zoom-out;
|
||||||
|
cursor: -webkit-zoom-out;
|
||||||
|
cursor: zoom-out; }
|
||||||
|
|
||||||
|
.mfp-zoom {
|
||||||
|
cursor: pointer;
|
||||||
|
cursor: -webkit-zoom-in;
|
||||||
|
cursor: -moz-zoom-in;
|
||||||
|
cursor: zoom-in; }
|
||||||
|
|
||||||
|
.mfp-auto-cursor .mfp-content {
|
||||||
|
cursor: auto; }
|
||||||
|
|
||||||
|
.mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter {
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-moz-user-select: none;
|
||||||
|
user-select: none; }
|
||||||
|
|
||||||
|
.mfp-loading.mfp-figure {
|
||||||
|
display: none; }
|
||||||
|
|
||||||
|
.mfp-hide {
|
||||||
|
display: none !important; }
|
||||||
|
|
||||||
|
.mfp-preloader {
|
||||||
|
color: #cccccc;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
width: auto;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: -0.8em;
|
||||||
|
left: 8px;
|
||||||
|
right: 8px;
|
||||||
|
z-index: 1044; }
|
||||||
|
.mfp-preloader a {
|
||||||
|
color: #cccccc; }
|
||||||
|
.mfp-preloader a:hover {
|
||||||
|
color: white; }
|
||||||
|
|
||||||
|
.mfp-s-ready .mfp-preloader {
|
||||||
|
display: none; }
|
||||||
|
|
||||||
|
.mfp-s-error .mfp-content {
|
||||||
|
display: none; }
|
||||||
|
|
||||||
|
button.mfp-close, button.mfp-arrow {
|
||||||
|
overflow: visible;
|
||||||
|
cursor: pointer;
|
||||||
|
background: transparent;
|
||||||
|
border: 0;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
display: block;
|
||||||
|
outline: none;
|
||||||
|
padding: 0;
|
||||||
|
z-index: 1046;
|
||||||
|
-webkit-box-shadow: none;
|
||||||
|
box-shadow: none; }
|
||||||
|
button::-moz-focus-inner {
|
||||||
|
padding: 0;
|
||||||
|
border: 0; }
|
||||||
|
|
||||||
|
.mfp-close {
|
||||||
|
width: 44px;
|
||||||
|
height: 44px;
|
||||||
|
line-height: 44px;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: center;
|
||||||
|
opacity: 0.65;
|
||||||
|
filter: alpha(opacity=65);
|
||||||
|
padding: 0 0 18px 10px;
|
||||||
|
color: white;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 28px;
|
||||||
|
font-family: Arial, Baskerville, monospace; }
|
||||||
|
.mfp-close:hover, .mfp-close:focus {
|
||||||
|
opacity: 1;
|
||||||
|
filter: alpha(opacity=100); }
|
||||||
|
.mfp-close:active {
|
||||||
|
top: 1px; }
|
||||||
|
|
||||||
|
.mfp-close-btn-in .mfp-close {
|
||||||
|
color: #333333; }
|
||||||
|
|
||||||
|
.mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close {
|
||||||
|
color: white;
|
||||||
|
right: -6px;
|
||||||
|
text-align: right;
|
||||||
|
padding-right: 6px;
|
||||||
|
width: 100%; }
|
||||||
|
|
||||||
|
.mfp-counter {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
color: #cccccc;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 18px; }
|
||||||
|
|
||||||
|
.mfp-arrow {
|
||||||
|
position: absolute;
|
||||||
|
opacity: 0.65;
|
||||||
|
filter: alpha(opacity=65);
|
||||||
|
margin: 0;
|
||||||
|
top: 50%;
|
||||||
|
margin-top: -55px;
|
||||||
|
padding: 0;
|
||||||
|
width: 90px;
|
||||||
|
height: 110px;
|
||||||
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
|
||||||
|
.mfp-arrow:active {
|
||||||
|
margin-top: -54px; }
|
||||||
|
.mfp-arrow:hover, .mfp-arrow:focus {
|
||||||
|
opacity: 1;
|
||||||
|
filter: alpha(opacity=100); }
|
||||||
|
.mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
margin-top: 35px;
|
||||||
|
margin-left: 35px;
|
||||||
|
border: medium inset transparent; }
|
||||||
|
.mfp-arrow:after, .mfp-arrow .mfp-a {
|
||||||
|
border-top-width: 13px;
|
||||||
|
border-bottom-width: 13px;
|
||||||
|
top: 8px; }
|
||||||
|
.mfp-arrow:before, .mfp-arrow .mfp-b {
|
||||||
|
border-top-width: 21px;
|
||||||
|
border-bottom-width: 21px;
|
||||||
|
opacity: 0.7; }
|
||||||
|
|
||||||
|
.mfp-arrow-left {
|
||||||
|
left: 0; }
|
||||||
|
.mfp-arrow-left:after, .mfp-arrow-left .mfp-a {
|
||||||
|
border-right: 17px solid white;
|
||||||
|
margin-left: 31px; }
|
||||||
|
.mfp-arrow-left:before, .mfp-arrow-left .mfp-b {
|
||||||
|
margin-left: 25px;
|
||||||
|
border-right: 27px solid #3f3f3f; }
|
||||||
|
|
||||||
|
.mfp-arrow-right {
|
||||||
|
right: 0; }
|
||||||
|
.mfp-arrow-right:after, .mfp-arrow-right .mfp-a {
|
||||||
|
border-left: 17px solid white;
|
||||||
|
margin-left: 39px; }
|
||||||
|
.mfp-arrow-right:before, .mfp-arrow-right .mfp-b {
|
||||||
|
border-left: 27px solid #3f3f3f; }
|
||||||
|
|
||||||
|
.mfp-iframe-holder {
|
||||||
|
padding-top: 40px;
|
||||||
|
padding-bottom: 40px; }
|
||||||
|
.mfp-iframe-holder .mfp-content {
|
||||||
|
line-height: 0;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 900px; }
|
||||||
|
.mfp-iframe-holder .mfp-close {
|
||||||
|
top: -40px; }
|
||||||
|
|
||||||
|
.mfp-iframe-scaler {
|
||||||
|
width: 100%;
|
||||||
|
height: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
padding-top: 56.25%; }
|
||||||
|
.mfp-iframe-scaler iframe {
|
||||||
|
position: absolute;
|
||||||
|
display: block;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
|
||||||
|
background: black; }
|
||||||
|
|
||||||
|
/* Main image in popup */
|
||||||
|
img.mfp-img {
|
||||||
|
width: auto;
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
display: block;
|
||||||
|
line-height: 0;
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 40px 0 40px;
|
||||||
|
margin: 0 auto; }
|
||||||
|
|
||||||
|
/* The shadow behind the image */
|
||||||
|
.mfp-figure {
|
||||||
|
line-height: 0; }
|
||||||
|
.mfp-figure:after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 40px;
|
||||||
|
bottom: 40px;
|
||||||
|
display: block;
|
||||||
|
right: 0;
|
||||||
|
width: auto;
|
||||||
|
height: auto;
|
||||||
|
z-index: -1;
|
||||||
|
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
|
||||||
|
background: #444444; }
|
||||||
|
.mfp-figure small {
|
||||||
|
color: #bdbdbd;
|
||||||
|
display: block;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 14px; }
|
||||||
|
.mfp-figure figure {
|
||||||
|
margin: 0; }
|
||||||
|
|
||||||
|
.mfp-bottom-bar {
|
||||||
|
margin-top: -36px;
|
||||||
|
position: absolute;
|
||||||
|
top: 100%;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
cursor: auto; }
|
||||||
|
|
||||||
|
.mfp-title {
|
||||||
|
text-align: left;
|
||||||
|
line-height: 18px;
|
||||||
|
color: #f3f3f3;
|
||||||
|
word-wrap: break-word;
|
||||||
|
padding-right: 36px; }
|
||||||
|
|
||||||
|
.mfp-image-holder .mfp-content {
|
||||||
|
max-width: 100%; }
|
||||||
|
|
||||||
|
.mfp-gallery .mfp-image-holder .mfp-figure {
|
||||||
|
cursor: pointer; }
|
||||||
|
|
||||||
|
@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
|
||||||
|
/**
|
||||||
|
* Remove all paddings around the image on small screen
|
||||||
|
*/
|
||||||
|
.mfp-img-mobile .mfp-image-holder {
|
||||||
|
padding-left: 0;
|
||||||
|
padding-right: 0; }
|
||||||
|
.mfp-img-mobile img.mfp-img {
|
||||||
|
padding: 0; }
|
||||||
|
.mfp-img-mobile .mfp-figure:after {
|
||||||
|
top: 0;
|
||||||
|
bottom: 0; }
|
||||||
|
.mfp-img-mobile .mfp-figure small {
|
||||||
|
display: inline;
|
||||||
|
margin-left: 5px; }
|
||||||
|
.mfp-img-mobile .mfp-bottom-bar {
|
||||||
|
background: rgba(0, 0, 0, 0.6);
|
||||||
|
bottom: 0;
|
||||||
|
margin: 0;
|
||||||
|
top: auto;
|
||||||
|
padding: 3px 5px;
|
||||||
|
position: fixed;
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box; }
|
||||||
|
.mfp-img-mobile .mfp-bottom-bar:empty {
|
||||||
|
padding: 0; }
|
||||||
|
.mfp-img-mobile .mfp-counter {
|
||||||
|
right: 5px;
|
||||||
|
top: 3px; }
|
||||||
|
.mfp-img-mobile .mfp-close {
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 35px;
|
||||||
|
height: 35px;
|
||||||
|
line-height: 35px;
|
||||||
|
background: rgba(0, 0, 0, 0.6);
|
||||||
|
position: fixed;
|
||||||
|
text-align: center;
|
||||||
|
padding: 0; } }
|
||||||
|
|
||||||
|
@media all and (max-width: 900px) {
|
||||||
|
.mfp-arrow {
|
||||||
|
-webkit-transform: scale(0.75);
|
||||||
|
transform: scale(0.75); }
|
||||||
|
.mfp-arrow-left {
|
||||||
|
-webkit-transform-origin: 0;
|
||||||
|
transform-origin: 0; }
|
||||||
|
.mfp-arrow-right {
|
||||||
|
-webkit-transform-origin: 100%;
|
||||||
|
transform-origin: 100%; }
|
||||||
|
.mfp-container {
|
||||||
|
padding-left: 6px;
|
||||||
|
padding-right: 6px; } }
|
||||||
|
|
||||||
|
.mfp-ie7 .mfp-img {
|
||||||
|
padding: 0; }
|
||||||
|
.mfp-ie7 .mfp-bottom-bar {
|
||||||
|
width: 600px;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -300px;
|
||||||
|
margin-top: 5px;
|
||||||
|
padding-bottom: 5px; }
|
||||||
|
.mfp-ie7 .mfp-container {
|
||||||
|
padding: 0; }
|
||||||
|
.mfp-ie7 .mfp-content {
|
||||||
|
padding-top: 44px; }
|
||||||
|
.mfp-ie7 .mfp-close {
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
padding-top: 0; }
|
||||||
1
css/css-owl.carousel.min.css
vendored
Normal file
1
css/css-owl.carousel.min.css
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
.owl-carousel .animated{-webkit-animation-duration:1000ms;animation-duration:1000ms;-webkit-animation-fill-mode:both;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{-webkit-transition:height 500ms ease-in-out;-moz-transition:height 500ms ease-in-out;-ms-transition:height 500ms ease-in-out;-o-transition:height 500ms ease-in-out;transition:height 500ms ease-in-out}.owl-carousel{display:none;width:100%;-webkit-tap-highlight-color:transparent;position:relative;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0px,0,0)}.owl-carousel .owl-controls .owl-dot,.owl-carousel .owl-controls .owl-nav .owl-next,.owl-carousel .owl-controls .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loaded{display:block}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel .owl-refresh .owl-item{display:none}.owl-carousel .owl-item{position:relative;min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-item img{display:block;width:100%;-webkit-transform-style:preserve-3d}.owl-carousel.owl-text-select-on .owl-item{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.owl-carousel .owl-grab{cursor:move;cursor:-webkit-grab;cursor:-o-grab;cursor:-ms-grab;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.no-js .owl-carousel{display:block}.owl-carousel .owl-item .owl-lazy{opacity:0;-webkit-transition:opacity 400ms ease;-moz-transition:opacity 400ms ease;-ms-transition:opacity 400ms ease;-o-transition:opacity 400ms ease;transition:opacity 400ms ease}.owl-carousel .owl-item img{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(../images/css-owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;-webkit-transition:scale 100ms ease;-moz-transition:scale 100ms ease;-ms-transition:scale 100ms ease;-o-transition:scale 100ms ease;transition:scale 100ms ease}.owl-carousel .owl-video-play-icon:hover{-webkit-transition:scale(1.3,1.3);-moz-transition:scale(1.3,1.3);-ms-transition:scale(1.3,1.3);-o-transition:scale(1.3,1.3);transition:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;-webkit-background-size:contain;-moz-background-size:contain;-o-background-size:contain;background-size:contain;-webkit-transition:opacity 400ms ease;-moz-transition:opacity 400ms ease;-ms-transition:opacity 400ms ease;-o-transition:opacity 400ms ease;transition:opacity 400ms ease}.owl-carousel .owl-video-frame{position:relative;z-index:1}
|
||||||
1
css/css-owl.theme.default.min.css
vendored
Normal file
1
css/css-owl.theme.default.min.css
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
.owl-theme .owl-controls{margin-top:10px;text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-controls .owl-nav [class*=owl-]{color:#fff;font-size:14px;margin:5px;padding:4px 7px;background:#d6d6d6;display:inline-block;cursor:pointer;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{background:#869791;color:#fff;text-decoration:none}.owl-theme .owl-controls .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1;*display:inline}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#d6d6d6;display:block;-webkit-backface-visibility:visible;-webkit-transition:opacity 200ms ease;-moz-transition:opacity 200ms ease;-ms-transition:opacity 200ms ease;-o-transition:opacity 200ms ease;transition:opacity 200ms ease;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#869791}
|
||||||
2164
css/css-style.css
Normal file
2164
css/css-style.css
Normal file
File diff suppressed because it is too large
Load Diff
560
css/ket.css
Normal file
560
css/ket.css
Normal file
@ -0,0 +1,560 @@
|
|||||||
|
.timeline-img {
|
||||||
|
width: 100%;
|
||||||
|
height: 250px;
|
||||||
|
object-fit: cover;
|
||||||
|
object-position: center;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
border-radius: 10px;
|
||||||
|
background-color: #304058;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
width: 100%;
|
||||||
|
height: 10vh;
|
||||||
|
color: #fff;
|
||||||
|
display: flex;
|
||||||
|
padding-top: 20px;
|
||||||
|
text-align: center;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background-color: #304058;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer p {
|
||||||
|
font-family: sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*========== MENU UCAPAN =============*/
|
||||||
|
#konten {
|
||||||
|
display: flex;
|
||||||
|
flex-grow: 1;
|
||||||
|
flex-direction: row;
|
||||||
|
background: #e7e7e7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.konten {
|
||||||
|
text-align: center;
|
||||||
|
background-size: contain;
|
||||||
|
background-position: center;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#ucapan-konten {
|
||||||
|
margin: 10px 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ucapan-field {
|
||||||
|
max-width: 500px;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.komen-netizen {
|
||||||
|
margin-bottom: 15px;
|
||||||
|
margin-top: 15px;
|
||||||
|
max-width: 500px;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.komen {
|
||||||
|
display: none;
|
||||||
|
padding: 10px;
|
||||||
|
margin-left: -15px;
|
||||||
|
margin-right: -15px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
background-color: #f1f1f1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.komen2 {
|
||||||
|
display: none;
|
||||||
|
padding: 10px;
|
||||||
|
margin-left: -15px;
|
||||||
|
margin-right: -15px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
background-color: #f1f1f1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#submitKomen {
|
||||||
|
margin-top: 15px;
|
||||||
|
padding: 5px;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #d1d1d1;
|
||||||
|
color: #16212a;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: #3e393c;
|
||||||
|
/*box-shadow: 0 1px 1px #ccc;*/
|
||||||
|
transition: all 600ms ease-in-out;
|
||||||
|
-webkit-transition: all 600ms ease-in-out;
|
||||||
|
-moz-transition: all 600ms ease-in-out;
|
||||||
|
-o-transition: all 600ms ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
#submitKomen:hover {
|
||||||
|
background-color: #fff;
|
||||||
|
color: #3e393c;
|
||||||
|
}
|
||||||
|
|
||||||
|
#loadMore {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
margin-top: 15px;
|
||||||
|
padding: 5px;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #d1d1d1;
|
||||||
|
color: #16212a;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: #16212a;
|
||||||
|
/*box-shadow: 0 1px 1px #ccc;*/
|
||||||
|
transition: all 600ms ease-in-out;
|
||||||
|
-webkit-transition: all 600ms ease-in-out;
|
||||||
|
-moz-transition: all 600ms ease-in-out;
|
||||||
|
-o-transition: all 600ms ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
#loadMore:hover {
|
||||||
|
background-color: #ffffff;
|
||||||
|
color: #16212a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.komen-nama {
|
||||||
|
color: #16212a;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.komen-isi {
|
||||||
|
/*color: #000000;*/
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.ucapan-field {}
|
||||||
|
|
||||||
|
@media (max-width: 300px) {
|
||||||
|
footer p {
|
||||||
|
font-size: .9rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 575.98px) {
|
||||||
|
|
||||||
|
|
||||||
|
object {
|
||||||
|
width: 100%;
|
||||||
|
height: 350px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.videoWrapper {
|
||||||
|
height: 350px;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer p {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@media (min-width: 576px) {
|
||||||
|
|
||||||
|
object {
|
||||||
|
width: 100%;
|
||||||
|
height: 350px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.videoWrapper {
|
||||||
|
height: 350px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
|
||||||
|
object {
|
||||||
|
width: 100%;
|
||||||
|
height: 450px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.videoWrapper {
|
||||||
|
height: 450px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 992px) {
|
||||||
|
|
||||||
|
object {
|
||||||
|
width: 100%;
|
||||||
|
height: 500px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.videoWrapper {
|
||||||
|
height: 500px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* SPLASHSCREEN */
|
||||||
|
#splashscreen {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
background: #053742;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.splashscreen-bg {
|
||||||
|
|
||||||
|
/* The image used */
|
||||||
|
background-image: url("https://www.makenewstory.com/assets/users/mIjh78y8ge13b89d99c1a29132e57d2ca/album1.png?nocache=1440");
|
||||||
|
|
||||||
|
/* Full height */
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
/* Center and scale the image nicely */
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
opacity: 0.2;
|
||||||
|
-webkit-filter: blur(4px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tengah {
|
||||||
|
margin: 0;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
margin-right: -50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* END OF SPLASHSCREEN */
|
||||||
|
|
||||||
|
/* MUTE BUTTON */
|
||||||
|
|
||||||
|
.floatmute {
|
||||||
|
position: fixed;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
top: 25px;
|
||||||
|
right: 25px;
|
||||||
|
color: #FFF;
|
||||||
|
border-radius: 50px;
|
||||||
|
text-align: center;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
font-size: 20px;
|
||||||
|
z-index: 100;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-float {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* END MUTE BUTTON */
|
||||||
|
|
||||||
|
/* GIFT BUTTON */
|
||||||
|
.floatgift {
|
||||||
|
position: fixed;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
top: 25px;
|
||||||
|
left: 25px;
|
||||||
|
color: #FFF;
|
||||||
|
/* border-radius:50px; */
|
||||||
|
text-align: center;
|
||||||
|
/* background:rgba(0, 0, 0, 0.5); */
|
||||||
|
/* font-size:20px; */
|
||||||
|
z-index: 100;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mdc-button {
|
||||||
|
width: 146px;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mdc-button.mdc-button--raised {
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.streaming.mdc-button {
|
||||||
|
width: 186px;
|
||||||
|
font-size: 12px;
|
||||||
|
margin-top: 10px;
|
||||||
|
margin-bottom: -10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.streaming.mdc-button.mdc-button--raised {
|
||||||
|
background: #304058;
|
||||||
|
}
|
||||||
|
|
||||||
|
.material-icons.mdc-button__icon {
|
||||||
|
display: inline-flex;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
font-size: 15px;
|
||||||
|
vertical-align: middle;
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.giftfloat {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* END GIFT BUTTON */
|
||||||
|
/* STYLE GIFT INPUT */
|
||||||
|
|
||||||
|
.file-upload {
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload .file-select {
|
||||||
|
display: block;
|
||||||
|
border: 2px solid #dce4ec;
|
||||||
|
color: #34495e;
|
||||||
|
cursor: pointer;
|
||||||
|
height: 40.4px;
|
||||||
|
line-height: 40px;
|
||||||
|
text-align: left;
|
||||||
|
background: #FFFFFF;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload .file-select .file-select-button {
|
||||||
|
background: #dce4ec;
|
||||||
|
padding: 0 10px;
|
||||||
|
display: inline-block;
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload .file-select .file-select-name {
|
||||||
|
line-height: 40px;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload .file-select:hover {
|
||||||
|
border-color: #34495e;
|
||||||
|
transition: all .2s ease-in-out;
|
||||||
|
-moz-transition: all .2s ease-in-out;
|
||||||
|
-webkit-transition: all .2s ease-in-out;
|
||||||
|
-o-transition: all .2s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload .file-select:hover .file-select-button {
|
||||||
|
background: #34495e;
|
||||||
|
color: #FFFFFF;
|
||||||
|
transition: all .2s ease-in-out;
|
||||||
|
-moz-transition: all .2s ease-in-out;
|
||||||
|
-webkit-transition: all .2s ease-in-out;
|
||||||
|
-o-transition: all .2s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload.active .file-select {
|
||||||
|
border-color: #3fa46a;
|
||||||
|
transition: all .2s ease-in-out;
|
||||||
|
-moz-transition: all .2s ease-in-out;
|
||||||
|
-webkit-transition: all .2s ease-in-out;
|
||||||
|
-o-transition: all .2s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload.active .file-select .file-select-button {
|
||||||
|
background: #3fa46a;
|
||||||
|
color: #FFFFFF;
|
||||||
|
transition: all .2s ease-in-out;
|
||||||
|
-moz-transition: all .2s ease-in-out;
|
||||||
|
-webkit-transition: all .2s ease-in-out;
|
||||||
|
-o-transition: all .2s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload .file-select input[type=file] {
|
||||||
|
z-index: 100;
|
||||||
|
cursor: pointer;
|
||||||
|
position: absolute;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
opacity: 0;
|
||||||
|
filter: alpha(opacity=0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload .file-select.file-select-disabled {
|
||||||
|
opacity: 0.65;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload .file-select.file-select-disabled:hover {
|
||||||
|
cursor: default;
|
||||||
|
display: block;
|
||||||
|
border: 2px solid #dce4ec;
|
||||||
|
color: #34495e;
|
||||||
|
cursor: pointer;
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
margin-top: 5px;
|
||||||
|
text-align: left;
|
||||||
|
background: #FFFFFF;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload .file-select.file-select-disabled:hover .file-select-button {
|
||||||
|
background: #dce4ec;
|
||||||
|
color: #666666;
|
||||||
|
padding: 0 10px;
|
||||||
|
display: inline-block;
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-upload .file-select.file-select-disabled:hover .file-select-name {
|
||||||
|
line-height: 40px;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* END STYLE GIFT INPUT */
|
||||||
|
/* NAVIGASI */
|
||||||
|
.navigasi {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 55px;
|
||||||
|
box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
display: flex;
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navigasi__link {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-grow: 1;
|
||||||
|
min-width: 50px;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
font-family: sans-serif;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #fff;
|
||||||
|
text-decoration: none;
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
transition: background-color 0.1s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navigasi__link:hover {
|
||||||
|
background: rgba(127, 140, 141, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.navigasi__link--active {
|
||||||
|
color: #009578;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navigasi__icon {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* END NAVIGASI */
|
||||||
|
|
||||||
|
/* SKROLL BUTTON ANIMATED */
|
||||||
|
.icon-scroll,
|
||||||
|
.icon-scroll:before {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-scroll {
|
||||||
|
width: 30px;
|
||||||
|
height: 50px;
|
||||||
|
margin-left: -20px;
|
||||||
|
box-shadow: inset 0 0 0 1px #fff;
|
||||||
|
border-radius: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-scroll:before {
|
||||||
|
content: '';
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
background: #fff;
|
||||||
|
margin-left: -4px;
|
||||||
|
top: 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
animation-duration: 1.5s;
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
animation-name: scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-moz-keyframes scroll {
|
||||||
|
0% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(46px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes scroll {
|
||||||
|
0% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(46px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-o-keyframes scroll {
|
||||||
|
0% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(46px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes scroll {
|
||||||
|
0% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(25px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* END ANIMATED BUTTON SCROLL */
|
||||||
|
|
||||||
|
/* KEHADIRAN */
|
||||||
|
.Akan.Hadir {
|
||||||
|
background: #304058;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Berhalangan.Hadir {
|
||||||
|
background: #304058;
|
||||||
|
color: #ECD662;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* END KEHADIRAN */
|
||||||
|
|
||||||
|
|
||||||
|
/* VALIDASI */
|
||||||
|
.isidulu {
|
||||||
|
box-shadow: 0 0 5px rgba(240, 52, 52, 1);
|
||||||
|
border: 1px solid rgba(240, 52, 52, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* END VALIDASI */
|
||||||
56
css/ket2.css
Normal file
56
css/ket2.css
Normal file
@ -0,0 +1,56 @@
|
|||||||
|
* {
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
|
|
||||||
|
#fh5co-header {
|
||||||
|
/* The image used */
|
||||||
|
background-image: url("../img/album1.png");
|
||||||
|
height: 100vh;
|
||||||
|
/* Center and scale the image nicely */
|
||||||
|
/* background-attachment: fixed; */
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.paralax-acara {
|
||||||
|
/* The image used */
|
||||||
|
background-image: url("../img/album2.png");
|
||||||
|
height: 100vh;
|
||||||
|
/* Center and scale the image nicely */
|
||||||
|
/* background-attachment: fixed; */
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.float {
|
||||||
|
position: fixed;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
bottom: 95px;
|
||||||
|
right: 20px;
|
||||||
|
background-color: #304058;
|
||||||
|
opacity: 0.5;
|
||||||
|
color: #FFF;
|
||||||
|
border-radius: 50px;
|
||||||
|
text-align: center;
|
||||||
|
padding-top: 9px;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.videoWrapper {
|
||||||
|
position: relative;
|
||||||
|
padding-bottom: 56.25%;
|
||||||
|
/* 16:9 */
|
||||||
|
padding-top: 25px;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.videoWrapper iframe {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
204
css/lightbox.css
Normal file
204
css/lightbox.css
Normal file
@ -0,0 +1,204 @@
|
|||||||
|
body.lb-disable-scrolling {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lightboxOverlay {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: 9999;
|
||||||
|
background-color: black;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
|
||||||
|
opacity: 0.8;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lightbox {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 10000;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 0;
|
||||||
|
font-weight: normal;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lightbox .lb-image {
|
||||||
|
display: block;
|
||||||
|
height: auto;
|
||||||
|
max-width: inherit;
|
||||||
|
max-height: none;
|
||||||
|
border-radius: 3px;
|
||||||
|
|
||||||
|
/* Image border */
|
||||||
|
border: 4px solid white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lightbox a img {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-outerContainer {
|
||||||
|
position: relative;
|
||||||
|
*zoom: 1;
|
||||||
|
width: 250px;
|
||||||
|
height: 250px;
|
||||||
|
margin: 0 auto;
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
/* Background color behind image.
|
||||||
|
This is visible during transitions. */
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-outerContainer:after {
|
||||||
|
content: "";
|
||||||
|
display: table;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-loader {
|
||||||
|
position: absolute;
|
||||||
|
top: 43%;
|
||||||
|
left: 0;
|
||||||
|
height: 25%;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-cancel {
|
||||||
|
display: block;
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
margin: 0 auto;
|
||||||
|
background: url(../images/loading.gif) no-repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-nav {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-container > .nav {
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-nav a {
|
||||||
|
outline: none;
|
||||||
|
background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-prev, .lb-next {
|
||||||
|
height: 100%;
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-nav a.lb-prev {
|
||||||
|
width: 34%;
|
||||||
|
left: 0;
|
||||||
|
float: left;
|
||||||
|
background: url(../images/prev.png) left 48% no-repeat;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
|
||||||
|
opacity: 0;
|
||||||
|
-webkit-transition: opacity 0.6s;
|
||||||
|
-moz-transition: opacity 0.6s;
|
||||||
|
-o-transition: opacity 0.6s;
|
||||||
|
transition: opacity 0.6s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-nav a.lb-prev:hover {
|
||||||
|
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-nav a.lb-next {
|
||||||
|
width: 64%;
|
||||||
|
right: 0;
|
||||||
|
float: right;
|
||||||
|
background: url(../images/next.png) right 48% no-repeat;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
|
||||||
|
opacity: 0;
|
||||||
|
-webkit-transition: opacity 0.6s;
|
||||||
|
-moz-transition: opacity 0.6s;
|
||||||
|
-o-transition: opacity 0.6s;
|
||||||
|
transition: opacity 0.6s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-nav a.lb-next:hover {
|
||||||
|
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-dataContainer {
|
||||||
|
margin: 0 auto;
|
||||||
|
padding-top: 5px;
|
||||||
|
*zoom: 1;
|
||||||
|
width: 100%;
|
||||||
|
border-bottom-left-radius: 4px;
|
||||||
|
border-bottom-right-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-dataContainer:after {
|
||||||
|
content: "";
|
||||||
|
display: table;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-data {
|
||||||
|
padding: 0 4px;
|
||||||
|
color: #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-data .lb-details {
|
||||||
|
width: 85%;
|
||||||
|
float: left;
|
||||||
|
text-align: left;
|
||||||
|
line-height: 1.1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-data .lb-caption {
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: bold;
|
||||||
|
line-height: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-data .lb-caption a {
|
||||||
|
color: #4ae;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-data .lb-number {
|
||||||
|
display: block;
|
||||||
|
clear: left;
|
||||||
|
padding-bottom: 1em;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #999999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-data .lb-close {
|
||||||
|
display: block;
|
||||||
|
float: right;
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
background: url(../images/close.png) top right no-repeat;
|
||||||
|
text-align: right;
|
||||||
|
outline: none;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
|
||||||
|
opacity: 0.7;
|
||||||
|
-webkit-transition: opacity 0.2s;
|
||||||
|
-moz-transition: opacity 0.2s;
|
||||||
|
-o-transition: opacity 0.2s;
|
||||||
|
transition: opacity 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lb-data .lb-close:hover {
|
||||||
|
cursor: pointer;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
15961
css/material-components-web.css
Normal file
15961
css/material-components-web.css
Normal file
File diff suppressed because it is too large
Load Diff
BIN
fonts/Chapaza.ttf
Normal file
BIN
fonts/Chapaza.ttf
Normal file
Binary file not shown.
BIN
fonts/NorthernSoul-Script.otf
Normal file
BIN
fonts/NorthernSoul-Script.otf
Normal file
Binary file not shown.
BIN
fonts/icomoon-icomoon.ttf
Normal file
BIN
fonts/icomoon-icomoon.ttf
Normal file
Binary file not shown.
BIN
fonts/icomoon-icomoon.woff
Normal file
BIN
fonts/icomoon-icomoon.woff
Normal file
Binary file not shown.
BIN
img/album1.png
Normal file
BIN
img/album1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 163 KiB |
BIN
img/album2.png
Normal file
BIN
img/album2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 252 KiB |
BIN
img/album3.png
Normal file
BIN
img/album3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 210 KiB |
BIN
img/album4.png
Normal file
BIN
img/album4.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 176 KiB |
BIN
img/album5.png
Normal file
BIN
img/album5.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 102 KiB |
BIN
img/album6.png
Normal file
BIN
img/album6.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 116 KiB |
BIN
img/bride.png
Normal file
BIN
img/bride.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 93 KiB |
BIN
img/couple-1.png
Normal file
BIN
img/couple-1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
BIN
img/groom.png
Normal file
BIN
img/groom.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 105 KiB |
BIN
img/images-loader.gif
Normal file
BIN
img/images-loader.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 47 KiB |
BIN
img/kita.png
Normal file
BIN
img/kita.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 102 KiB |
611
index.html
Normal file
611
index.html
Normal file
@ -0,0 +1,611 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Wedding Invitation - Atep & Arty </title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
|
||||||
|
<meta property="og:image" content="img/kita.png">
|
||||||
|
<meta property="og:image:width" content="300">
|
||||||
|
<meta property="og:image:height" content="300">
|
||||||
|
<meta property="og:title" content="Wedding Invitation - Atep & Arty ">
|
||||||
|
<meta property="og:description" content="Hello ! Kamu Di Undang..">
|
||||||
|
<meta property="og:type" content="article">
|
||||||
|
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
|
||||||
|
<meta http-equiv="Pragma" content="no-cache">
|
||||||
|
<meta http-equiv="Expires" content="0">
|
||||||
|
<link rel="icon" href="">
|
||||||
|
|
||||||
|
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Work+Sans:400,300,600,400italic,700" rel="stylesheet"
|
||||||
|
type="text/css">
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Sacramento" rel="stylesheet">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="css/bootstrap.min.css">
|
||||||
|
|
||||||
|
<!-- Animate.css -->
|
||||||
|
<link rel="stylesheet" href="css/css-animate.css">
|
||||||
|
<!-- Icomoon Icon Fonts-->
|
||||||
|
<link rel="stylesheet" href="css/css-icomoon.css">
|
||||||
|
<!-- Bootstrap -->
|
||||||
|
<link rel="stylesheet" href="css/css-bootstrap.css">
|
||||||
|
|
||||||
|
<!-- Magnific Popup -->
|
||||||
|
<link rel="stylesheet" href="css/css-magnific-popup.css">
|
||||||
|
|
||||||
|
<!-- Owl Carousel -->
|
||||||
|
<link rel="stylesheet" href="css/css-owl.carousel.min.css">
|
||||||
|
<link rel="stylesheet" href="css/css-owl.theme.default.min.css">
|
||||||
|
|
||||||
|
<!--lightbox-->
|
||||||
|
<link href="css/lightbox.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Theme style -->
|
||||||
|
<link rel="stylesheet" href="css/css-style.css">
|
||||||
|
|
||||||
|
|
||||||
|
<!-- icon -->
|
||||||
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
|
||||||
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||||
|
<link href="css/material-components-web.css" rel="stylesheet">
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Modernizr JS -->
|
||||||
|
<script src="js/js-modernizr-2.6.2.min.js"></script>
|
||||||
|
<!-- FOR IE9 below -->
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="css/ket2.css">
|
||||||
|
<link rel="stylesheet" href="css/ket.css">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
|
||||||
|
<div id="loader" class="fh5co-loader"></div>
|
||||||
|
<!-- SPLASHSCREEN -->
|
||||||
|
<div id="splashscreen">
|
||||||
|
<div class="splashscreen-bg"></div>
|
||||||
|
<div class="tengah">
|
||||||
|
<p>The Wedding Of</p>
|
||||||
|
<h1 style="font-size:80px;color:white;margin-top:-30px;">Arty & Atep </h1>
|
||||||
|
<p style="margin-top:30px;">Kepada Yth.<br>
|
||||||
|
<a href="#" onclick="return OpenInvitation();">
|
||||||
|
<button class="btn-depan btn-4 btn-sep-depan icon-send popup1_open" data-popup-ordinal="0"
|
||||||
|
id="open_92089009">BUKA</button>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- END SPLASHSCREEN -->
|
||||||
|
|
||||||
|
<!-- ============== MUSIK =============== -->
|
||||||
|
<audio loop="true" src="musik/musik.mp3" id="audio"></audio>
|
||||||
|
<!-- ============== MUSIK =============== -->
|
||||||
|
|
||||||
|
<div style="display: none;" id="page"><a href="#"
|
||||||
|
class="js-fh5co-nav-toggle fh5co-nav-toggle fh5co-nav-white"><i></i></a>
|
||||||
|
<div id="fh5co-offcanvas"></div>
|
||||||
|
<header id="fh5co-header" class="fh5co-cover" role="banner" data-stellar-background-ratio="0.5"
|
||||||
|
style="background-position: -25px -25px;">
|
||||||
|
<div id="fh5co-header">
|
||||||
|
<div class="overlay"></div>
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-8 col-md-offset-2 text-center">
|
||||||
|
<div class="display-t">
|
||||||
|
<div class="display-tc animate-box fadeIn animated-fast" data-animate-effect="fadeIn">
|
||||||
|
<div style="color:#fff;margin-top:250px;">
|
||||||
|
|
||||||
|
<p>The Wedding Of</p>
|
||||||
|
|
||||||
|
<h1 style="margin-top:-40px">
|
||||||
|
Arty & Atep </h1>
|
||||||
|
<p><span>06 - 06 - 2021</span></p>
|
||||||
|
<p>
|
||||||
|
<a href="#fh5co-couple" class="icon-scroll"></a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div style="clear:both">
|
||||||
|
<br>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div id="fh5co-couple">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-8 col-md-offset-2 text-center animate-box fadeInUp animated-fast">
|
||||||
|
<h1 style="color:#304058;font-size:50px">Hello!</h1>
|
||||||
|
<p><i style="white-space:pre-line;">Assalamu'alaikum warahmatullahi wabarakatuh
|
||||||
|
Izinkan kami mengundang sekaligus mengharapkan doa restu dari bapak/ibu dan
|
||||||
|
rekan-rekan dalam acara pernikahan kami</i>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="couple-wrap animate-box fadeInUp animated-fast">
|
||||||
|
<div class="couple-half">
|
||||||
|
<div class="groom"> <img src="img/bride.png?nocache=1440" alt="groom" class="img-responsive">
|
||||||
|
</div>
|
||||||
|
<div class="desc-groom">
|
||||||
|
<h3 style="color:#304058;">
|
||||||
|
Arty Artya Melinda</h3>
|
||||||
|
<!-- untuk deskripsi mempelai -->
|
||||||
|
<p>
|
||||||
|
<i style="font-size:12px;">Putri dari :</i>
|
||||||
|
<br>
|
||||||
|
Bapak Arbi Sahtiadin & Ibu Oneng Nurhayati
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<p class="heart text-center"><i class="icon-heart2" style="color:#304058;"></i></p>
|
||||||
|
<div class="couple-half">
|
||||||
|
<div class="bride"> <img src="img/groom.png?nocache=1440" alt="groom" class="img-responsive">
|
||||||
|
</div>
|
||||||
|
<div class="desc-bride">
|
||||||
|
<h3 style="color:#304058;">
|
||||||
|
Atep Jaenudin</h3>
|
||||||
|
<!-- untuk deskripsi mempelai -->
|
||||||
|
<p><i style="font-size:12px;">Putra dari :</i>
|
||||||
|
<br>
|
||||||
|
Bapak H Enyang & Ibu H Atik
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-12" style="text-align:center;font-size:12px;">
|
||||||
|
<br><i style="white-space:pre-line;">''
|
||||||
|
Dan di antara tanda-tanda kekuasaan-Nya ialah Dia menciptakan untukmu isteri-isteri dari
|
||||||
|
jenismu sendiri, supaya kamu cenderung dan merasa tenteram kepadanya, dan dijadikan-Nya
|
||||||
|
diantaramu rasa kasih dan sayang. Sesungguhnya pada yang demikian itu benar-benar
|
||||||
|
terdapat tanda-tanda bagi kaum yang berfikir.
|
||||||
|
''
|
||||||
|
QS Ar-Rum : 21</i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- ============== PHP GET DATA TANGGAL =============== -->
|
||||||
|
<!-- ============== PHP GET DATA TANGGAL =============== -->
|
||||||
|
<div id="fh5co-event" class="fh5co-bg paralax-acara" style="background-color:#304058; min-height:0px;">
|
||||||
|
<div class="overlay"></div>
|
||||||
|
<div class="container">
|
||||||
|
<!--
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-8 col-md-offset-2 text-center animate-box">
|
||||||
|
<h2 style="color:#fff;font-size:30px">Wedding Events</h2>
|
||||||
|
</div>
|
||||||
|
</div>-->
|
||||||
|
<div class="row">
|
||||||
|
<div class="display-t">
|
||||||
|
<div class="display-tc">
|
||||||
|
<div class="col-md-10 col-md-offset-1">
|
||||||
|
|
||||||
|
|
||||||
|
<div class="col-md-6 col-sm-6 text-center" style="margin-bottom:10px;">
|
||||||
|
<div class="event-wrap animate-box fadeInUp animated-fast">
|
||||||
|
<h3>Akad</h3>
|
||||||
|
<div class="event-col">
|
||||||
|
<i class="icon-clock"></i>
|
||||||
|
<span>
|
||||||
|
80.00 Pagi </span>
|
||||||
|
</div>
|
||||||
|
<div class="event-col"> <i class="icon-calendar"></i> <span>Minggu, 6
|
||||||
|
Juni 2021</span> </div>
|
||||||
|
<p>
|
||||||
|
<label style="font-weight:normal; font-size:22px;">
|
||||||
|
Gedung Herlina Mutiara </label>
|
||||||
|
<br>
|
||||||
|
Jl. Pramuka, Bojong, Karangtengah, Kabupaten Cianjur, Jawa Barat
|
||||||
|
43281
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6 col-sm-6 text-center" style="margin-bottom:10px;">
|
||||||
|
<div class="event-wrap animate-box fadeInUp animated-fast">
|
||||||
|
<h3>Resepsi</h3>
|
||||||
|
<div class="event-col">
|
||||||
|
<i class="icon-clock"></i> <span>
|
||||||
|
10.00 - 14.00 </span>
|
||||||
|
</div>
|
||||||
|
<div class="event-col"> <i class="icon-calendar"></i> <span>Minggu, 6
|
||||||
|
Juni 2021</span> </div>
|
||||||
|
<p>
|
||||||
|
<label style="font-weight:normal; font-size:22px;">
|
||||||
|
Gedung Herlina Mutiara </label>
|
||||||
|
<br>
|
||||||
|
Jl. Pramuka, Bojong, Karangtengah, Kabupaten Cianjur, Jawa Barat
|
||||||
|
43281
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="col-md-8 col-md-offset-2 text-center animate-box fadeInUp animated-fast">
|
||||||
|
<a href="https://youtu.be/Ev-Rgy8HabA" target="_blank"
|
||||||
|
class="streaming mdc-button mdc-button--raised">
|
||||||
|
<i class="material-icons mdc-button__icon">play_arrow</i>
|
||||||
|
LIVE STREAMING
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="fh5co-couple-story">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-8 col-md-offset-2 text-center fh5co-heading animate-box fadeInUp animated-fast">
|
||||||
|
<h1 style="color:#304058;">Cerita Kita</h1>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-12 col-md-offset-0">
|
||||||
|
<ul class="timeline animate-box fadeInUp animated-fast">
|
||||||
|
<!-- GET DATA -->
|
||||||
|
<!-- ELSE -->
|
||||||
|
<li class="timeline-inverted animate-box fadeInUp animated-fast">
|
||||||
|
<div class="timeline-badge"
|
||||||
|
style="background-color:#304058; background-image:url(img/couple-1.png);">
|
||||||
|
</div>
|
||||||
|
<div class="timeline-panel">
|
||||||
|
<div class="timeline-heading">
|
||||||
|
<h3 class="timeline-title">Pertama bertemu</h3>
|
||||||
|
<img src="img/album1.png" alt="img" class="timeline-img">
|
||||||
|
<span class="date">14 Januari 2020</span>
|
||||||
|
</div>
|
||||||
|
<div class="timeline-body">
|
||||||
|
<p>
|
||||||
|
Waktu Pertama Kali
|
||||||
|
Kulihat Dirimu Hadir
|
||||||
|
Rasa hati ini inginkan dirimu </p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<!--TUTUP PHP -->
|
||||||
|
<!-- GET DATA -->
|
||||||
|
<li class="animate-box fadeInUp animated-fast">
|
||||||
|
<div class="timeline-badge"
|
||||||
|
style="background-color:#304058; background-image:url(img/couple-1.png);">
|
||||||
|
</div>
|
||||||
|
<div class="timeline-panel">
|
||||||
|
<div class="timeline-heading">
|
||||||
|
<h3 class="timeline-title">Jatuh Cinta</h3>
|
||||||
|
<img src="img/album2.png" alt="img" class="timeline-img">
|
||||||
|
<span class="date">15 Maret 2020</span>
|
||||||
|
</div>
|
||||||
|
<div class="timeline-body">
|
||||||
|
<p>
|
||||||
|
Hati tenang mendengar
|
||||||
|
suara indah menyapa
|
||||||
|
Geloranya hati ini
|
||||||
|
Tak ku sangka.. </p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<!-- ELSE -->
|
||||||
|
<!-- ELSE -->
|
||||||
|
<li class="timeline-inverted animate-box fadeInUp animated-fast">
|
||||||
|
<div class="timeline-badge"
|
||||||
|
style="background-color:#304058; background-image:url(img/couple-1.png);">
|
||||||
|
</div>
|
||||||
|
<div class="timeline-panel">
|
||||||
|
<div class="timeline-heading">
|
||||||
|
<h3 class="timeline-title">Ta'aruf</h3>
|
||||||
|
<img src="img/album3.png" alt="img" class="timeline-img"><span class="date">1
|
||||||
|
Mei 2020</span>
|
||||||
|
</div>
|
||||||
|
<div class="timeline-body">
|
||||||
|
<p>
|
||||||
|
Rasa ini.. tak tertahan..
|
||||||
|
Hati ini..slalu untukmu.. </p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<!--TUTUP PHP -->
|
||||||
|
<!-- GET DATA -->
|
||||||
|
<li class="animate-box fadeInUp animated-fast">
|
||||||
|
<div class="timeline-badge"
|
||||||
|
style="background-color:#304058; background-image:url(img/couple-1.png);">
|
||||||
|
</div>
|
||||||
|
<div class="timeline-panel">
|
||||||
|
<div class="timeline-heading">
|
||||||
|
<h3 class="timeline-title">Khitbah</h3>
|
||||||
|
<img src="img/album4.png" alt="img" class="timeline-img">
|
||||||
|
<span class="date">16 Mei 2020</span>
|
||||||
|
</div>
|
||||||
|
<div class="timeline-body">
|
||||||
|
<p>
|
||||||
|
Terimalah lagu ini dari orang biasa
|
||||||
|
Tapi cintaku padamu luar biasa
|
||||||
|
Aku tak punya bunga
|
||||||
|
Aku tak punya harta
|
||||||
|
Yang ku punya hanyalah
|
||||||
|
Hati yang setia.. Tulus.. Padamu.. :) </p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<!-- ELSE -->
|
||||||
|
<!--TUTUP PHP -->
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="fh5co-gallery" class="fh5co-section-gray">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-8 col-md-offset-2 text-center fh5co-heading animate-box fadeInUp animated-fast">
|
||||||
|
<h1 style="color:#304058;">Gallery</h1>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row row-bottom-padded-md">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<ul id="fh5co-gallery-list">
|
||||||
|
<!-- GET DATA -->
|
||||||
|
<!-- GET DATA -->
|
||||||
|
<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
|
||||||
|
style="background-image: url(img/album1.png);">
|
||||||
|
<a href="img/album1.png" data-lightbox="roadtrip">
|
||||||
|
<div class="case-studies-summary"> <span></span>
|
||||||
|
<h2></h2>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<!-- CLOSE DATA -->
|
||||||
|
<!-- GET DATA -->
|
||||||
|
<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
|
||||||
|
style="background-image: url(img/album2.png);">
|
||||||
|
<a href="img/album2.png" data-lightbox="roadtrip">
|
||||||
|
<div class="case-studies-summary"> <span></span>
|
||||||
|
<h2></h2>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<!-- CLOSE DATA -->
|
||||||
|
<!-- GET DATA -->
|
||||||
|
<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
|
||||||
|
style="background-image: url(img/album3.png);">
|
||||||
|
<a href="img/album3.png" data-lightbox="roadtrip">
|
||||||
|
<div class="case-studies-summary"> <span></span>
|
||||||
|
<h2></h2>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<!-- CLOSE DATA -->
|
||||||
|
<!-- GET DATA -->
|
||||||
|
<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
|
||||||
|
style="background-image: url(img/album4.png);">
|
||||||
|
<a href="img/album4.png" data-lightbox="roadtrip">
|
||||||
|
<div class="case-studies-summary"> <span></span>
|
||||||
|
<h2></h2>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<!-- CLOSE DATA -->
|
||||||
|
<!-- GET DATA -->
|
||||||
|
<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
|
||||||
|
style="background-image: url(img/album5.png);">
|
||||||
|
<a href="img/album5.png" data-lightbox="roadtrip">
|
||||||
|
<div class="case-studies-summary"> <span></span>
|
||||||
|
<h2></h2>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<!-- CLOSE DATA -->
|
||||||
|
<!-- GET DATA -->
|
||||||
|
<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
|
||||||
|
style="background-image: url(img/album6.png);">
|
||||||
|
<a href="img/album6.png" data-lightbox="roadtrip">
|
||||||
|
<div class="case-studies-summary"> <span></span>
|
||||||
|
<h2></h2>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<!-- CLOSE DATA -->
|
||||||
|
|
||||||
|
|
||||||
|
<!-- GET DATA YT -->
|
||||||
|
<div class="videoWrapper" style="width:100%;">
|
||||||
|
<center>
|
||||||
|
<object data="https://www.youtube.com/embed/hrVyGEvVu7k"> </object>
|
||||||
|
</center>
|
||||||
|
</div>
|
||||||
|
<!-- CLOSE DATA -->
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="fh5co-maps" class="fh5co-bg scrolltomap" style="background-color:#304058;">
|
||||||
|
<div class="overlay"></div>
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-8 col-md-offset-2 text-center animate-box fadeInUp animated-fast">
|
||||||
|
<h1 class="color-putih" style="margin-top:30px;">Find Us</h1>
|
||||||
|
|
||||||
|
<p style="color:#fff;">
|
||||||
|
Gedung Herlina Mutiara <br>
|
||||||
|
Jl. Pramuka, Bojong, Karangtengah, Kabupaten Cianjur, Jawa Barat 43281 </p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="display-t">
|
||||||
|
<div class="display-tc">
|
||||||
|
<div class="col-md-10 col-md-offset-1">
|
||||||
|
<div style="text-align:center;">
|
||||||
|
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
|
||||||
|
<style>
|
||||||
|
@media (max-width: 575.98px) {
|
||||||
|
.maps iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 350px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 576px) {
|
||||||
|
.maps iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 350px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.maps iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 450px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 992px) {
|
||||||
|
.maps iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 500px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<div style="margin-bottom:50px;" id="maps">
|
||||||
|
<iframe width="100%" height="450px" frameborder="0" style="border:0"
|
||||||
|
src="https://www.google.com/maps/embed/v1/place?q=-6.794355,107.172731&key=AIzaSyBkXrQtu34bjG_8Apa0cvNENa_7frfCE2w">
|
||||||
|
</iframe>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p> © Copyright 2022, <a href="">MSN PRODUCTION - PT. Mulia Sejati Nusantara.</a> All Rights Reserved
|
||||||
|
</p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- MUTE BUTTON -->
|
||||||
|
<a id="mute" href="#/" onclick="mute()" class="floatmute">
|
||||||
|
<i color="#fff" class="fa fa-volume-up my-float"></i>
|
||||||
|
</a>
|
||||||
|
<!-- MUTE BUTTON -->
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="gototop js-top">
|
||||||
|
<a href="#fh5co-header" class="js-gotop"><i class="icon-arrow-up"></i></a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const splashscreen = document.getElementById("splashscreen")
|
||||||
|
const page = document.getElementById("page")
|
||||||
|
|
||||||
|
function OpenInvitation() {
|
||||||
|
splashscreen.style.display = "none"
|
||||||
|
page.style.display = "block"
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="js/2.1.3-jquery.min.js"></script>
|
||||||
|
<script src="js/js-bootstrap.min.js"></script>
|
||||||
|
|
||||||
|
<!-- jQuery -->
|
||||||
|
<!-- <script src="js/jquery.min.js"></script> -->
|
||||||
|
|
||||||
|
<!-- jQuery Easing -->
|
||||||
|
<script src="js/js-jquery.easing.1.3.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- JS AREA -->
|
||||||
|
<script src="js/moment-with-locales.js"></script>
|
||||||
|
|
||||||
|
<script src="js/lightbox.js"></script>
|
||||||
|
<!-- <script src="//cdn.jsdelivr.net/npm/less@3.13"></script> -->
|
||||||
|
<!-- Waypoints -->
|
||||||
|
<script src="js/js-jquery.waypoints.min.js"></script>
|
||||||
|
<!-- Carousel -->
|
||||||
|
<script src="js/js-owl.carousel.min.js"></script>
|
||||||
|
<!-- countTo -->
|
||||||
|
<script src="js/js-jquery.countTo.js"></script>
|
||||||
|
|
||||||
|
<!-- Stellar -->
|
||||||
|
<script src="js/js-jquery.stellar.min.js"></script>
|
||||||
|
<!-- Magnific Popup -->
|
||||||
|
<script src="js/js-jquery.magnific-popup.min.js"></script>
|
||||||
|
|
||||||
|
<script src="js/js-simplyCountdown.js"></script>
|
||||||
|
<!-- Main -->
|
||||||
|
<script src="js/js-main.js"></script>
|
||||||
|
|
||||||
|
<script src="js/js-index.js"></script>
|
||||||
|
|
||||||
|
<!-- VALIDASI DONASI -->
|
||||||
|
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
|
||||||
|
|
||||||
|
<script src="js/jquery.popupoverlay.min.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!--script mute-->
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.addEventListener("DOMContentLoaded", function (event) {
|
||||||
|
let audio = document.getElementById("audio");
|
||||||
|
let button = document.getElementById('mute');
|
||||||
|
if (+localStorage.getItem('mute')) {
|
||||||
|
audio.muted = true;
|
||||||
|
button.innerHTML = '<i color="#000" class="fa fa-volume-off my-float"></i>';
|
||||||
|
audio.pause()
|
||||||
|
} else {
|
||||||
|
audio.volume = 0.9;
|
||||||
|
audio.play()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
function mute() {
|
||||||
|
let audio = document.getElementById('audio');
|
||||||
|
let button = document.getElementById('mute');
|
||||||
|
let isMute = +localStorage.getItem('mute');
|
||||||
|
if (!isMute) {
|
||||||
|
audio.muted = true;
|
||||||
|
audio.pause()
|
||||||
|
button.innerHTML = '<i color="#000" class="fa fa-volume-off my-float"></i>';
|
||||||
|
localStorage.setItem('mute', 1);
|
||||||
|
} else {
|
||||||
|
audio.muted = false;
|
||||||
|
audio.volume = 0.9;
|
||||||
|
audio.play()
|
||||||
|
button.innerHTML = '<i color="#fff" class="fa fa-volume-up my-float"></i>';
|
||||||
|
localStorage.setItem('mute', 0);
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!--end script mute-->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
5
js/2.1.3-jquery.min.js
vendored
Normal file
5
js/2.1.3-jquery.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
2
js/jquery-3.3.1.slim.min.js
vendored
Normal file
2
js/jquery-3.3.1.slim.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
8
js/jquery.popupoverlay.min.js
vendored
Normal file
8
js/jquery.popupoverlay.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
4
js/jquery.validate.min.js
vendored
Normal file
4
js/jquery.validate.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
7
js/js-bootstrap.min.js
vendored
Normal file
7
js/js-bootstrap.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
3
js/js-index.js
Normal file
3
js/js-index.js
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
$(window).load(function(){
|
||||||
|
$('#myModal').modal('show');
|
||||||
|
});
|
||||||
130
js/js-jquery.countTo.js
Normal file
130
js/js-jquery.countTo.js
Normal file
@ -0,0 +1,130 @@
|
|||||||
|
(function (factory) {
|
||||||
|
if (typeof define === 'function' && define.amd) {
|
||||||
|
// AMD
|
||||||
|
define(['jquery'], factory);
|
||||||
|
} else if (typeof exports === 'object') {
|
||||||
|
// CommonJS
|
||||||
|
factory(require('jquery'));
|
||||||
|
} else {
|
||||||
|
// Browser globals
|
||||||
|
factory(jQuery);
|
||||||
|
}
|
||||||
|
}(function ($) {
|
||||||
|
var CountTo = function (element, options) {
|
||||||
|
this.$element = $(element);
|
||||||
|
this.options = $.extend({}, CountTo.DEFAULTS, this.dataOptions(), options);
|
||||||
|
this.init();
|
||||||
|
};
|
||||||
|
|
||||||
|
CountTo.DEFAULTS = {
|
||||||
|
from: 0, // the number the element should start at
|
||||||
|
to: 0, // the number the element should end at
|
||||||
|
speed: 1000, // how long it should take to count between the target numbers
|
||||||
|
refreshInterval: 100, // how often the element should be updated
|
||||||
|
decimals: 0, // the number of decimal places to show
|
||||||
|
formatter: formatter, // handler for formatting the value before rendering
|
||||||
|
onUpdate: null, // callback method for every time the element is updated
|
||||||
|
onComplete: null // callback method for when the element finishes updating
|
||||||
|
};
|
||||||
|
|
||||||
|
CountTo.prototype.init = function () {
|
||||||
|
this.value = this.options.from;
|
||||||
|
this.loops = Math.ceil(this.options.speed / this.options.refreshInterval);
|
||||||
|
this.loopCount = 0;
|
||||||
|
this.increment = (this.options.to - this.options.from) / this.loops;
|
||||||
|
};
|
||||||
|
|
||||||
|
CountTo.prototype.dataOptions = function () {
|
||||||
|
var options = {
|
||||||
|
from: this.$element.data('from'),
|
||||||
|
to: this.$element.data('to'),
|
||||||
|
speed: this.$element.data('speed'),
|
||||||
|
refreshInterval: this.$element.data('refresh-interval'),
|
||||||
|
decimals: this.$element.data('decimals')
|
||||||
|
};
|
||||||
|
|
||||||
|
var keys = Object.keys(options);
|
||||||
|
|
||||||
|
for (var i in keys) {
|
||||||
|
var key = keys[i];
|
||||||
|
|
||||||
|
if (typeof(options[key]) === 'undefined') {
|
||||||
|
delete options[key];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return options;
|
||||||
|
};
|
||||||
|
|
||||||
|
CountTo.prototype.update = function () {
|
||||||
|
this.value += this.increment;
|
||||||
|
this.loopCount++;
|
||||||
|
|
||||||
|
this.render();
|
||||||
|
|
||||||
|
if (typeof(this.options.onUpdate) == 'function') {
|
||||||
|
this.options.onUpdate.call(this.$element, this.value);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.loopCount >= this.loops) {
|
||||||
|
clearInterval(this.interval);
|
||||||
|
this.value = this.options.to;
|
||||||
|
|
||||||
|
if (typeof(this.options.onComplete) == 'function') {
|
||||||
|
this.options.onComplete.call(this.$element, this.value);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
CountTo.prototype.render = function () {
|
||||||
|
var formattedValue = this.options.formatter.call(this.$element, this.value, this.options);
|
||||||
|
this.$element.text(formattedValue);
|
||||||
|
};
|
||||||
|
|
||||||
|
CountTo.prototype.restart = function () {
|
||||||
|
this.stop();
|
||||||
|
this.init();
|
||||||
|
this.start();
|
||||||
|
};
|
||||||
|
|
||||||
|
CountTo.prototype.start = function () {
|
||||||
|
this.stop();
|
||||||
|
this.render();
|
||||||
|
this.interval = setInterval(this.update.bind(this), this.options.refreshInterval);
|
||||||
|
};
|
||||||
|
|
||||||
|
CountTo.prototype.stop = function () {
|
||||||
|
if (this.interval) {
|
||||||
|
clearInterval(this.interval);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
CountTo.prototype.toggle = function () {
|
||||||
|
if (this.interval) {
|
||||||
|
this.stop();
|
||||||
|
} else {
|
||||||
|
this.start();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function formatter(value, options) {
|
||||||
|
return value.toFixed(options.decimals);
|
||||||
|
}
|
||||||
|
|
||||||
|
$.fn.countTo = function (option) {
|
||||||
|
return this.each(function () {
|
||||||
|
var $this = $(this);
|
||||||
|
var data = $this.data('countTo');
|
||||||
|
var init = !data || typeof(option) === 'object';
|
||||||
|
var options = typeof(option) === 'object' ? option : {};
|
||||||
|
var method = typeof(option) === 'string' ? option : 'start';
|
||||||
|
|
||||||
|
if (init) {
|
||||||
|
if (data) data.stop();
|
||||||
|
$this.data('countTo', data = new CountTo(this, options));
|
||||||
|
}
|
||||||
|
|
||||||
|
data[method].call(data);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
}));
|
||||||
205
js/js-jquery.easing.1.3.js
Normal file
205
js/js-jquery.easing.1.3.js
Normal file
@ -0,0 +1,205 @@
|
|||||||
|
/*
|
||||||
|
* jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
|
||||||
|
*
|
||||||
|
* Uses the built in easing capabilities added In jQuery 1.1
|
||||||
|
* to offer multiple easing options
|
||||||
|
*
|
||||||
|
* TERMS OF USE - jQuery Easing
|
||||||
|
*
|
||||||
|
* Open source under the BSD License.
|
||||||
|
*
|
||||||
|
* Copyright © 2008 George McGinley Smith
|
||||||
|
* All rights reserved.
|
||||||
|
*
|
||||||
|
* Redistribution and use in source and binary forms, with or without modification,
|
||||||
|
* are permitted provided that the following conditions are met:
|
||||||
|
*
|
||||||
|
* Redistributions of source code must retain the above copyright notice, this list of
|
||||||
|
* conditions and the following disclaimer.
|
||||||
|
* Redistributions in binary form must reproduce the above copyright notice, this list
|
||||||
|
* of conditions and the following disclaimer in the documentation and/or other materials
|
||||||
|
* provided with the distribution.
|
||||||
|
*
|
||||||
|
* Neither the name of the author nor the names of contributors may be used to endorse
|
||||||
|
* or promote products derived from this software without specific prior written permission.
|
||||||
|
*
|
||||||
|
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
|
||||||
|
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
|
||||||
|
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
|
||||||
|
* COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
|
||||||
|
* EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
|
||||||
|
* GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
|
||||||
|
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
|
||||||
|
* NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
|
||||||
|
* OF THE POSSIBILITY OF SUCH DAMAGE.
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
// t: current time, b: begInnIng value, c: change In value, d: duration
|
||||||
|
jQuery.easing['jswing'] = jQuery.easing['swing'];
|
||||||
|
|
||||||
|
jQuery.extend( jQuery.easing,
|
||||||
|
{
|
||||||
|
def: 'easeOutQuad',
|
||||||
|
swing: function (x, t, b, c, d) {
|
||||||
|
//alert(jQuery.easing.default);
|
||||||
|
return jQuery.easing[jQuery.easing.def](x, t, b, c, d);
|
||||||
|
},
|
||||||
|
easeInQuad: function (x, t, b, c, d) {
|
||||||
|
return c*(t/=d)*t + b;
|
||||||
|
},
|
||||||
|
easeOutQuad: function (x, t, b, c, d) {
|
||||||
|
return -c *(t/=d)*(t-2) + b;
|
||||||
|
},
|
||||||
|
easeInOutQuad: function (x, t, b, c, d) {
|
||||||
|
if ((t/=d/2) < 1) return c/2*t*t + b;
|
||||||
|
return -c/2 * ((--t)*(t-2) - 1) + b;
|
||||||
|
},
|
||||||
|
easeInCubic: function (x, t, b, c, d) {
|
||||||
|
return c*(t/=d)*t*t + b;
|
||||||
|
},
|
||||||
|
easeOutCubic: function (x, t, b, c, d) {
|
||||||
|
return c*((t=t/d-1)*t*t + 1) + b;
|
||||||
|
},
|
||||||
|
easeInOutCubic: function (x, t, b, c, d) {
|
||||||
|
if ((t/=d/2) < 1) return c/2*t*t*t + b;
|
||||||
|
return c/2*((t-=2)*t*t + 2) + b;
|
||||||
|
},
|
||||||
|
easeInQuart: function (x, t, b, c, d) {
|
||||||
|
return c*(t/=d)*t*t*t + b;
|
||||||
|
},
|
||||||
|
easeOutQuart: function (x, t, b, c, d) {
|
||||||
|
return -c * ((t=t/d-1)*t*t*t - 1) + b;
|
||||||
|
},
|
||||||
|
easeInOutQuart: function (x, t, b, c, d) {
|
||||||
|
if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
|
||||||
|
return -c/2 * ((t-=2)*t*t*t - 2) + b;
|
||||||
|
},
|
||||||
|
easeInQuint: function (x, t, b, c, d) {
|
||||||
|
return c*(t/=d)*t*t*t*t + b;
|
||||||
|
},
|
||||||
|
easeOutQuint: function (x, t, b, c, d) {
|
||||||
|
return c*((t=t/d-1)*t*t*t*t + 1) + b;
|
||||||
|
},
|
||||||
|
easeInOutQuint: function (x, t, b, c, d) {
|
||||||
|
if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
|
||||||
|
return c/2*((t-=2)*t*t*t*t + 2) + b;
|
||||||
|
},
|
||||||
|
easeInSine: function (x, t, b, c, d) {
|
||||||
|
return -c * Math.cos(t/d * (Math.PI/2)) + c + b;
|
||||||
|
},
|
||||||
|
easeOutSine: function (x, t, b, c, d) {
|
||||||
|
return c * Math.sin(t/d * (Math.PI/2)) + b;
|
||||||
|
},
|
||||||
|
easeInOutSine: function (x, t, b, c, d) {
|
||||||
|
return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
|
||||||
|
},
|
||||||
|
easeInExpo: function (x, t, b, c, d) {
|
||||||
|
return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
|
||||||
|
},
|
||||||
|
easeOutExpo: function (x, t, b, c, d) {
|
||||||
|
return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
|
||||||
|
},
|
||||||
|
easeInOutExpo: function (x, t, b, c, d) {
|
||||||
|
if (t==0) return b;
|
||||||
|
if (t==d) return b+c;
|
||||||
|
if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
|
||||||
|
return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
|
||||||
|
},
|
||||||
|
easeInCirc: function (x, t, b, c, d) {
|
||||||
|
return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;
|
||||||
|
},
|
||||||
|
easeOutCirc: function (x, t, b, c, d) {
|
||||||
|
return c * Math.sqrt(1 - (t=t/d-1)*t) + b;
|
||||||
|
},
|
||||||
|
easeInOutCirc: function (x, t, b, c, d) {
|
||||||
|
if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b;
|
||||||
|
return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b;
|
||||||
|
},
|
||||||
|
easeInElastic: function (x, t, b, c, d) {
|
||||||
|
var s=1.70158;var p=0;var a=c;
|
||||||
|
if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
|
||||||
|
if (a < Math.abs(c)) { a=c; var s=p/4; }
|
||||||
|
else var s = p/(2*Math.PI) * Math.asin (c/a);
|
||||||
|
return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
|
||||||
|
},
|
||||||
|
easeOutElastic: function (x, t, b, c, d) {
|
||||||
|
var s=1.70158;var p=0;var a=c;
|
||||||
|
if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
|
||||||
|
if (a < Math.abs(c)) { a=c; var s=p/4; }
|
||||||
|
else var s = p/(2*Math.PI) * Math.asin (c/a);
|
||||||
|
return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
|
||||||
|
},
|
||||||
|
easeInOutElastic: function (x, t, b, c, d) {
|
||||||
|
var s=1.70158;var p=0;var a=c;
|
||||||
|
if (t==0) return b; if ((t/=d/2)==2) return b+c; if (!p) p=d*(.3*1.5);
|
||||||
|
if (a < Math.abs(c)) { a=c; var s=p/4; }
|
||||||
|
else var s = p/(2*Math.PI) * Math.asin (c/a);
|
||||||
|
if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
|
||||||
|
return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
|
||||||
|
},
|
||||||
|
easeInBack: function (x, t, b, c, d, s) {
|
||||||
|
if (s == undefined) s = 1.70158;
|
||||||
|
return c*(t/=d)*t*((s+1)*t - s) + b;
|
||||||
|
},
|
||||||
|
easeOutBack: function (x, t, b, c, d, s) {
|
||||||
|
if (s == undefined) s = 1.70158;
|
||||||
|
return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
|
||||||
|
},
|
||||||
|
easeInOutBack: function (x, t, b, c, d, s) {
|
||||||
|
if (s == undefined) s = 1.70158;
|
||||||
|
if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
|
||||||
|
return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
|
||||||
|
},
|
||||||
|
easeInBounce: function (x, t, b, c, d) {
|
||||||
|
return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b;
|
||||||
|
},
|
||||||
|
easeOutBounce: function (x, t, b, c, d) {
|
||||||
|
if ((t/=d) < (1/2.75)) {
|
||||||
|
return c*(7.5625*t*t) + b;
|
||||||
|
} else if (t < (2/2.75)) {
|
||||||
|
return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
|
||||||
|
} else if (t < (2.5/2.75)) {
|
||||||
|
return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
|
||||||
|
} else {
|
||||||
|
return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
easeInOutBounce: function (x, t, b, c, d) {
|
||||||
|
if (t < d/2) return jQuery.easing.easeInBounce (x, t*2, 0, c, d) * .5 + b;
|
||||||
|
return jQuery.easing.easeOutBounce (x, t*2-d, 0, c, d) * .5 + c*.5 + b;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/*
|
||||||
|
*
|
||||||
|
* TERMS OF USE - EASING EQUATIONS
|
||||||
|
*
|
||||||
|
* Open source under the BSD License.
|
||||||
|
*
|
||||||
|
* Copyright © 2001 Robert Penner
|
||||||
|
* All rights reserved.
|
||||||
|
*
|
||||||
|
* Redistribution and use in source and binary forms, with or without modification,
|
||||||
|
* are permitted provided that the following conditions are met:
|
||||||
|
*
|
||||||
|
* Redistributions of source code must retain the above copyright notice, this list of
|
||||||
|
* conditions and the following disclaimer.
|
||||||
|
* Redistributions in binary form must reproduce the above copyright notice, this list
|
||||||
|
* of conditions and the following disclaimer in the documentation and/or other materials
|
||||||
|
* provided with the distribution.
|
||||||
|
*
|
||||||
|
* Neither the name of the author nor the names of contributors may be used to endorse
|
||||||
|
* or promote products derived from this software without specific prior written permission.
|
||||||
|
*
|
||||||
|
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
|
||||||
|
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
|
||||||
|
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
|
||||||
|
* COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
|
||||||
|
* EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
|
||||||
|
* GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
|
||||||
|
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
|
||||||
|
* NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
|
||||||
|
* OF THE POSSIBILITY OF SUCH DAMAGE.
|
||||||
|
*
|
||||||
|
*/
|
||||||
4
js/js-jquery.magnific-popup.min.js
vendored
Normal file
4
js/js-jquery.magnific-popup.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
2
js/js-jquery.stellar.min.js
vendored
Normal file
2
js/js-jquery.stellar.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
7
js/js-jquery.waypoints.min.js
vendored
Normal file
7
js/js-jquery.waypoints.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
0
js/js-magnific-popup-options.js
Normal file
0
js/js-magnific-popup-options.js
Normal file
233
js/js-main.js
Normal file
233
js/js-main.js
Normal file
@ -0,0 +1,233 @@
|
|||||||
|
;(function () {
|
||||||
|
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
var mobileMenuOutsideClick = function() {
|
||||||
|
|
||||||
|
$(document).click(function (e) {
|
||||||
|
var container = $("#fh5co-offcanvas, .js-fh5co-nav-toggle");
|
||||||
|
if (!container.is(e.target) && container.has(e.target).length === 0) {
|
||||||
|
|
||||||
|
if ( $('body').hasClass('offcanvas') ) {
|
||||||
|
|
||||||
|
$('body').removeClass('offcanvas');
|
||||||
|
$('.js-fh5co-nav-toggle').removeClass('active');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
var offcanvasMenu = function() {
|
||||||
|
|
||||||
|
$('#page').prepend('<div id="fh5co-offcanvas" />');
|
||||||
|
$('#page').prepend('<a href="#" class="js-fh5co-nav-toggle fh5co-nav-toggle fh5co-nav-white"><i></i></a>');
|
||||||
|
var clone1 = $('.menu-1 > ul').clone();
|
||||||
|
$('#fh5co-offcanvas').append(clone1);
|
||||||
|
var clone2 = $('.menu-2 > ul').clone();
|
||||||
|
$('#fh5co-offcanvas').append(clone2);
|
||||||
|
|
||||||
|
$('#fh5co-offcanvas .has-dropdown').addClass('offcanvas-has-dropdown');
|
||||||
|
$('#fh5co-offcanvas')
|
||||||
|
.find('li')
|
||||||
|
.removeClass('has-dropdown');
|
||||||
|
|
||||||
|
// Hover dropdown menu on mobile
|
||||||
|
$('.offcanvas-has-dropdown').mouseenter(function(){
|
||||||
|
var $this = $(this);
|
||||||
|
|
||||||
|
$this
|
||||||
|
.addClass('active')
|
||||||
|
.find('ul')
|
||||||
|
.slideDown(500, 'easeOutExpo');
|
||||||
|
}).mouseleave(function(){
|
||||||
|
|
||||||
|
var $this = $(this);
|
||||||
|
$this
|
||||||
|
.removeClass('active')
|
||||||
|
.find('ul')
|
||||||
|
.slideUp(500, 'easeOutExpo');
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
$(window).resize(function(){
|
||||||
|
|
||||||
|
if ( $('body').hasClass('offcanvas') ) {
|
||||||
|
|
||||||
|
$('body').removeClass('offcanvas');
|
||||||
|
$('.js-fh5co-nav-toggle').removeClass('active');
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
var burgerMenu = function() {
|
||||||
|
|
||||||
|
$('body').on('click', '.js-fh5co-nav-toggle', function(event){
|
||||||
|
var $this = $(this);
|
||||||
|
|
||||||
|
|
||||||
|
if ( $('body').hasClass('overflow offcanvas') ) {
|
||||||
|
$('body').removeClass('overflow offcanvas');
|
||||||
|
} else {
|
||||||
|
$('body').addClass('overflow offcanvas');
|
||||||
|
}
|
||||||
|
$this.toggleClass('active');
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
var contentWayPoint = function() {
|
||||||
|
var i = 0;
|
||||||
|
$('.animate-box').waypoint( function( direction ) {
|
||||||
|
|
||||||
|
if( direction === 'down' && !$(this.element).hasClass('animated-fast') ) {
|
||||||
|
|
||||||
|
i++;
|
||||||
|
|
||||||
|
$(this.element).addClass('item-animate');
|
||||||
|
setTimeout(function(){
|
||||||
|
|
||||||
|
$('body .animate-box.item-animate').each(function(k){
|
||||||
|
var el = $(this);
|
||||||
|
setTimeout( function () {
|
||||||
|
var effect = el.data('animate-effect');
|
||||||
|
if ( effect === 'fadeIn') {
|
||||||
|
el.addClass('fadeIn animated-fast');
|
||||||
|
} else if ( effect === 'fadeInLeft') {
|
||||||
|
el.addClass('fadeInLeft animated-fast');
|
||||||
|
} else if ( effect === 'fadeInRight') {
|
||||||
|
el.addClass('fadeInRight animated-fast');
|
||||||
|
} else {
|
||||||
|
el.addClass('fadeInUp animated-fast');
|
||||||
|
}
|
||||||
|
|
||||||
|
el.removeClass('item-animate');
|
||||||
|
}, k * 200, 'easeInOutExpo' );
|
||||||
|
});
|
||||||
|
|
||||||
|
}, 100);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
} , { offset: '85%' } );
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
var dropdown = function() {
|
||||||
|
|
||||||
|
$('.has-dropdown').mouseenter(function(){
|
||||||
|
|
||||||
|
var $this = $(this);
|
||||||
|
$this
|
||||||
|
.find('.dropdown')
|
||||||
|
.css('display', 'block')
|
||||||
|
.addClass('animated-fast fadeInUpMenu');
|
||||||
|
|
||||||
|
}).mouseleave(function(){
|
||||||
|
var $this = $(this);
|
||||||
|
|
||||||
|
$this
|
||||||
|
.find('.dropdown')
|
||||||
|
.css('display', 'none')
|
||||||
|
.removeClass('animated-fast fadeInUpMenu');
|
||||||
|
});
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
var testimonialCarousel = function(){
|
||||||
|
var owl = $('.owl-carousel-fullwidth');
|
||||||
|
owl.owlCarousel({
|
||||||
|
items: 1,
|
||||||
|
loop: true,
|
||||||
|
margin: 0,
|
||||||
|
responsiveClass: true,
|
||||||
|
nav: false,
|
||||||
|
dots: true,
|
||||||
|
smartSpeed: 800,
|
||||||
|
autoHeight: true,
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
var goToTop = function() {
|
||||||
|
|
||||||
|
$('.js-gotop').on('click', function(event){
|
||||||
|
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
$('html, body').animate({
|
||||||
|
scrollTop: $('html').offset().top
|
||||||
|
}, 500, 'easeInOutExpo');
|
||||||
|
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
$(window).scroll(function(){
|
||||||
|
|
||||||
|
var $win = $(window);
|
||||||
|
if ($win.scrollTop() > 200) {
|
||||||
|
$('.js-top').addClass('active');
|
||||||
|
} else {
|
||||||
|
$('.js-top').removeClass('active');
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
// Loading page
|
||||||
|
var loaderPage = function() {
|
||||||
|
$(".fh5co-loader").fadeOut("slow");
|
||||||
|
};
|
||||||
|
|
||||||
|
var counter = function() {
|
||||||
|
$('.js-counter').countTo({
|
||||||
|
formatter: function (value, options) {
|
||||||
|
return value.toFixed(options.decimals);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
var counterWayPoint = function() {
|
||||||
|
if ($('#fh5co-counter').length > 0 ) {
|
||||||
|
$('#fh5co-counter').waypoint( function( direction ) {
|
||||||
|
|
||||||
|
if( direction === 'down' && !$(this.element).hasClass('animated') ) {
|
||||||
|
setTimeout( counter , 400);
|
||||||
|
$(this.element).addClass('animated');
|
||||||
|
}
|
||||||
|
} , { offset: '90%' } );
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Parallax
|
||||||
|
var parallax = function() {
|
||||||
|
$(window).stellar();
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
$(function(){
|
||||||
|
mobileMenuOutsideClick();
|
||||||
|
parallax();
|
||||||
|
offcanvasMenu();
|
||||||
|
burgerMenu();
|
||||||
|
contentWayPoint();
|
||||||
|
dropdown();
|
||||||
|
testimonialCarousel();
|
||||||
|
goToTop();
|
||||||
|
loaderPage();
|
||||||
|
counter();
|
||||||
|
counterWayPoint();
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
}());
|
||||||
|
|
||||||
4
js/js-modernizr-2.6.2.min.js
vendored
Normal file
4
js/js-modernizr-2.6.2.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
2
js/js-owl.carousel.min.js
vendored
Normal file
2
js/js-owl.carousel.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
285
js/js-simplyCountdown.js
Normal file
285
js/js-simplyCountdown.js
Normal file
@ -0,0 +1,285 @@
|
|||||||
|
/*!
|
||||||
|
* Project : simply-countdown
|
||||||
|
* File : simplyCountdown
|
||||||
|
* Date : 27/06/2015
|
||||||
|
* License : MIT
|
||||||
|
* Version : 1.3.2
|
||||||
|
* Author : Vincent Loy <vincent.loy1@gmail.com>
|
||||||
|
* Contributors :
|
||||||
|
* - Justin Beasley <JustinB@harvest.org>
|
||||||
|
* - Nathan Smith <NathanS@harvest.org>
|
||||||
|
*/
|
||||||
|
/*global window, document*/
|
||||||
|
(function (exports) {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
var // functions
|
||||||
|
extend,
|
||||||
|
createElements,
|
||||||
|
createCountdownElt,
|
||||||
|
simplyCountdown;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function that merge user parameters with defaults one.
|
||||||
|
* @param out
|
||||||
|
* @returns {*|{}}
|
||||||
|
*/
|
||||||
|
extend = function (out) {
|
||||||
|
var i,
|
||||||
|
obj,
|
||||||
|
key;
|
||||||
|
out = out || {};
|
||||||
|
|
||||||
|
for (i = 1; i < arguments.length; i += 1) {
|
||||||
|
obj = arguments[i];
|
||||||
|
|
||||||
|
if (obj) {
|
||||||
|
for (key in obj) {
|
||||||
|
if (obj.hasOwnProperty(key)) {
|
||||||
|
if (typeof obj[key] === 'object') {
|
||||||
|
extend(out[key], obj[key]);
|
||||||
|
} else {
|
||||||
|
out[key] = obj[key];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return out;
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function that create a countdown section
|
||||||
|
* @param countdown
|
||||||
|
* @param parameters
|
||||||
|
* @param typeClass
|
||||||
|
* @returns {{full: (*|Element), amount: (*|Element), word: (*|Element)}}
|
||||||
|
*/
|
||||||
|
createCountdownElt = function (countdown, parameters, typeClass) {
|
||||||
|
var innerSectionTag,
|
||||||
|
sectionTag,
|
||||||
|
amountTag,
|
||||||
|
wordTag;
|
||||||
|
|
||||||
|
sectionTag = document.createElement('div');
|
||||||
|
amountTag = document.createElement('span');
|
||||||
|
wordTag = document.createElement('span');
|
||||||
|
innerSectionTag = document.createElement('div');
|
||||||
|
|
||||||
|
innerSectionTag.appendChild(amountTag);
|
||||||
|
innerSectionTag.appendChild(wordTag);
|
||||||
|
sectionTag.appendChild(innerSectionTag);
|
||||||
|
|
||||||
|
sectionTag.classList.add(parameters.sectionClass);
|
||||||
|
sectionTag.classList.add(typeClass);
|
||||||
|
amountTag.classList.add(parameters.amountClass);
|
||||||
|
wordTag.classList.add(parameters.wordClass);
|
||||||
|
|
||||||
|
countdown.appendChild(sectionTag);
|
||||||
|
|
||||||
|
return {
|
||||||
|
full: sectionTag,
|
||||||
|
amount: amountTag,
|
||||||
|
word: wordTag
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function that create full countdown DOM elements calling createCountdownElt
|
||||||
|
* @param parameters
|
||||||
|
* @param countdown
|
||||||
|
* @returns {{days: (*|Element), hours: (*|Element), minutes: (*|Element), seconds: (*|Element)}}
|
||||||
|
*/
|
||||||
|
createElements = function (parameters, countdown) {
|
||||||
|
var spanTag;
|
||||||
|
|
||||||
|
if (!parameters.inline) {
|
||||||
|
return {
|
||||||
|
days: createCountdownElt(countdown, parameters, 'simply-days-section'),
|
||||||
|
hours: createCountdownElt(countdown, parameters, 'simply-hours-section'),
|
||||||
|
minutes: createCountdownElt(countdown, parameters, 'simply-minutes-section'),
|
||||||
|
seconds: createCountdownElt(countdown, parameters, 'simply-seconds-section')
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
spanTag = document.createElement('span');
|
||||||
|
spanTag.classList.add(parameters.inlineClass);
|
||||||
|
return spanTag;
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* simplyCountdown, create and display the coundtown.
|
||||||
|
* @param elt
|
||||||
|
* @param args (parameters)
|
||||||
|
*/
|
||||||
|
simplyCountdown = function (elt, args) {
|
||||||
|
var parameters = extend({
|
||||||
|
year: 2017,
|
||||||
|
month: 6,
|
||||||
|
day: 16,
|
||||||
|
hours: 0,
|
||||||
|
minutes: 0,
|
||||||
|
seconds: 0,
|
||||||
|
words: {
|
||||||
|
days: 'day',
|
||||||
|
hours: 'hour',
|
||||||
|
minutes: 'minute',
|
||||||
|
seconds: 'second',
|
||||||
|
pluralLetter: 's'
|
||||||
|
},
|
||||||
|
plural: true,
|
||||||
|
inline: false,
|
||||||
|
enableUtc: true,
|
||||||
|
onEnd: function () {
|
||||||
|
return;
|
||||||
|
},
|
||||||
|
refresh: 1000,
|
||||||
|
inlineClass: 'simply-countdown-inline',
|
||||||
|
sectionClass: 'simply-section',
|
||||||
|
amountClass: 'simply-amount',
|
||||||
|
wordClass: 'simply-word',
|
||||||
|
zeroPad: false
|
||||||
|
}, args),
|
||||||
|
interval,
|
||||||
|
targetDate,
|
||||||
|
targetTmpDate,
|
||||||
|
now,
|
||||||
|
nowUtc,
|
||||||
|
secondsLeft,
|
||||||
|
days,
|
||||||
|
hours,
|
||||||
|
minutes,
|
||||||
|
seconds,
|
||||||
|
cd = document.querySelectorAll(elt);
|
||||||
|
|
||||||
|
targetTmpDate = new Date(
|
||||||
|
parameters.year,
|
||||||
|
parameters.month - 1,
|
||||||
|
parameters.day,
|
||||||
|
parameters.hours,
|
||||||
|
parameters.minutes,
|
||||||
|
parameters.seconds
|
||||||
|
);
|
||||||
|
|
||||||
|
if (parameters.enableUtc) {
|
||||||
|
targetDate = new Date(
|
||||||
|
targetTmpDate.getUTCFullYear(),
|
||||||
|
targetTmpDate.getUTCMonth(),
|
||||||
|
targetTmpDate.getUTCDate(),
|
||||||
|
targetTmpDate.getUTCHours(),
|
||||||
|
targetTmpDate.getUTCMinutes(),
|
||||||
|
targetTmpDate.getUTCSeconds()
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
targetDate = targetTmpDate;
|
||||||
|
}
|
||||||
|
|
||||||
|
Array.prototype.forEach.call(cd, function (countdown) {
|
||||||
|
var fullCountDown = createElements(parameters, countdown),
|
||||||
|
refresh;
|
||||||
|
|
||||||
|
refresh = function () {
|
||||||
|
var dayWord,
|
||||||
|
hourWord,
|
||||||
|
minuteWord,
|
||||||
|
secondWord;
|
||||||
|
|
||||||
|
now = new Date();
|
||||||
|
if (parameters.enableUtc) {
|
||||||
|
nowUtc = new Date(now.getFullYear(), now.getMonth(), now.getDate(),
|
||||||
|
now.getHours(), now.getMinutes(), now.getSeconds());
|
||||||
|
secondsLeft = (targetDate - nowUtc.getTime()) / 1000;
|
||||||
|
|
||||||
|
} else {
|
||||||
|
secondsLeft = (targetDate - now.getTime()) / 1000;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (secondsLeft > 0) {
|
||||||
|
days = parseInt(secondsLeft / 86400, 10);
|
||||||
|
secondsLeft = secondsLeft % 86400;
|
||||||
|
|
||||||
|
hours = parseInt(secondsLeft / 3600, 10);
|
||||||
|
secondsLeft = secondsLeft % 3600;
|
||||||
|
|
||||||
|
minutes = parseInt(secondsLeft / 60, 10);
|
||||||
|
seconds = parseInt(secondsLeft % 60, 10);
|
||||||
|
} else {
|
||||||
|
days = 0;
|
||||||
|
hours = 0;
|
||||||
|
minutes = 0;
|
||||||
|
seconds = 0;
|
||||||
|
window.clearInterval(interval);
|
||||||
|
parameters.onEnd();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (parameters.plural) {
|
||||||
|
dayWord = days > 1
|
||||||
|
? parameters.words.days + parameters.words.pluralLetter
|
||||||
|
: parameters.words.days;
|
||||||
|
|
||||||
|
hourWord = hours > 1
|
||||||
|
? parameters.words.hours + parameters.words.pluralLetter
|
||||||
|
: parameters.words.hours;
|
||||||
|
|
||||||
|
minuteWord = minutes > 1
|
||||||
|
? parameters.words.minutes + parameters.words.pluralLetter
|
||||||
|
: parameters.words.minutes;
|
||||||
|
|
||||||
|
secondWord = seconds > 1
|
||||||
|
? parameters.words.seconds + parameters.words.pluralLetter
|
||||||
|
: parameters.words.seconds;
|
||||||
|
|
||||||
|
} else {
|
||||||
|
dayWord = parameters.words.days;
|
||||||
|
hourWord = parameters.words.hours;
|
||||||
|
minuteWord = parameters.words.minutes;
|
||||||
|
secondWord = parameters.words.seconds;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* display an inline countdown into a span tag */
|
||||||
|
if (parameters.inline) {
|
||||||
|
countdown.innerHTML =
|
||||||
|
days + ' ' + dayWord + ', ' +
|
||||||
|
hours + ' ' + hourWord + ', ' +
|
||||||
|
minutes + ' ' + minuteWord + ', ' +
|
||||||
|
seconds + ' ' + secondWord + '.';
|
||||||
|
|
||||||
|
} else {
|
||||||
|
fullCountDown.days.amount.textContent = (parameters.zeroPad && days.toString().length < 2 ? '0' : '') + days;
|
||||||
|
fullCountDown.days.word.textContent = dayWord;
|
||||||
|
|
||||||
|
fullCountDown.hours.amount.textContent = (parameters.zeroPad && hours.toString().length < 2 ? '0' : '') + hours;
|
||||||
|
fullCountDown.hours.word.textContent = hourWord;
|
||||||
|
|
||||||
|
fullCountDown.minutes.amount.textContent = (parameters.zeroPad && minutes.toString().length < 2 ? '0' : '') + minutes;
|
||||||
|
fullCountDown.minutes.word.textContent = minuteWord;
|
||||||
|
|
||||||
|
fullCountDown.seconds.amount.textContent = (parameters.zeroPad && seconds.toString().length < 2 ? '0' : '') + seconds;
|
||||||
|
fullCountDown.seconds.word.textContent = secondWord;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Refresh immediately to prevent a Flash of Unstyled Content
|
||||||
|
refresh();
|
||||||
|
interval = window.setInterval(refresh, parameters.refresh);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
exports.simplyCountdown = simplyCountdown;
|
||||||
|
}(window));
|
||||||
|
|
||||||
|
/*global $, jQuery, simplyCountdown*/
|
||||||
|
if (window.jQuery) {
|
||||||
|
(function ($, simplyCountdown) {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
function simplyCountdownify(el, options) {
|
||||||
|
simplyCountdown(el, options);
|
||||||
|
}
|
||||||
|
|
||||||
|
$.fn.simplyCountdown = function (options) {
|
||||||
|
return simplyCountdownify(this.selector, options);
|
||||||
|
};
|
||||||
|
}(jQuery, simplyCountdown));
|
||||||
|
}
|
||||||
554
js/lightbox.js
Normal file
554
js/lightbox.js
Normal file
@ -0,0 +1,554 @@
|
|||||||
|
/*!
|
||||||
|
* Lightbox v2.11.3
|
||||||
|
* by Lokesh Dhakar
|
||||||
|
*
|
||||||
|
* More info:
|
||||||
|
* http://lokeshdhakar.com/projects/lightbox2/
|
||||||
|
*
|
||||||
|
* Copyright Lokesh Dhakar
|
||||||
|
* Released under the MIT license
|
||||||
|
* https://github.com/lokesh/lightbox2/blob/master/LICENSE
|
||||||
|
*
|
||||||
|
* @preserve
|
||||||
|
*/
|
||||||
|
|
||||||
|
// Uses Node, AMD or browser globals to create a module.
|
||||||
|
(function (root, factory) {
|
||||||
|
if (typeof define === 'function' && define.amd) {
|
||||||
|
// AMD. Register as an anonymous module.
|
||||||
|
define(['jquery'], factory);
|
||||||
|
} else if (typeof exports === 'object') {
|
||||||
|
// Node. Does not work with strict CommonJS, but
|
||||||
|
// only CommonJS-like environments that support module.exports,
|
||||||
|
// like Node.
|
||||||
|
module.exports = factory(require('jquery'));
|
||||||
|
} else {
|
||||||
|
// Browser globals (root is window)
|
||||||
|
root.lightbox = factory(root.jQuery);
|
||||||
|
}
|
||||||
|
}(this, function ($) {
|
||||||
|
|
||||||
|
function Lightbox(options) {
|
||||||
|
this.album = [];
|
||||||
|
this.currentImageIndex = void 0;
|
||||||
|
this.init();
|
||||||
|
|
||||||
|
// options
|
||||||
|
this.options = $.extend({}, this.constructor.defaults);
|
||||||
|
this.option(options);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Descriptions of all options available on the demo site:
|
||||||
|
// http://lokeshdhakar.com/projects/lightbox2/index.html#options
|
||||||
|
Lightbox.defaults = {
|
||||||
|
albumLabel: 'Image %1 of %2',
|
||||||
|
alwaysShowNavOnTouchDevices: false,
|
||||||
|
fadeDuration: 600,
|
||||||
|
fitImagesInViewport: true,
|
||||||
|
imageFadeDuration: 600,
|
||||||
|
// maxWidth: 800,
|
||||||
|
// maxHeight: 600,
|
||||||
|
positionFromTop: 50,
|
||||||
|
resizeDuration: 700,
|
||||||
|
showImageNumberLabel: true,
|
||||||
|
wrapAround: false,
|
||||||
|
disableScrolling: false,
|
||||||
|
/*
|
||||||
|
Sanitize Title
|
||||||
|
If the caption data is trusted, for example you are hardcoding it in, then leave this to false.
|
||||||
|
This will free you to add html tags, such as links, in the caption.
|
||||||
|
|
||||||
|
If the caption data is user submitted or from some other untrusted source, then set this to true
|
||||||
|
to prevent xss and other injection attacks.
|
||||||
|
*/
|
||||||
|
sanitizeTitle: false
|
||||||
|
};
|
||||||
|
|
||||||
|
Lightbox.prototype.option = function(options) {
|
||||||
|
$.extend(this.options, options);
|
||||||
|
};
|
||||||
|
|
||||||
|
Lightbox.prototype.imageCountLabel = function(currentImageNum, totalImages) {
|
||||||
|
return this.options.albumLabel.replace(/%1/g, currentImageNum).replace(/%2/g, totalImages);
|
||||||
|
};
|
||||||
|
|
||||||
|
Lightbox.prototype.init = function() {
|
||||||
|
var self = this;
|
||||||
|
// Both enable and build methods require the body tag to be in the DOM.
|
||||||
|
$(document).ready(function() {
|
||||||
|
self.enable();
|
||||||
|
self.build();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// Loop through anchors and areamaps looking for either data-lightbox attributes or rel attributes
|
||||||
|
// that contain 'lightbox'. When these are clicked, start lightbox.
|
||||||
|
Lightbox.prototype.enable = function() {
|
||||||
|
var self = this;
|
||||||
|
$('body').on('click', 'a[rel^=lightbox], area[rel^=lightbox], a[data-lightbox], area[data-lightbox]', function(event) {
|
||||||
|
self.start($(event.currentTarget));
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// Build html for the lightbox and the overlay.
|
||||||
|
// Attach event handlers to the new DOM elements. click click click
|
||||||
|
Lightbox.prototype.build = function() {
|
||||||
|
if ($('#lightbox').length > 0) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
// The two root notes generated, #lightboxOverlay and #lightbox are given
|
||||||
|
// tabindex attrs so they are focusable. We attach our keyboard event
|
||||||
|
// listeners to these two elements, and not the document. Clicking anywhere
|
||||||
|
// while Lightbox is opened will keep the focus on or inside one of these
|
||||||
|
// two elements.
|
||||||
|
//
|
||||||
|
// We do this so we can prevent propogation of the Esc keypress when
|
||||||
|
// Lightbox is open. This prevents it from intefering with other components
|
||||||
|
// on the page below.
|
||||||
|
//
|
||||||
|
// Github issue: https://github.com/lokesh/lightbox2/issues/663
|
||||||
|
$('<div id="lightboxOverlay" tabindex="-1" class="lightboxOverlay"></div><div id="lightbox" tabindex="-1" class="lightbox"><div class="lb-outerContainer"><div class="lb-container"><img class="lb-image" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt=""/><div class="lb-nav"><a class="lb-prev" aria-label="Previous image" href="" ></a><a class="lb-next" aria-label="Next image" href="" ></a></div><div class="lb-loader"><a class="lb-cancel"></a></div></div></div><div class="lb-dataContainer"><div class="lb-data"><div class="lb-details"><span class="lb-caption"></span><span class="lb-number"></span></div><div class="lb-closeContainer"><a class="lb-close"></a></div></div></div></div>').appendTo($('body'));
|
||||||
|
|
||||||
|
// Cache jQuery objects
|
||||||
|
this.$lightbox = $('#lightbox');
|
||||||
|
this.$overlay = $('#lightboxOverlay');
|
||||||
|
this.$outerContainer = this.$lightbox.find('.lb-outerContainer');
|
||||||
|
this.$container = this.$lightbox.find('.lb-container');
|
||||||
|
this.$image = this.$lightbox.find('.lb-image');
|
||||||
|
this.$nav = this.$lightbox.find('.lb-nav');
|
||||||
|
|
||||||
|
// Store css values for future lookup
|
||||||
|
this.containerPadding = {
|
||||||
|
top: parseInt(this.$container.css('padding-top'), 10),
|
||||||
|
right: parseInt(this.$container.css('padding-right'), 10),
|
||||||
|
bottom: parseInt(this.$container.css('padding-bottom'), 10),
|
||||||
|
left: parseInt(this.$container.css('padding-left'), 10)
|
||||||
|
};
|
||||||
|
|
||||||
|
this.imageBorderWidth = {
|
||||||
|
top: parseInt(this.$image.css('border-top-width'), 10),
|
||||||
|
right: parseInt(this.$image.css('border-right-width'), 10),
|
||||||
|
bottom: parseInt(this.$image.css('border-bottom-width'), 10),
|
||||||
|
left: parseInt(this.$image.css('border-left-width'), 10)
|
||||||
|
};
|
||||||
|
|
||||||
|
// Attach event handlers to the newly minted DOM elements
|
||||||
|
this.$overlay.hide().on('click', function() {
|
||||||
|
self.end();
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
this.$lightbox.hide().on('click', function(event) {
|
||||||
|
if ($(event.target).attr('id') === 'lightbox') {
|
||||||
|
self.end();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
this.$outerContainer.on('click', function(event) {
|
||||||
|
if ($(event.target).attr('id') === 'lightbox') {
|
||||||
|
self.end();
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
this.$lightbox.find('.lb-prev').on('click', function() {
|
||||||
|
if (self.currentImageIndex === 0) {
|
||||||
|
self.changeImage(self.album.length - 1);
|
||||||
|
} else {
|
||||||
|
self.changeImage(self.currentImageIndex - 1);
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
this.$lightbox.find('.lb-next').on('click', function() {
|
||||||
|
if (self.currentImageIndex === self.album.length - 1) {
|
||||||
|
self.changeImage(0);
|
||||||
|
} else {
|
||||||
|
self.changeImage(self.currentImageIndex + 1);
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
/*
|
||||||
|
Show context menu for image on right-click
|
||||||
|
|
||||||
|
There is a div containing the navigation that spans the entire image and lives above of it. If
|
||||||
|
you right-click, you are right clicking this div and not the image. This prevents users from
|
||||||
|
saving the image or using other context menu actions with the image.
|
||||||
|
|
||||||
|
To fix this, when we detect the right mouse button is pressed down, but not yet clicked, we
|
||||||
|
set pointer-events to none on the nav div. This is so that the upcoming right-click event on
|
||||||
|
the next mouseup will bubble down to the image. Once the right-click/contextmenu event occurs
|
||||||
|
we set the pointer events back to auto for the nav div so it can capture hover and left-click
|
||||||
|
events as usual.
|
||||||
|
*/
|
||||||
|
this.$nav.on('mousedown', function(event) {
|
||||||
|
if (event.which === 3) {
|
||||||
|
self.$nav.css('pointer-events', 'none');
|
||||||
|
|
||||||
|
self.$lightbox.one('contextmenu', function() {
|
||||||
|
setTimeout(function() {
|
||||||
|
this.$nav.css('pointer-events', 'auto');
|
||||||
|
}.bind(self), 0);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
this.$lightbox.find('.lb-loader, .lb-close').on('click', function() {
|
||||||
|
self.end();
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// Show overlay and lightbox. If the image is part of a set, add siblings to album array.
|
||||||
|
Lightbox.prototype.start = function($link) {
|
||||||
|
var self = this;
|
||||||
|
var $window = $(window);
|
||||||
|
|
||||||
|
$window.on('resize', $.proxy(this.sizeOverlay, this));
|
||||||
|
|
||||||
|
this.sizeOverlay();
|
||||||
|
|
||||||
|
this.album = [];
|
||||||
|
var imageNumber = 0;
|
||||||
|
|
||||||
|
function addToAlbum($link) {
|
||||||
|
self.album.push({
|
||||||
|
alt: $link.attr('data-alt'),
|
||||||
|
link: $link.attr('href'),
|
||||||
|
title: $link.attr('data-title') || $link.attr('title')
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Support both data-lightbox attribute and rel attribute implementations
|
||||||
|
var dataLightboxValue = $link.attr('data-lightbox');
|
||||||
|
var $links;
|
||||||
|
|
||||||
|
if (dataLightboxValue) {
|
||||||
|
$links = $($link.prop('tagName') + '[data-lightbox="' + dataLightboxValue + '"]');
|
||||||
|
for (var i = 0; i < $links.length; i = ++i) {
|
||||||
|
addToAlbum($($links[i]));
|
||||||
|
if ($links[i] === $link[0]) {
|
||||||
|
imageNumber = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if ($link.attr('rel') === 'lightbox') {
|
||||||
|
// If image is not part of a set
|
||||||
|
addToAlbum($link);
|
||||||
|
} else {
|
||||||
|
// If image is part of a set
|
||||||
|
$links = $($link.prop('tagName') + '[rel="' + $link.attr('rel') + '"]');
|
||||||
|
for (var j = 0; j < $links.length; j = ++j) {
|
||||||
|
addToAlbum($($links[j]));
|
||||||
|
if ($links[j] === $link[0]) {
|
||||||
|
imageNumber = j;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Position Lightbox
|
||||||
|
var top = $window.scrollTop() + this.options.positionFromTop;
|
||||||
|
var left = $window.scrollLeft();
|
||||||
|
this.$lightbox.css({
|
||||||
|
top: top + 'px',
|
||||||
|
left: left + 'px'
|
||||||
|
}).fadeIn(this.options.fadeDuration);
|
||||||
|
|
||||||
|
// Disable scrolling of the page while open
|
||||||
|
if (this.options.disableScrolling) {
|
||||||
|
$('body').addClass('lb-disable-scrolling');
|
||||||
|
}
|
||||||
|
|
||||||
|
this.changeImage(imageNumber);
|
||||||
|
};
|
||||||
|
|
||||||
|
// Hide most UI elements in preparation for the animated resizing of the lightbox.
|
||||||
|
Lightbox.prototype.changeImage = function(imageNumber) {
|
||||||
|
var self = this;
|
||||||
|
var filename = this.album[imageNumber].link;
|
||||||
|
var filetype = filename.split('.').slice(-1)[0];
|
||||||
|
var $image = this.$lightbox.find('.lb-image');
|
||||||
|
|
||||||
|
// Disable keyboard nav during transitions
|
||||||
|
this.disableKeyboardNav();
|
||||||
|
|
||||||
|
// Show loading state
|
||||||
|
this.$overlay.fadeIn(this.options.fadeDuration);
|
||||||
|
$('.lb-loader').fadeIn('slow');
|
||||||
|
this.$lightbox.find('.lb-image, .lb-nav, .lb-prev, .lb-next, .lb-dataContainer, .lb-numbers, .lb-caption').hide();
|
||||||
|
this.$outerContainer.addClass('animating');
|
||||||
|
|
||||||
|
// When image to show is preloaded, we send the width and height to sizeContainer()
|
||||||
|
var preloader = new Image();
|
||||||
|
preloader.onload = function() {
|
||||||
|
var $preloader;
|
||||||
|
var imageHeight;
|
||||||
|
var imageWidth;
|
||||||
|
var maxImageHeight;
|
||||||
|
var maxImageWidth;
|
||||||
|
var windowHeight;
|
||||||
|
var windowWidth;
|
||||||
|
|
||||||
|
$image.attr({
|
||||||
|
'alt': self.album[imageNumber].alt,
|
||||||
|
'src': filename
|
||||||
|
});
|
||||||
|
|
||||||
|
$preloader = $(preloader);
|
||||||
|
|
||||||
|
$image.width(preloader.width);
|
||||||
|
$image.height(preloader.height);
|
||||||
|
windowWidth = $(window).width();
|
||||||
|
windowHeight = $(window).height();
|
||||||
|
|
||||||
|
// Calculate the max image dimensions for the current viewport.
|
||||||
|
// Take into account the border around the image and an additional 10px gutter on each side.
|
||||||
|
maxImageWidth = windowWidth - self.containerPadding.left - self.containerPadding.right - self.imageBorderWidth.left - self.imageBorderWidth.right - 20;
|
||||||
|
maxImageHeight = windowHeight - self.containerPadding.top - self.containerPadding.bottom - self.imageBorderWidth.top - self.imageBorderWidth.bottom - self.options.positionFromTop - 70;
|
||||||
|
|
||||||
|
/*
|
||||||
|
Since many SVGs have small intrinsic dimensions, but they support scaling
|
||||||
|
up without quality loss because of their vector format, max out their
|
||||||
|
size.
|
||||||
|
*/
|
||||||
|
if (filetype === 'svg') {
|
||||||
|
$image.width(maxImageWidth);
|
||||||
|
$image.height(maxImageHeight);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Fit image inside the viewport.
|
||||||
|
if (self.options.fitImagesInViewport) {
|
||||||
|
|
||||||
|
// Check if image size is larger then maxWidth|maxHeight in settings
|
||||||
|
if (self.options.maxWidth && self.options.maxWidth < maxImageWidth) {
|
||||||
|
maxImageWidth = self.options.maxWidth;
|
||||||
|
}
|
||||||
|
if (self.options.maxHeight && self.options.maxHeight < maxImageHeight) {
|
||||||
|
maxImageHeight = self.options.maxHeight;
|
||||||
|
}
|
||||||
|
|
||||||
|
} else {
|
||||||
|
maxImageWidth = self.options.maxWidth || preloader.width || maxImageWidth;
|
||||||
|
maxImageHeight = self.options.maxHeight || preloader.height || maxImageHeight;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Is the current image's width or height is greater than the maxImageWidth or maxImageHeight
|
||||||
|
// option than we need to size down while maintaining the aspect ratio.
|
||||||
|
if ((preloader.width > maxImageWidth) || (preloader.height > maxImageHeight)) {
|
||||||
|
if ((preloader.width / maxImageWidth) > (preloader.height / maxImageHeight)) {
|
||||||
|
imageWidth = maxImageWidth;
|
||||||
|
imageHeight = parseInt(preloader.height / (preloader.width / imageWidth), 10);
|
||||||
|
$image.width(imageWidth);
|
||||||
|
$image.height(imageHeight);
|
||||||
|
} else {
|
||||||
|
imageHeight = maxImageHeight;
|
||||||
|
imageWidth = parseInt(preloader.width / (preloader.height / imageHeight), 10);
|
||||||
|
$image.width(imageWidth);
|
||||||
|
$image.height(imageHeight);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
self.sizeContainer($image.width(), $image.height());
|
||||||
|
};
|
||||||
|
|
||||||
|
// Preload image before showing
|
||||||
|
preloader.src = this.album[imageNumber].link;
|
||||||
|
this.currentImageIndex = imageNumber;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Stretch overlay to fit the viewport
|
||||||
|
Lightbox.prototype.sizeOverlay = function() {
|
||||||
|
var self = this;
|
||||||
|
/*
|
||||||
|
We use a setTimeout 0 to pause JS execution and let the rendering catch-up.
|
||||||
|
Why do this? If the `disableScrolling` option is set to true, a class is added to the body
|
||||||
|
tag that disables scrolling and hides the scrollbar. We want to make sure the scrollbar is
|
||||||
|
hidden before we measure the document width, as the presence of the scrollbar will affect the
|
||||||
|
number.
|
||||||
|
*/
|
||||||
|
setTimeout(function() {
|
||||||
|
self.$overlay
|
||||||
|
.width($(document).width())
|
||||||
|
.height($(document).height());
|
||||||
|
|
||||||
|
}, 0);
|
||||||
|
};
|
||||||
|
|
||||||
|
// Animate the size of the lightbox to fit the image we are showing
|
||||||
|
// This method also shows the the image.
|
||||||
|
Lightbox.prototype.sizeContainer = function(imageWidth, imageHeight) {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
var oldWidth = this.$outerContainer.outerWidth();
|
||||||
|
var oldHeight = this.$outerContainer.outerHeight();
|
||||||
|
var newWidth = imageWidth + this.containerPadding.left + this.containerPadding.right + this.imageBorderWidth.left + this.imageBorderWidth.right;
|
||||||
|
var newHeight = imageHeight + this.containerPadding.top + this.containerPadding.bottom + this.imageBorderWidth.top + this.imageBorderWidth.bottom;
|
||||||
|
|
||||||
|
function postResize() {
|
||||||
|
self.$lightbox.find('.lb-dataContainer').width(newWidth);
|
||||||
|
self.$lightbox.find('.lb-prevLink').height(newHeight);
|
||||||
|
self.$lightbox.find('.lb-nextLink').height(newHeight);
|
||||||
|
|
||||||
|
// Set focus on one of the two root nodes so keyboard events are captured.
|
||||||
|
self.$overlay.focus();
|
||||||
|
|
||||||
|
self.showImage();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (oldWidth !== newWidth || oldHeight !== newHeight) {
|
||||||
|
this.$outerContainer.animate({
|
||||||
|
width: newWidth,
|
||||||
|
height: newHeight
|
||||||
|
}, this.options.resizeDuration, 'swing', function() {
|
||||||
|
postResize();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
postResize();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Display the image and its details and begin preload neighboring images.
|
||||||
|
Lightbox.prototype.showImage = function() {
|
||||||
|
this.$lightbox.find('.lb-loader').stop(true).hide();
|
||||||
|
this.$lightbox.find('.lb-image').fadeIn(this.options.imageFadeDuration);
|
||||||
|
|
||||||
|
this.updateNav();
|
||||||
|
this.updateDetails();
|
||||||
|
this.preloadNeighboringImages();
|
||||||
|
this.enableKeyboardNav();
|
||||||
|
};
|
||||||
|
|
||||||
|
// Display previous and next navigation if appropriate.
|
||||||
|
Lightbox.prototype.updateNav = function() {
|
||||||
|
// Check to see if the browser supports touch events. If so, we take the conservative approach
|
||||||
|
// and assume that mouse hover events are not supported and always show prev/next navigation
|
||||||
|
// arrows in image sets.
|
||||||
|
var alwaysShowNav = false;
|
||||||
|
try {
|
||||||
|
document.createEvent('TouchEvent');
|
||||||
|
alwaysShowNav = (this.options.alwaysShowNavOnTouchDevices) ? true : false;
|
||||||
|
} catch (e) {}
|
||||||
|
|
||||||
|
this.$lightbox.find('.lb-nav').show();
|
||||||
|
|
||||||
|
if (this.album.length > 1) {
|
||||||
|
if (this.options.wrapAround) {
|
||||||
|
if (alwaysShowNav) {
|
||||||
|
this.$lightbox.find('.lb-prev, .lb-next').css('opacity', '1');
|
||||||
|
}
|
||||||
|
this.$lightbox.find('.lb-prev, .lb-next').show();
|
||||||
|
} else {
|
||||||
|
if (this.currentImageIndex > 0) {
|
||||||
|
this.$lightbox.find('.lb-prev').show();
|
||||||
|
if (alwaysShowNav) {
|
||||||
|
this.$lightbox.find('.lb-prev').css('opacity', '1');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (this.currentImageIndex < this.album.length - 1) {
|
||||||
|
this.$lightbox.find('.lb-next').show();
|
||||||
|
if (alwaysShowNav) {
|
||||||
|
this.$lightbox.find('.lb-next').css('opacity', '1');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Display caption, image number, and closing button.
|
||||||
|
Lightbox.prototype.updateDetails = function() {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
// Enable anchor clicks in the injected caption html.
|
||||||
|
// Thanks Nate Wright for the fix. @https://github.com/NateWr
|
||||||
|
if (typeof this.album[this.currentImageIndex].title !== 'undefined' &&
|
||||||
|
this.album[this.currentImageIndex].title !== '') {
|
||||||
|
var $caption = this.$lightbox.find('.lb-caption');
|
||||||
|
if (this.options.sanitizeTitle) {
|
||||||
|
$caption.text(this.album[this.currentImageIndex].title);
|
||||||
|
} else {
|
||||||
|
$caption.html(this.album[this.currentImageIndex].title);
|
||||||
|
}
|
||||||
|
$caption.fadeIn('fast');
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.album.length > 1 && this.options.showImageNumberLabel) {
|
||||||
|
var labelText = this.imageCountLabel(this.currentImageIndex + 1, this.album.length);
|
||||||
|
this.$lightbox.find('.lb-number').text(labelText).fadeIn('fast');
|
||||||
|
} else {
|
||||||
|
this.$lightbox.find('.lb-number').hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.$outerContainer.removeClass('animating');
|
||||||
|
|
||||||
|
this.$lightbox.find('.lb-dataContainer').fadeIn(this.options.resizeDuration, function() {
|
||||||
|
return self.sizeOverlay();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// Preload previous and next images in set.
|
||||||
|
Lightbox.prototype.preloadNeighboringImages = function() {
|
||||||
|
if (this.album.length > this.currentImageIndex + 1) {
|
||||||
|
var preloadNext = new Image();
|
||||||
|
preloadNext.src = this.album[this.currentImageIndex + 1].link;
|
||||||
|
}
|
||||||
|
if (this.currentImageIndex > 0) {
|
||||||
|
var preloadPrev = new Image();
|
||||||
|
preloadPrev.src = this.album[this.currentImageIndex - 1].link;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
Lightbox.prototype.enableKeyboardNav = function() {
|
||||||
|
this.$lightbox.on('keyup.keyboard', $.proxy(this.keyboardAction, this));
|
||||||
|
this.$overlay.on('keyup.keyboard', $.proxy(this.keyboardAction, this));
|
||||||
|
};
|
||||||
|
|
||||||
|
Lightbox.prototype.disableKeyboardNav = function() {
|
||||||
|
this.$lightbox.off('.keyboard');
|
||||||
|
this.$overlay.off('.keyboard');
|
||||||
|
};
|
||||||
|
|
||||||
|
Lightbox.prototype.keyboardAction = function(event) {
|
||||||
|
var KEYCODE_ESC = 27;
|
||||||
|
var KEYCODE_LEFTARROW = 37;
|
||||||
|
var KEYCODE_RIGHTARROW = 39;
|
||||||
|
|
||||||
|
var keycode = event.keyCode;
|
||||||
|
if (keycode === KEYCODE_ESC) {
|
||||||
|
// Prevent bubbling so as to not affect other components on the page.
|
||||||
|
event.stopPropagation();
|
||||||
|
this.end();
|
||||||
|
} else if (keycode === KEYCODE_LEFTARROW) {
|
||||||
|
if (this.currentImageIndex !== 0) {
|
||||||
|
this.changeImage(this.currentImageIndex - 1);
|
||||||
|
} else if (this.options.wrapAround && this.album.length > 1) {
|
||||||
|
this.changeImage(this.album.length - 1);
|
||||||
|
}
|
||||||
|
} else if (keycode === KEYCODE_RIGHTARROW) {
|
||||||
|
if (this.currentImageIndex !== this.album.length - 1) {
|
||||||
|
this.changeImage(this.currentImageIndex + 1);
|
||||||
|
} else if (this.options.wrapAround && this.album.length > 1) {
|
||||||
|
this.changeImage(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Closing time. :-(
|
||||||
|
Lightbox.prototype.end = function() {
|
||||||
|
this.disableKeyboardNav();
|
||||||
|
$(window).off('resize', this.sizeOverlay);
|
||||||
|
this.$lightbox.fadeOut(this.options.fadeDuration);
|
||||||
|
this.$overlay.fadeOut(this.options.fadeDuration);
|
||||||
|
|
||||||
|
if (this.options.disableScrolling) {
|
||||||
|
$('body').removeClass('lb-disable-scrolling');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return new Lightbox();
|
||||||
|
}));
|
||||||
17757
js/moment-with-locales.js
Normal file
17757
js/moment-with-locales.js
Normal file
File diff suppressed because it is too large
Load Diff
222
js/script.js
Normal file
222
js/script.js
Normal file
@ -0,0 +1,222 @@
|
|||||||
|
(function($) {
|
||||||
|
|
||||||
|
"use strict";
|
||||||
|
/*------------------------------------------
|
||||||
|
= ACTIVE POPUP IMAGE
|
||||||
|
-------------------------------------------*/
|
||||||
|
if ($(".fancybox").length) {
|
||||||
|
$(".fancybox").fancybox({
|
||||||
|
openEffect : "elastic",
|
||||||
|
closeEffect : "elastic",
|
||||||
|
wrapCSS : "project-fancybox-title-style"
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/*------------------------------------------
|
||||||
|
= POPUP VIDEO
|
||||||
|
-------------------------------------------*/
|
||||||
|
if ($(".video-play-btn").length) {
|
||||||
|
$(".video-play-btn").on("click", function(){
|
||||||
|
$.fancybox({
|
||||||
|
href: this.href,
|
||||||
|
type: $(this).data("type"),
|
||||||
|
'title' : this.title,
|
||||||
|
helpers : {
|
||||||
|
title : { type : 'inside' },
|
||||||
|
media : {}
|
||||||
|
},
|
||||||
|
|
||||||
|
beforeShow : function(){
|
||||||
|
$(".fancybox-wrap").addClass("gallery-fancybox");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return false
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* =================
|
||||||
|
sampul awal THE BEGINING
|
||||||
|
=================*/
|
||||||
|
|
||||||
|
$('#konten').hide(); //hided konten scr deafult
|
||||||
|
$(".thebegining").click(function(){
|
||||||
|
$(this).hide(); //hide the begining
|
||||||
|
$('#konten').show() //show konten
|
||||||
|
$("#audio").get(0).play(); //play musik
|
||||||
|
document.documentElement.requestFullscreen(); //fullscreen
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
/*------------------------------------------
|
||||||
|
= NAV BOTTOM BAR
|
||||||
|
-------------------------------------------*/
|
||||||
|
|
||||||
|
var navItems = document.querySelectorAll(".mobile-bottom-nav__item");
|
||||||
|
navItems.forEach(function(e, i) {
|
||||||
|
e.addEventListener("click", function(e) {
|
||||||
|
navItems.forEach(function(e2, i2) {
|
||||||
|
e2.classList.remove("mobile-bottom-nav__item--active");
|
||||||
|
})
|
||||||
|
this.classList.add("mobile-bottom-nav__item--active");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
$(".icons").click(function(){
|
||||||
|
|
||||||
|
$("#nav2").animate({
|
||||||
|
height: "toggle",
|
||||||
|
opacity: "toggle",
|
||||||
|
},100, 'linear');
|
||||||
|
|
||||||
|
$("#lain").animate({
|
||||||
|
height: "toggle",
|
||||||
|
opacity: "toggle",
|
||||||
|
},200, 'linear');
|
||||||
|
|
||||||
|
$("#tutup").toggleClass('rotate');
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$("#lain").click(function(){
|
||||||
|
|
||||||
|
$("#nav2").animate({
|
||||||
|
height: "toggle",
|
||||||
|
opacity: "toggle",
|
||||||
|
},100, 'linear');
|
||||||
|
|
||||||
|
$("#lain").animate({
|
||||||
|
height: "toggle",
|
||||||
|
opacity: "toggle",
|
||||||
|
},200, 'linear');
|
||||||
|
|
||||||
|
$("#tutup").toggleClass('rotate');
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
var $allContentDivs = $('#sampul-konten, #mempelai-konten, #acara-konten, #album-konten, #ucapan-konten, #lokasi-konten, #cerita-konten').hide(); // Hide All Content Divs
|
||||||
|
|
||||||
|
$("#sampul-konten").show();
|
||||||
|
$(".dekorasi-sampul").show();
|
||||||
|
$(".dekorasi-all").hide();
|
||||||
|
|
||||||
|
|
||||||
|
$('#sampul, #mempelai, #acara, #album, #ucapan, #lokasi, #cerita').click(function(){
|
||||||
|
var $contentDiv = $("#" + this.id + "-konten");
|
||||||
|
|
||||||
|
if(this.id == "sampul"){
|
||||||
|
|
||||||
|
$("#imgbawah").hide();
|
||||||
|
$(".dekorasi-sampul").show();
|
||||||
|
$(".dekorasi-all").hide();
|
||||||
|
// $("#imgatas").hide();
|
||||||
|
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$("#imgbawah").show();
|
||||||
|
$(".dekorasi-sampul").hide();
|
||||||
|
$(".dekorasi-all").show();
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
if($contentDiv.is(":visible")) {
|
||||||
|
} else {
|
||||||
|
$allContentDivs.hide(); // Hide All Divs
|
||||||
|
$contentDiv.show(); // Show Div
|
||||||
|
}
|
||||||
|
|
||||||
|
$('body,html').animate({
|
||||||
|
scrollTop: 0
|
||||||
|
}, 600);
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
/*=======================================
|
||||||
|
Load more content with jQuery - May 21, 2013
|
||||||
|
(c) 2013 @ElmahdiMahmoud
|
||||||
|
================================*/
|
||||||
|
|
||||||
|
$(".komen").slice(0, 4).show();
|
||||||
|
$("#loadMore").on('click', function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
$(".komen:hidden").slice(0, 4).slideDown();
|
||||||
|
if ($(".komen:hidden").length == 0) {
|
||||||
|
$("#loadMore").fadeOut('slow');
|
||||||
|
}
|
||||||
|
$('html,body').animate({
|
||||||
|
scrollTop: $(this).offset().top
|
||||||
|
}, 1500);
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
/*=================
|
||||||
|
FORMAT TANGGAL
|
||||||
|
======================= */
|
||||||
|
moment.locale('id'); //set indonesian format
|
||||||
|
|
||||||
|
//output = Senin, 17 Agustus 2020
|
||||||
|
var date_resepsi = moment(tanggal_resepsi).format('dddd, Do MMMM YYYY');
|
||||||
|
var date_akad = moment(tanggal_akad).format('dddd, Do MMMM YYYY');
|
||||||
|
|
||||||
|
//output = 17 / 08 / 2020
|
||||||
|
var date_pernikahan = moment(tanggal_resepsi).format('DD / MM / YYYY'); //untuk sampul
|
||||||
|
|
||||||
|
|
||||||
|
$('#tanggal-acara-resepsi').html(date_resepsi);
|
||||||
|
$('#tanggal-acara-akad').html(date_akad);
|
||||||
|
$('.tanggal-weddingnya').html(date_pernikahan); //untuk sampul
|
||||||
|
|
||||||
|
/*=================
|
||||||
|
ADD KOMENTAR
|
||||||
|
======================= */
|
||||||
|
$('#submitKomen').on('click', function(event) {
|
||||||
|
$("form[name='rsvpucapan']").validate({
|
||||||
|
ignore: ".ignore",
|
||||||
|
rules: {
|
||||||
|
namatamu: "required",
|
||||||
|
kehadiran: "required",
|
||||||
|
pesantamu: "required",
|
||||||
|
},
|
||||||
|
errorClass: 'isidulu',
|
||||||
|
errorPlacement: function(error, element) {
|
||||||
|
},
|
||||||
|
submitHandler: function(form) {
|
||||||
|
$('#loading_').css('display','inline');
|
||||||
|
$('#submitKomen').css('display','none');
|
||||||
|
var nama = $('#nama').val();
|
||||||
|
var kehadiran = $('#kehadiran').val();
|
||||||
|
var komentar = $('#komentar').val();
|
||||||
|
$.ajax({
|
||||||
|
url : base_url+'/add_komentar',
|
||||||
|
method : "POST",
|
||||||
|
data : {nama: nama,kehadiran: kehadiran,komentar: komentar},
|
||||||
|
async : true,
|
||||||
|
dataType : 'html',
|
||||||
|
success: function(hasil){
|
||||||
|
var json = JSON.parse(hasil);
|
||||||
|
var status = json.status;
|
||||||
|
var nama = json.nama;
|
||||||
|
var kehadiran = json.kehadiran;
|
||||||
|
var komentar = json.komentar;
|
||||||
|
console.log(json);
|
||||||
|
|
||||||
|
if(status == 'sukses'){
|
||||||
|
$('.layout-komen2').append("<div class='komen2' style='display:block'><div class='col-12 komen-nama'>"+nama+"<i class='"+kehadiran+"' style='margin-left:3px;border-radius:2px;font-size:10px;padding:2px;padding-left:5px;padding-right:5px;'>"+kehadiran+"</i></div><div class='col-12 komen-isi'>"+komentar+"</div></div>");
|
||||||
|
$('html, body').animate({
|
||||||
|
scrollTop: $("#komen-netizen").offset().top
|
||||||
|
}, 2000);
|
||||||
|
$('.layout-komen2').css('display', '');
|
||||||
|
$('#loading_').css('display','none');
|
||||||
|
$('#submitKomen').css('display','block');
|
||||||
|
$('#submitKomen').prop('disabled', true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
})(window.jQuery);
|
||||||
|
|
||||||
BIN
musik/musik.mp3
Normal file
BIN
musik/musik.mp3
Normal file
Binary file not shown.
Loading…
Reference in New Issue
Block a user