From a9386d6d155241de489c80789eecf9f219b4bbe2 Mon Sep 17 00:00:00 2001
From: Mohammad Rameen <qwerty@dummy.com>
Date: Wed, 17 Sep 2025 06:17:03 +0530
Subject: [PATCH] Added new top movie project

---
 .../.DS_Store                                 | Bin 0 -> 6148 bytes
 .../day-64-starting-files-top-movies/main.py  |  40 ++++
 .../requirements.txt                          |   8 +
 .../static/css/styles.css                     | 214 ++++++++++++++++++
 .../templates/add.html                        |   9 +
 .../templates/base.html                       |  39 ++++
 .../templates/edit.html                       |   8 +
 .../templates/index.html                      |  37 +++
 .../templates/select.html                     |  13 ++
 9 files changed, 368 insertions(+)
 create mode 100644 Visual Studio Code Projects/day-64-starting-files-top-movies/.DS_Store
 create mode 100644 Visual Studio Code Projects/day-64-starting-files-top-movies/main.py
 create mode 100644 Visual Studio Code Projects/day-64-starting-files-top-movies/requirements.txt
 create mode 100644 Visual Studio Code Projects/day-64-starting-files-top-movies/static/css/styles.css
 create mode 100644 Visual Studio Code Projects/day-64-starting-files-top-movies/templates/add.html
 create mode 100644 Visual Studio Code Projects/day-64-starting-files-top-movies/templates/base.html
 create mode 100644 Visual Studio Code Projects/day-64-starting-files-top-movies/templates/edit.html
 create mode 100644 Visual Studio Code Projects/day-64-starting-files-top-movies/templates/index.html
 create mode 100644 Visual Studio Code Projects/day-64-starting-files-top-movies/templates/select.html

diff --git a/Visual Studio Code Projects/day-64-starting-files-top-movies/.DS_Store b/Visual Studio Code Projects/day-64-starting-files-top-movies/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..c6eca5882057dfdfdc6e0fe24945679ec06d110c
GIT binary patch
literal 6148
zcmeHK!A`?440XnYHg@TeV=jEa{-8|dj<g?uwi6(=N~OZRd<z#Yd<Or;b8JoPnu!~l
zkS#ecb?n4_t?HVH+~%!b6J<oSfHKaO7!tzktP`23<qGKH9xqhYebtm9G!t(#oFfDL
z>@KONS9*jVJ-^XH^R(Vpq3z@@vYX?;HWWqKgc5eVEyMfg$M@~jr~cKadp<nJV+&d$
zwH>w8Q4`bLQGfWFC6>p@uD;TnoJcvbUmKE%Cp^dL-*fsV#(*(k44fMSsM#!wm7tBr
zfH7bU>>1$igNHKaii2SMbYO@r0B{a-6wJAo;25u%D-MEKfj9{TN~qHo!$~;oUj1^#
zK~TcUY4hRqWTzd9i>G6MAKl62f;Jih#=w|?3%Sg={@<PM|HnagWegYt|B3-OFSf-7
zx1_aoa&ug3J@f&}!hVC`J_M6kis8$p_!=4ocFz-Ft~dz70<j-~NP`W=z@IYk1H{{0
AS^xk5

literal 0
HcmV?d00001

diff --git a/Visual Studio Code Projects/day-64-starting-files-top-movies/main.py b/Visual Studio Code Projects/day-64-starting-files-top-movies/main.py
new file mode 100644
index 0000000..039c7c2
--- /dev/null
+++ b/Visual Studio Code Projects/day-64-starting-files-top-movies/main.py	
@@ -0,0 +1,40 @@
+from flask import Flask, render_template, redirect, url_for, request
+from flask_bootstrap import Bootstrap5
+from flask_sqlalchemy import SQLAlchemy
+from sqlalchemy.orm import DeclarativeBase, Mapped, mapped_column
+from sqlalchemy import Integer, String, Float
+from flask_wtf import FlaskForm
+from wtforms import StringField, SubmitField
+from wtforms.validators import DataRequired
+import requests
+
+'''
+Red underlines? Install the required packages first: 
+Open the Terminal in PyCharm (bottom left). 
+
+On Windows type:
+python -m pip install -r requirements.txt
+
+On MacOS type:
+pip3 install -r requirements.txt
+
+This will install the packages from requirements.txt for this project.
+'''
+
+app = Flask(__name__)
+app.config['SECRET_KEY'] = '8BYkEfBA6O6donzWlSihBXox7C0sKR6b'
+Bootstrap5(app)
+
+# CREATE DB
+
+
+# CREATE TABLE
+
+
+@app.route("/")
+def home():
+    return render_template("index.html")
+
+
+if __name__ == '__main__':
+    app.run(debug=True)
diff --git a/Visual Studio Code Projects/day-64-starting-files-top-movies/requirements.txt b/Visual Studio Code Projects/day-64-starting-files-top-movies/requirements.txt
new file mode 100644
index 0000000..4422a35
--- /dev/null
+++ b/Visual Studio Code Projects/day-64-starting-files-top-movies/requirements.txt	
@@ -0,0 +1,8 @@
+Bootstrap_Flask==2.2.0
+Requests==2.31.0
+WTForms==3.0.1
+Flask_WTF==1.2.1
+Werkzeug==3.0.0
+Flask==2.3.2
+flask_sqlalchemy==3.1.1
+SQLAlchemy==2.0.25
diff --git a/Visual Studio Code Projects/day-64-starting-files-top-movies/static/css/styles.css b/Visual Studio Code Projects/day-64-starting-files-top-movies/static/css/styles.css
new file mode 100644
index 0000000..d6f8963
--- /dev/null
+++ b/Visual Studio Code Projects/day-64-starting-files-top-movies/static/css/styles.css	
@@ -0,0 +1,214 @@
+*, *:before, *:after {
+	 box-sizing: border-box;
+}
+ html {
+	 font-size: 18px;
+	 line-height: 1.5;
+	 font-weight: 300;
+	 color: #333;
+	 font-family: "Nunito Sans", sans-serif;
+}
+ body {
+	 margin: 0;
+	 padding: 0;
+	 height: 100vh;
+	 background-color: #ecf0f9;
+	 background-attachment: fixed;
+}
+.large {
+     font-size: 3rem;
+}
+ .content {
+	 display: flex;
+	 margin: 0 auto;
+	 justify-content: center;
+	 align-items: center;
+	 flex-wrap: wrap;
+	 max-width: 1500px;
+}
+ p.overview {
+	 font-size: 12px;
+	 height: 200px;
+	 width: 100%;
+	 overflow: hidden;
+	 text-overflow: ellipsis;
+}
+ .heading {
+	 width: 100%;
+	 margin-left: 1rem;
+	 font-weight: 900;
+	 font-size: 1.618rem;
+	 text-transform: uppercase;
+	 letter-spacing: 0.1ch;
+	 line-height: 1;
+	 padding-bottom: 0.5em;
+	 margin-bottom: 1rem;
+	 position: relative;
+}
+ .heading:after {
+	 display: block;
+	 content: '';
+	 position: absolute;
+	 width: 60px;
+	 height: 4px;
+	 background: linear-gradient(135deg, #1a9be6, #1a57e6);
+	 bottom: 0;
+}
+ .description {
+	 width: 100%;
+	 margin-top: 0;
+	 margin-left: 1rem;
+	 margin-bottom: 3rem;
+}
+ .card {
+	 color: inherit;
+	 cursor: pointer;
+	 width: calc(33% - 3rem);
+	 min-width: calc(33% - 3rem);
+	 height: 400px;
+	 min-height: 400px;
+	 perspective: 1000px;
+	 margin: 1rem auto;
+	 position: relative;
+}
+ @media screen and (max-width: 800px) {
+	 .card {
+		 width: calc(50% - 3rem);
+	}
+}
+ @media screen and (max-width: 500px) {
+	 .card {
+		 width: 100%;
+	}
+}
+ .front, .back {
+	 display: flex;
+	 border-radius: 6px;
+	 background-position: center;
+	 background-size: cover;
+	 text-align: center;
+	 justify-content: center;
+	 align-items: center;
+	 position: absolute;
+	 height: 100%;
+	 width: 100%;
+	 -webkit-backface-visibility: hidden;
+	 backface-visibility: hidden;
+	 transform-style: preserve-3d;
+	 transition: ease-in-out 600ms;
+}
+ .front {
+	 background-size: cover;
+	 padding: 2rem;
+	 font-size: 1.618rem;
+	 font-weight: 600;
+	 color: #fff;
+	 overflow: hidden;
+	 font-family: Poppins, sans-serif;
+}
+ .front:before {
+	 position: absolute;
+	 display: block;
+	 content: '';
+	 top: 0;
+	 left: 0;
+	 right: 0;
+	 bottom: 0;
+	 background: linear-gradient(135deg, #1a9be6, #1a57e6);
+	 opacity: 0.25;
+	 z-index: -1;
+}
+ .card:hover .front {
+	 transform: rotateY(180deg);
+}
+ .card:nth-child(even):hover .front {
+	 transform: rotateY(-180deg);
+}
+ .back {
+	 background: #fff;
+	 transform: rotateY(-180deg);
+	 padding: 0 2em;
+}
+ .card:hover .back {
+	 transform: rotateY(0deg);
+}
+ .card:nth-child(even) .back {
+	 transform: rotateY(180deg);
+}
+ .card:nth-child(even):hover .back {
+	 transform: rotateY(0deg);
+}
+ .button {
+	 transform: translateZ(40px);
+	 cursor: pointer;
+	 -webkit-backface-visibility: hidden;
+	 backface-visibility: hidden;
+	 font-weight: bold;
+	 color: #fff;
+	 padding: 0.5em 1em;
+	 border-radius: 100px;
+	 font: inherit;
+	 background: linear-gradient(135deg, #1a9be6, #1a57e6);
+	 border: none;
+	 position: relative;
+	 transform-style: preserve-3d;
+	 transition: 300ms ease;
+}
+ .button:before {
+	 transition: 300ms ease;
+	 position: absolute;
+	 display: block;
+	 content: '';
+	 transform: translateZ(-40px);
+	 -webkit-backface-visibility: hidden;
+	 backface-visibility: hidden;
+	 height: calc(100% - 20px);
+	 width: calc(100% - 20px);
+	 border-radius: 100px;
+	 left: 10px;
+	 top: 16px;
+	 box-shadow: 0 0 10px 10px rgba(26, 87, 230, 0.25);
+	 background-color: rgba(26, 87, 230, 0.25);
+}
+
+.button.delete-button {
+	 background-color: rgba(230, 87, 230, 0.25);
+	 background: linear-gradient(135deg, #e61a46, #e61a1a);
+}
+.button.delete-button:before {
+	 background-color: rgba(230, 87, 230, 0.25);
+	 box-shadow: 0 0 10px 10px rgba(230, 87, 230, 0.25);
+}
+ .button:hover {
+	 transform: translateZ(55px);
+}
+ .button:hover:before {
+	 transform: translateZ(-55px);
+}
+ .button:active {
+	 transform: translateZ(20px);
+}
+ .button:active:before {
+	 transform: translateZ(-20px);
+	 top: 12px;
+	 top: 12px;
+}
+.container.add {
+    margin-top: 40px;
+    margin-bottom: 20px;
+}
+.rating {
+    color: #E4BB23;
+}
+.review {
+    font-style: italic;
+}
+ .movie_gens {
+	 font-size: 11.5px;
+}
+ .title {
+	 font-weight: bold;
+}
+ .release_date {
+	 font-weight: normal;
+}
diff --git a/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/add.html b/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/add.html
new file mode 100644
index 0000000..3cb0fd6
--- /dev/null
+++ b/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/add.html	
@@ -0,0 +1,9 @@
+{% extends 'base.html' %}
+
+{% block title %}Add Movie{% endblock %}
+
+{% block content %}
+<div class="content">
+    <h1 class="heading">Add a Movie</h1>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/base.html b/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/base.html
new file mode 100644
index 0000000..1475f37
--- /dev/null
+++ b/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/base.html	
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1, shrink-to-fit=no"
+    />
+
+    {% block styles %}
+    <!-- Load Bootstrap-Flask CSS here -->
+    {{ bootstrap.load_css() }}
+    <!-- Link to the styles.css here to apply styling to all the child templates.-->
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css?family=Nunito+Sans:300,400,700"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css?family=Poppins:300,400,700"
+    />
+    <link
+      rel="stylesheet"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
+      integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
+      crossorigin="anonymous"
+    />
+    <link
+      rel="stylesheet"
+      href="{{ url_for('static', filename='css/styles.css') }}"
+    />
+    {% endblock %}
+
+    <title>{% block title %}{% endblock %}</title>
+  </head>
+  <body>
+    {% block content %}{% endblock %}
+  </body>
+</html>
diff --git a/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/edit.html b/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/edit.html
new file mode 100644
index 0000000..d77bbdd
--- /dev/null
+++ b/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/edit.html	
@@ -0,0 +1,8 @@
+{% extends 'base.html' %} {% from 'bootstrap5/form.html' import render_form %}
+{% block title %}Edit Movies{% endblock %} {% block content %}
+<div class="content">
+  <h1 class="heading">Movie Title</h1>
+  <p class="description">Edit Movie Rating</p>
+  {{ render_form(form, novalidate=True) }}
+</div>
+{% endblock %}
diff --git a/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/index.html b/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/index.html
new file mode 100644
index 0000000..f30f810
--- /dev/null
+++ b/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/index.html	
@@ -0,0 +1,37 @@
+{% extends 'base.html' %}
+
+{% block title %}My Top 10 Movies{% endblock %}
+
+{% block content %}
+<div class="container">
+  <h1 class="heading">My Top 10 Movies</h1>
+  <p class="description">These are my all-time favourite movies.</p>
+   
+  <div class="card" >
+    <div class="front" style="background-image: url('https://www.shortlist.com/media/images/2019/05/the-30-coolest-alternative-movie-posters-ever-2-1556670563-K61a-column-width-inline.jpg');">
+        <p class="large">1</p>
+    </div>
+    <div class="back">
+      <div>
+    <div class="title">Drive <span class="release_date">(2011)</span></div>
+        <div class="rating">
+            <label>7.5</label>
+          <i class="fas fa-star star"></i>
+        </div>
+          <p class="review">"Loved it!"</p>
+        <p class="overview">
+            A mysterious Hollywood stuntman and mechanic moonlights as a getaway driver and finds himself in trouble when he helps out his neighbor in this action drama.
+        </p>
+
+        <a href="#" class="button">Update</a>
+        <a href="#" class="button delete-button">Delete</a>
+
+      </div>
+    </div>
+  </div>
+</div>
+<div class="container text-center add">
+<a href="#" class="button">Add Movie</a>
+</div>
+
+{% endblock %}
\ No newline at end of file
diff --git a/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/select.html b/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/select.html
new file mode 100644
index 0000000..9a8f1c5
--- /dev/null
+++ b/Visual Studio Code Projects/day-64-starting-files-top-movies/templates/select.html	
@@ -0,0 +1,13 @@
+{% extends 'base.html' %}
+
+{% block title %}Select Movie{% endblock %}
+
+{% block content %}
+<div class="container">
+    <h1 class="heading">Select Movie</h1>
+  <p>
+    <a href="#"> MOVIE TITLE - MOVIE RELEASE DATE</a>
+  </p>
+
+</div>
+{% endblock %}
\ No newline at end of file