Skip to content

Commit

Permalink
...fixed conflicts
Browse files Browse the repository at this point in the history
  • Loading branch information
@pirateIV
pirateIV committed Aug 7, 2023
2 parents 6cb049d + 325811a commit 66878a3
Show file tree
Hide file tree
Showing 5 changed files with 389 additions and 105 deletions.
25 changes: 25 additions & 0 deletions css/movie.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,3 +44,28 @@ body {
.watch-now-button:hover {
background-color: #ff77a9;
}

/* Movie main section */

.rating-length {
padding: 10px;
width: 50px;
}

.rate-count {
width: 95px;
}

.rating {
width: 50px !important;
-webkit-background-clip: text;
background-color: green;
-webkit-text-fill-color: transparent;
width: auto;
display: flex;
top: -2px;
}

.rating i {
color: transparent !important;
}
5 changes: 0 additions & 5 deletions html/contact.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,11 +34,6 @@
<i class="fas fa-angle-down"></i>
</a>
</li>
<li>
<a class="text-uppercase text-decoration-none text-white" href="pages.html">Pages
<i class="fas fa-angle-down"></i>
</a>
</li>
<li>
<a class="text-uppercase text-decoration-none text-white " href="./movie.html">Movies
<!-- <i class="fas fa-angle-down"></i> -->
Expand Down
194 changes: 95 additions & 99 deletions html/movie.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,13 @@
<link rel="stylesheet" href="../css/main.css" />
<link rel="stylesheet" href="../css/index.css">
<link rel="stylesheet" href="../css/media.css" />
<link rel="stylesheet" href="../fontawesome-free-6.4.0-web/fontawesome-free-6.4.0-web/css/all.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.1/css/bootstrap.min.css"
integrity="sha512-Z/def5z5u2aR89OuzYcxmDJ0Bnd5V1cKqBEbvLOiUNWdg9PQeXVvXLI90SE4QOHGlfLqUnDNVAYyZi8UwUTmWQ=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- <link
rel="stylesheet"
href="../fontawesome-free-6.4.0-web/fontawesome-free-6.4.0-web/css/all.min.css"
/> -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<link rel="stylesheet" href="../bootstrap.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.1/css/bootstrap.min.css" integrity="sha512-Z/def5z5u2aR89OuzYcxmDJ0Bnd5V1cKqBEbvLOiUNWdg9PQeXVvXLI90SE4QOHGlfLqUnDNVAYyZi8UwUTmWQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>

</style>
Expand All @@ -28,7 +30,7 @@
<img class="navbar-brand ms-9" width="160" src="../img/logo.png" /></a>

<i id="nav-toggle" class="fas fa-bars text-white ps-4 d-lg-none d-flex order-lg-0"></i>
<ul class="nav-links nav align-items-center order-lg-0">
<ul class="nav-links nav align-items-center gap-4 order-lg-0" >
<li>
<a class="text-uppercase text-decoration-none text-white" href="../index.html">Home
<i class="fas fa-angle-down"></i>
Expand All @@ -39,11 +41,6 @@
<i class="fas fa-angle-down"></i>
</a>
</li>
<li>
<a class="text-uppercase text-decoration-none text-white" href="pages.html">Pages
<i class="fas fa-angle-down"></i>
</a>
</li>
<li>
<a class="text-uppercase text-decoration-none text-danger active" href="./movie.html">Movies
<!-- <i class="fas fa-angle-down"></i> -->
Expand All @@ -60,8 +57,8 @@
</ul>

<ul class="nav-icons nav gap-3 align-items-center flex-nowrap order-md-3 order-3">

<i class="fas fa-search text-white" onclick="slide('next')"></i>

<li>
<a href=""><img src="../img/user.png" width="30" alt="user" /></a>
</li>
Expand All @@ -75,104 +72,103 @@

</div>

<div class="section-main-right page two">
<button onclick="slide('previous')">Previous</button>
<section class="search d-flex justify-content-center flex-column align-items-center position-relative"
id="section-search">
<h1 class="fs-1 text-white">Search and Discover</h1>
<small class="small text-danger">the unknown</small>
<div class="d-flex align-items-center justify-content-center flex-column mt-2 gap-3">
<select class="select form-control w-auto">
<option value="movie">Movie</option>
<option value="movie">Series</option>
<option value="person">Person</option>
</select>
<form class="search-box d-flex gap-3" id="search-form">
<input type="text" id="search" class="form-control" placeholder="Search for movies...">
<a href="#searchSection" class="btn btn-danger"><i class="fas fa-search"></i></a>
</form>
</div>
<section class="search d-flex justify-content-center flex-column align-items-center position-relative" id="section-search">
<h1 class="fs-1 text-white">Search and Discover</h1>
<small class="small text-danger">the unknown</small>
<div class="d-flex align-items-center justify-content-center flex-column mt-2 gap-3">
<select class="select form-control w-auto">
<option value="movie">Movie</option>
<option value="movie">Series</option>
<option value="person">Person</option>
</select>
<form class="search-box d-flex gap-3" id="search-form">
<input type="text" id="search" class="form-control" placeholder="Search for movies...">
<button class="btn btn-danger"><i class="fas fa-search"></i></button>
</form>
</div>

<div class="header-mt-5">
<ul class="d-flex gap-2 text-nowrap align-items-center justify-content-between gap-5">
<a class="text-danger fs-4 d-lg-block d-none">@Search Movie</a>
<div class="d-md-flex justify-content-center d-none btm position-absolute bottom-0 end-0 ">
<a href="" class="text-white text-decoration-none">Home</a> <span class="text-muted"> | </span>
<a href="" class="text-white text-decoration-none">Now Playing Movies</a> <span class="text-muted"> |
</span>
<a href="" class="text-white text-decoration-none">Popular Movies</a> <span class="text-muted"> |
</span>
<a href="" class="text-white text-decoration-none">Upcoming Movies</a>
</div>
</ul>
<div class="header-mt-5">
<ul class="d-flex gap-2 text-nowrap align-items-center justify-content-between gap-5">
<a class="text-danger fs-4 d-lg-block d-none">@Search Movie</a>
<div class="d-md-flex justify-content-center d-none btm position-absolute bottom-0 end-0 ">
<a href="" class="text-white text-decoration-none">Home</a> <span class="text-muted"> | </span>
<a href="" class="text-white text-decoration-none">Now Playing Movies</a> <span class="text-muted"> |
</span>
<a href="" class="text-white text-decoration-none">Popular Movies</a> <span class="text-muted"> | </span>
<a href="" class="text-white text-decoration-none">Upcoming Movies</a>
</div>
</section>
</ul>
</div>
</section>

<div class="filter-section mt-5" id="filter-section">
<div class="filter-section mt-5" id="filter-section">

<div class="container">
<h2 class="text-white">Movie Filter Options</h2>
<p class="text-white">Customize your movie search using the filters below:</p>
</div>
<div class="container">
<h2 class="text-white">Movie Filter Options</h2>
<p class="text-white">Customize your movie search using the filters below:</p>
</div>

<form action="" class="filter-container" id="filterContainer">
<div class="d-flex justify-content-between w-100 ">
<label for="includeAdult">Include Adult:</label>
<input type="checkbox" class="form-check" id="includeAdult" checked>
</div>

<label for="language">Language:</label>

<select name="language" id="languageSelect" class="form-select bg-secondary">
<option value="" selected disabled>Language</option>
</select>

<label for="genre">Genre: </label>

<select name="genre" id="genreSelect" class="form-select bg-secondary">
<option value="" selected disabled>Genre</option>
</select>

<label for="sortBy">Sort By:</label>
<select id="sortBy" class="form-select bg-secondary">
<option value="" disabled>Sort By</option>
<option value="vote_count" selected>Vote Count</option>
<option value="popularity_asc">Popularity (Ascending)</option>
<option value="popularity_desc">Popularity (Descending)</option>
<option value="revenue_asc">Revenue (Ascending)</option>
<option value="revenue_desc">Revenue (Descending)</option>
<option value="release_date_asc">Release Date (Ascending)</option>
<option value="release_date_desc">Release Date (Descending)</option>
</select>

<label for="releaseYear">Release Year:</label>
<input type="number" class="form-control" id="releaseYear" min="1900" max="2099"
placeholder="curr - 2023">

<button class="btn btn-danger" id="applyFilters">Apply Filters</button>
</form>
<form action="" class="filter-container" id="filterContainer">
<div class="d-flex justify-content-between w-100 ">
<label for="includeAdult">Include Adult:</label>
<input type="checkbox" class="form-check" id="includeAdult" checked>
</div>

<div class="section-mov-card m-auto container p-5 mt-5 rounded mb-5" id="searchSection">
<div class="section-mov-card m-auto container p-5 mt-5 rounded mb-5" id="searchSection" style="background-color: brown;">
<label for="language">Language:</label>

<div class="text-center p-5 m-5" id="spinalDiv">
<div class="spinner-border text-primary text-center" role="status">
<span class="sr-only text-center">Loading...</span>
</div>
</div>
</div>
<select name="language" id="languageSelect" class="form-select bg-secondary">
<option value="" selected disabled>Language</option>
<!-- Add more language options here -->
</select>

<label for="genre">Genre: </label>

<div class="position-fixed top-0 movContainer" id="movContainer"
style="width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.4);">
<div class="selected-mov-detail bg-000 text-white position-fixed p-3" id="selectedMovieDisplay">
</div>
</div>
<select name="genre" id="genreSelect" class="form-select bg-secondary">
<option value="" selected disabled>Genre</option>
<!-- Fetch the available genres from TMDB -->
</select>

<!-- labe -->

<label for="sortBy">Sort By:</label>
<select id="sortBy" class="form-select bg-secondary">
<option value="" disabled>Sort By</option>
<option value="vote_count" selected>Vote Count</option>
<option value="popularity_asc">Popularity (Ascending)</option>
<option value="popularity_desc">Popularity (Descending)</option>
<option value="revenue_asc">Revenue (Ascending)</option>
<option value="revenue_desc">Revenue (Descending)</option>
<option value="release_date_asc">Release Date (Ascending)</option>
<option value="release_date_desc">Release Date (Descending)</option>
</select>

<label for="releaseYear">Release Year:</label>
<input type="number" class="form-control" id="releaseYear" min="1900" max="2099"
placeholder="curr - 2023">

<button class="btn btn-danger" id="applyFilters" >Apply Filters</button>
</form>
</div>


<div class="section-mov-card m-auto container p-5 mt-5 rounded mb-5" id="searchSection">
<div class="section-mov-card m-auto container p-5 mt-5 rounded mb-5" id="searchSection" style="background-color: brown;">

<div class="text-center p-5 m-5" id="spinalDiv">
<div class="spinner-border text-primary text-center" role="status">
<span class="sr-only text-center">Loading...</span>
</div>
</div>
</div>


<div class="position-fixed top-0 movContainer" id="movContainer"
style="width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.4);">
<div class="selected-mov-detail bg-000 text-white position-fixed p-3" id="selectedMovieDisplay">
</div>
</div>



</main>
<footer class="footer">
<div class="container">
Expand Down Expand Up @@ -212,8 +208,8 @@ <h4>Contact Us</h4>
</div>
</footer>

<!-- <script src="../js/script.js"></script> -->
<script src="../js/search.js"></script>
<script src="../js/movies.js"></script>
<script src="../js/utils.js"></script>
</body>

Expand Down
Loading

0 comments on commit 66878a3

Please sign in to comment.