Skip to content

Commit

Permalink
created media.html
Browse files Browse the repository at this point in the history
  • Loading branch information
Nathius262 committed Jul 8, 2024
1 parent 4506395 commit 7dc6058
Show file tree
Hide file tree
Showing 9 changed files with 249 additions and 10 deletions.
18 changes: 9 additions & 9 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -142,24 +142,24 @@ <h4 class="text-color-blue ft-upper fs-4 text-center">Media</h4>
</div>

<div class="container ft-upper text-color-blue d-sm-flex d-grid justify-content-center justify-content-sm-between align-items-center" style="display: grid;">
<div class="icon">
<a href="media.html" class="icon" style="background: none;">
<img src="static/img/icon/sermon.png" alt="sermon">
<div>
<div class=" ft-upper text-color-blue fw-light">
sermon
</div>
</div>
<div class="icon">
</a>
<a href="" class="icon" style="background: none;">
<img src="static/img/icon/nw.png" alt="now word">
<div>
<div class=" ft-upper text-color-blue fw-light">
Now Word
</div>
</div>
<div class="icon">
</a>
<a href="" class="icon" style="background: none;">
<img src="static/img/icon/mp3.png" alt="mp3">
<div>
<div class=" ft-upper text-color-blue fw-light">
Zoe Records
</div>
</div>
</a>
</div>

<div class="row pt-5 pb-4 justify-content-center">
Expand Down
208 changes: 208 additions & 0 deletions media.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,208 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="description" content="Glory Carriers Ministry Int'l is a global ministry designed to bring men into the light of God's Glory, untill all eyes can see Christ revealed.">
<meta name="keywords" content="glory carriers, embassy of glory, GCMI,">
<meta name="author" content="gcmi">
<meta property="og:title" content="Glory Carriers Ministry Int'l">
<meta property="og:description" content="Glory Carriers Ministry Int'l is a global ministry designed to bring men into the light of God's Glory, untill all eyes can see Christ revealed.">
<meta property="og:image" content="">
<meta property="og:url" content="">

<!--twitter social share-->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Glory Carriers Ministry Int'l" id="twitterTitle">
<meta name="twitter:description" content="Glory Carriers Ministry Int'l is a global ministry designed to bring men into the light of God's Glory, untill all eyes can see Christ revealed." id="twitterDescription">
<meta name="twitter:image" content="static/img/logo.png" id="twitterImage">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="static/css/pageloader.css">
<title>GCMI</title>

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
</head>
<body>
<!--============PRELOADER==============-->
<div id="preloader">
<div class="container">
<div class="ring"></div>
<div class="ring"></div>
<div class="ring"></div>
<div class="loading">
<img width="80" src="static/img/g_logo.png" alt="GCMI G_logo">
</div>
</div>
</div>
<!--============PRELOADER END==============-->

<!--============ROOT SECTION==============-->
<section id="root" class="show-hidden">
<!--=========HEADER BEGIN===========-->
<nav id="header" class="navbar navbar-expand-md navbar-dark fixed-top mediumnavigation nav-down" aria-label="Fourth navbar example">

</nav>
<!--=========HEADER END===========-->

<!--=========MAIN BEGIN===========-->
<main>
<!---=========INTRO BEGIN========-->
<section class="intro mb-0 ft-upper" style="background: url(static/img/media_bg.jfif); background-size:cover;background-repeat:no-repeat;">
<div class="container" >
<div class="row justify-content-center align-items-end">
<div class="col-md-8 justify-content-center" style="position: relative;">
<div class="d-grid justify-content-center latest_media">
<h4 class="text-center fs-6 fw-bold">Latest Sermon</h4>
<h2 class="text-center" class="fw-bold h1">A Call To Prayer</h2>
<div class="d-flex justify-content-center">
<img src="static/img/icon/download.png" width="360" alt="download">
</div>
</div>
</div>
</div>
</div>

<div class="ellipse_media"></div>

</section>

<!---=========INTRO END========-->


<section class=" mb-5">
<div class="container mt-5">

<div class="row justify-content-center align-items-center">
<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>

<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>
<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>
<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>
<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>
<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>
<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>
<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>
<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>
<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>
<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>
<div class="col-lg-2 col-md-4 col-sm-6 col mb-4">
<div class="">
<img width="100%" class="rounded-4" src="static/img/m1.jfif" alt="tehilla">
</div>
<div class="text-secondary text-center ft-upper fs-6">
<img src="static/img/icon/listen.png" width="90" alt="">
</div>
</div>

</div>
</div>
</section>

</main>
<!--=========MAIN END===========-->

<!--=========FOOTER BEGIN===========-->

<footer id="footer" class="pt-5 pb-0 m-0">

</footer>
<!--=========FOOTER END===========-->
</section>
<!--============ROOT SECTION END==============-->

<!--========JavaScript================ -->
<script>
window.addEventListener('load', ()=>{
setInterval(()=>{
document.querySelector("#preloader").classList.add('hidden-item')
document.querySelector("#root").classList.remove('show-hidden')
}, 3000)

/*document.querySelector('#screen-mode').addEventListener('click', ()=> {
document.querySelector('body').classList.toggle('body-dark')
})*/
})
</script>

<script type="module" src="static/js/app.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js" integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+" crossorigin="anonymous"></script>
<!--========JavaScript END================ -->
</body>
</html>
31 changes: 31 additions & 0 deletions static/css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -124,6 +124,17 @@ a{
z-index: -3;
}

.ellipse_media {
position: absolute;
width: 100%;
height: 576px;
left: 0px;
top: 300px;
background:rgba(15, 19, 116, 0.45);
filter: blur(51.05px);
z-index: -3;
}

/*LIVE STREAM */
#live-stream{
position: absolute;
Expand Down Expand Up @@ -270,6 +281,26 @@ a{
margin-bottom: 0;
}


.latest_media h4{
font-family: Nexa-Bold;
font-size: 24px;
font-weight: 400;
line-height: 30.77px;
letter-spacing: 0.91em;
text-align: left;
color: var(--yellow);
}

.latest_media h2{
font-family: Trajan Pro 3;
font-size: 50px;
font-weight: 400;
line-height: 76.8px;
text-align: left;

}

/* DEPARTMENT*/
.department-bg {
position: absolute;
Expand Down
Binary file removed static/img/icon/R.jfif
Binary file not shown.
Binary file added static/img/icon/download.png
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 static/img/icon/listen.png
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 static/img/m1.jfif
Binary file not shown.
Binary file added static/img/media_bg.jfif
Binary file not shown.
2 changes: 1 addition & 1 deletion static/js/components/Header.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ function Header(){
<a class="nav-link" href="#">Giving</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Media</a>
<a class="nav-link" href="media.html">Media</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact Us</a>
Expand Down

0 comments on commit 7dc6058

Please sign in to comment.