Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

daniel evan c #24

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open

daniel evan c #24

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
588c60a
initial commit
mhdiiilham Nov 29, 2019
c3b4c39
80%
mhdiiilham Nov 29, 2019
8f8b410
Merge pull request #2 from mhdiiilham/development
mhdiiilham Nov 29, 2019
ae25dba
Revert "Development"
mhdiiilham Nov 29, 2019
7129bab
Merge pull request #3 from king-fox-2019/revert-2-development
mhdiiilham Nov 29, 2019
25a4494
web
Danielevan2 Dec 2, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added assets/373188_805560.webp
View file
Open in desktop
Binary file not shown.
Binary file added assets/3ce3c824928923014ef9aa83caefaaad.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/helena-lopes-PGnqT0rXWLs-unsplash.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/jack-sharp-ShCVvQbQBDk-unsplash.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/l.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/perry-grone-lbLgFFlADrY-unsplash.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/phil-coffman-anV_zgNDZhc-unsplash.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/rachel-lynette-french-U7HLzMO4SIY-unsplash.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/wes-hicks-MEL-jJnm7RQ-unsplash.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
63 changes: 63 additions & 0 deletions community.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="./style.css">

<!-- font-link -->
<link href="https://fonts.googleapis.com/css?family=Calistoga&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Fugaz+One&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Boogaloo&display=swap" rel="stylesheet">

<title>One Way</title>
</head>
<body>
<!-- nav bar -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-item nav-link" href="https://www.youtube.com/results?search_query=youth+impact+solo">Youtube</a>
<a class="nav-item nav-link" href="https://open.spotify.com/artist/3SgHzT552wy2W8pNLaLk24">Spotify</a>
<a class="nav-item nav-link" href="#">iTunes</a>
</div>
</div>
<a class="navbar-brand" href="./index.html" >
<h1 style="font-family: 'Fugaz One', cursive;;text-align: center;">YOUTH IMPACT</h1>
<p style="text-align: center;font-family: 'Fugaz One'">community</p>
</a>
</nav>
<!-- community page -->
<div class="bd-example">
<div class="carousel-inner">
<div class="carousel-item active">
<img src="./assets/rachel-lynette-french-U7HLzMO4SIY-unsplash.jpg" class="d-block w-100" style="margin-bottom: -330px;">
<div class="carousel-caption d-none d-md-block" style="margin-bottom: 200px;">
<h1 style="font-size: 200px;text-shadow: 2px 2px 4px #000000;font-family: 'Boogaloo', cursive;">JOIN US</h1>
<p>___________________________________________________________</p>
<p style="text-shadow: 2px 2px 4px #000000; text-align: center;">Every Saturday, At Jordan Chamber</p>
<p style="text-shadow: 2px 2px 4px #000000; text-align: center;">5 PM</p>
</div>
</div>
</div>
</div>


<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<script src="./index.js"></script>
</body>
<footer class="footer navbar-fixed-bottom" style="background-color: black;">
<p style="text-align-last: center;color: blanchedalmond;">Copyright ©2019</p>
</footer>
</html>
112 changes: 112 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,112 @@
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="./style.css">

<!-- font-link -->
<link href="https://fonts.googleapis.com/css?family=Calistoga&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Fugaz+One&display=swap" rel="stylesheet">

<title>One Way</title>
</head>
<body>
<!-- nav bar -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-item nav-link" href="https://www.youtube.com/results?search_query=youth+impact+solo">Youtube</a>
<a class="nav-item nav-link" href="https://open.spotify.com/artist/3SgHzT552wy2W8pNLaLk24">Spotify</a>
<a class="nav-item nav-link" href="#">iTunes</a>
</div>
</div>
<a class="navbar-brand" href="index.html" >
<h1 style="font-family: 'Fugaz One', cursive;;text-align: center;">YOUTH IMPACT</h1>
<p style="text-align: center;font-family: 'Fugaz One'">community</p>
</a>
</nav>

<!-- home -->
<div class="bd-example">
<div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleCaptions" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleCaptions" data-slide-to="1"></li>
<li data-target="#carouselExampleCaptions" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="./assets/perry-grone-lbLgFFlADrY-unsplash.jpg" class="d-block w-100" alt="..." style="margin-bottom: -330px;">
<!-- <div class="carousel-caption d-none d-md-block">
<h5>First slide label</h5>
<p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p>
</div> -->
</div>
<div class="carousel-item">
<img src="./assets/jack-sharp-ShCVvQbQBDk-unsplash.jpg" class="d-block w-100" alt="..." style="margin-bottom: -330px;">
<!-- <div class="carousel-caption d-none d-md-block">
<h5>Second slide label</h5>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div> -->
</div>
<div class="carousel-item">
<img src="./assets/phil-coffman-anV_zgNDZhc-unsplash.jpg" class="d-block w-100" alt="..." style="margin-bottom: -330px;">
<!-- <div class="carousel-caption d-none d-md-block">
<h5>Third slide label</h5>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur.</p>
</div> -->
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleCaptions" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleCaptions" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>

<div class="container-100 image-ba" id="main2" style="width: 100%;background-color: black;">
<div class="row" style="text-align: center;height: 200px;">
<div class="col-4 border">
<a href="music.html">
<div class = "features" id="music">Music</div>
</a>
</div>

<div class="col-4 border">
<a href="./community.html">
<div class = "features" id="community">Community</div>
</a>
</div>

<div class="col-4 border">
<a href="./sharing.html">
<div class = "features" id="event">Sharing</div>
</a>
</div>
</div>
</div>


<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<script src="./index.js"></script>
</body>
<footer class="footer navbar-fixed-bottom" style="background-color: black;">
<p style="text-align-last: center;color: blanchedalmond;">Copyright ©2019</p>
</footer>
</html>
83 changes: 83 additions & 0 deletions index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
$(document).ready(function () {

//musicButton
$('#music').hover(
function () {
// over
$('#main2').css({'background-image':"url('https://daz19uf2q56ul.cloudfront.net/20180717105420/events-1.jpg')",'background-position':"center"});
},
function () {
// out
$('#main2').css({'background-image':"",'background-position':""});
}
);

//communityButton
$('#community').hover(
function () {
// over
$('#main2').css({'background-image':"url('https://images.unsplash.com/photo-1502444330042-d1a1ddf9bb5b?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1353&q=80')",'background-position-y':"-550px"});
},
function () {
// out
$('#main2').css({'background-image':"",'background-position':""});
}
);

//eventButton
$('#event').hover(
function () {
// over
$('#main2').css({'background-image':"url('https://images.unsplash.com/photo-1444210971048-6130cf0c46cf?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1352&q=80')",'background-position-y':"-450px"});
},
function () {
// out
$('#main2').css({'background-image':"",'background-position':""});
}
);

//lastUpdate
let updateAt = 1575114252259
let timeNow = new Date().getTime()
let minutes = Math.round((timeNow - updateAt)/60000)

if(minutes < 60){
$('.lastUpdate').append(`Last updated ${minutes} mins ago`);
}else if(minutes >= 60 && minutes < 1440){
let hour = Math.round(minutes/60)
$('.lastUpdate').append(`Last updated ${hour} hours ago`);
}else{
let day = Math.floor(minutes/1440)
$('.lastUpdate').append(`Last updated ${day} days ago`);
}

//our Comment
let comment = [
{title:'coba satu', story:'blablablablabablbalabalbalabalbal', },
{title:'coba dua', story:'akutauakubisa', },
]
comment.forEach(element =>{
$('#share').append(`
<div class="card w-100">
<div class="card-body">
<h5 class="card-title">${element.title}</h5>
<p class="card-text">${element.story}</p>
</div>
</div>
`);

})

})

function plusComment(){
$('#share').append(`
<div class="card w-100">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
<a onclick="plusComment()" class="btn btn-primary">Button</a>
</div>
</div>
`);
}
132 changes: 132 additions & 0 deletions music.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,132 @@
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="./style.css">

<!-- font-link -->
<link href="https://fonts.googleapis.com/css?family=Calistoga&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Fugaz+One&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Boogaloo&display=swap" rel="stylesheet">

<title>One Way</title>
</head>
<body>
<!-- nav bar -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-item nav-link" href="https://www.youtube.com/results?search_query=youth+impact+solo">Youtube</a>
<a class="nav-item nav-link" href="https://open.spotify.com/artist/3SgHzT552wy2W8pNLaLk24">Spotify</a>
<a class="nav-item nav-link" href="#">iTunes</a>
</div>
</div>
<a class="navbar-brand" href="./index.html" >
<h1 style="font-family: 'Fugaz One', cursive;;text-align: center;">YOUTH IMPACT</h1>
<p style="text-align: center;font-family: 'Fugaz One'">community</p>
</a>
</nav>
<!-- music page -->
<div class="bd-example">
<div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleCaptions" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleCaptions" data-slide-to="1"></li>
<li data-target="#carouselExampleCaptions" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="./assets/wes-hicks-MEL-jJnm7RQ-unsplash.jpg" class="d-block w-100" alt="..." style="margin-bottom: -330px;">
<div class="carousel-caption d-none d-md-block" style="margin-bottom: 200px;">
<h1 style="font-size: 200px;text-shadow: 2px 2px 4px #000000;font-family: 'Boogaloo', cursive;">Our Favorite Song</h1>
<p style="text-shadow: 2px 2px 4px #000000">For personal or corporate worship, access song lyrics and transposable chord charts for all Bethel Music songs.</p>
</div>
</div>
</div>
<div class="card mb-3 mt-50" style="width: 100%;">
<div class="row no-gutters">
<div class="col-md-4">
<img src="./assets/373188_805560.webp" class="card-img" alt="...">
</div>
<div class="col-md-8">
<div class="card-body">
<h5 class="card-title">JPCC WORSHIP</h5>
<ul>
<li> Imanuel </li>
<li>God Is For Me</li>
<li>Siapakah Lawanku</li>
<li>Engkau Turut Bekerja</li>
<li>I Believe In You (Hallelujah)</li>
<li>Tuhan Yang Berperang</li>
<li>Bersinar Terang</li>
<li>Reign</li>
<li>Psalm 103</li>
<li>Kau Terhebat</li>
<li>Bersinar Bagimu</li>
</ul>
<p class="card-text"><small class="text-muted lastUpdate"></small></p>
</div>
</div>
</div>
</div>
<div class="card mb-3 mt-50" style="width: 100%;">
<div class="row no-gutters">
<div class="col-md-4">
<img src="./assets/3ce3c824928923014ef9aa83caefaaad.jpg" class="card-img" alt="...">
</div>
<div class="col-md-8">
<div class="card-body">
<h5 class="card-title">HILLSONG WORSHIP</h5>
<ul>
<li>Saviour King</li>
<li>This Is Our God</li>
<li>Faith + Hope + Love</li>
<li>A Beautiful Exchange</li>
<li>God is Able</li>
<li>Cornerstone</li>
<li>Glorious Ruins</li>
</ul>
<p class="card-text"><small class="text-muted lastUpdate"></small></p>
</div>
</div>
</div>
</div>
<div class="card mb-3 mt-50" style="width: 100%;">
<div class="row no-gutters">
<div class="col-md-4">
<img src="./assets/l.jpg" class="card-img" alt="...">
</div>
<div class="col-md-8">
<div class="card-body">
<h5 class="card-title">PLANETSHAKER</h5>
<ul>
<li>Only Way</li>
<li>I Choose You</li>
<li>Fall on Me</li>
<li>Rain Your Glory Down</li>
</ul>
<p class="card-text"><small class="text-muted lastUpdate"></small></p>
</div>
</div>
</div>
</div>

<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<script src="./index.js"></script>
</body>
<footer class="footer navbar-fixed-bottom" style="background-color: black;">
<p style="text-align-last: center;color: blanchedalmond;">Copyright ©2019</p>
</footer>
</html>
Loading