diff --git a/accounts/templates/profile copy.html b/accounts/templates/profile copy.html new file mode 100644 index 0000000..57264ea --- /dev/null +++ b/accounts/templates/profile copy.html @@ -0,0 +1,73 @@ +{% extends "base.html" %} + +{% block page_header %} +

Log in to your account.

+{% endblock page_header %} + +{% block content %} + + +

+ User Details +

+

+ {{ user.username }} +
+ {{ user.userinfo.user_type }} + +

+ +

Lists of all Signin User's Videos

+ + {% for movie in movies %} + + + + + + {% empty %} + +

+ No movie Yet! +

+ +
  • + Would you like to UPLOAD a Movie? +
    • + {% endfor %} + + +

    Lists of all Favourites

    + + {% for favourite in favourites %} + + + + + + {% empty %} + +

    + No Favourites Yet! +

    + +
  • + Would you like to checkout some Movies? +
    • + {% endfor %} + +{% endblock content %} + + + + + + + + + + diff --git a/accounts/templates/profile.html b/accounts/templates/profile.html index 57264ea..8b4cd59 100644 --- a/accounts/templates/profile.html +++ b/accounts/templates/profile.html @@ -1,73 +1,459 @@ -{% extends "base.html" %} + + -{% block page_header %} -

    Log in to your account.

    -{% endblock page_header %} + + + + + Creator Profile + -{% block content %} + + + + + + {% load static %} +
    + {% include 'movies/navbar.html' %} +
    + {% include 'movies/sidebar.html' %} +
    + + {% if request.user.userinfo.avatar %} +
    + {% else %} + + {% endif %} + +
    {{ user.first_name }} {{user.last_name}}
    0 subscribers.
    +
    Subscribe
    +
    + +
    +
    +
    +
    +
    +
    + +
    +
    + +
    + +
    +

    Latest Video

    +
    +
    +

    + "A High school Story"-
    Teen Comedy

    +
    As the new school year begins at faith high.the football team is ready to win and the cheerleaders are + ready to jump. +
    +
    +
    +

    +
    +

    My Uploads

    + {% for movie in movies %} +

    + + + +

    {{movie.title }}
    + + {% if movie.liked.count == 1 %} + 1 Like + {% else %} + + {{ movie.liked.count }} Likes + + {% endif %} + | {{ movie.updated }} +

    +
    + {% endfor %} + +
    + + +
    +

    My Favourites

    + {% for movie in favourites %} +

    + + + +

    {{movie.title }}
    + + {% if movie.liked.count == 1 %} + 1 Like + {% else %} + + {{ movie.liked.count }} Likes + + {% endif %} + | {{ movie.updated }} +

    +
    + {% endfor %} + +
    + + + + + + + \ No newline at end of file diff --git a/accounts/templates/registration/1234register.html b/accounts/templates/registration/1234register.html new file mode 100644 index 0000000..fedd0af --- /dev/null +++ b/accounts/templates/registration/1234register.html @@ -0,0 +1,87 @@ +{% extends "base.html" %} + +{% block page_header %} +

    Create An Account.

    +{% endblock page_header %} + +{% block content %} + +
    + {% csrf_token %} +

    + + + + Required. 150 characters or fewer. Letters, digits and @/./+/-/_ only. +

    + + +

    + + +

    + + +

    + + +

    + + +

    + + +

    + +

    + + +

    + + +

    + + + + Enter the same password as before, for verification. + +

    + +

    + + +

    + +

    + + +

    + +

    + + +

    + + + + +
    +{% endblock content %} + diff --git a/accounts/templates/registration/done/register.html b/accounts/templates/registration/done/register.html new file mode 100644 index 0000000..ca999b1 --- /dev/null +++ b/accounts/templates/registration/done/register.html @@ -0,0 +1,21 @@ +{% extends "base.html" %} + +{% block page_header %} +

    Create An Account.

    +{% endblock page_header %} + +{% block content %} + +
    + {% csrf_token %} + + {{ form.as_p }} + {{ user_info_form.as_p }} + + + + +
    + +{% endblock content %} + diff --git a/accounts/templates/registration/login.html b/accounts/templates/registration/login.html index 2e6daf8..535ffd3 100644 --- a/accounts/templates/registration/login.html +++ b/accounts/templates/registration/login.html @@ -1,19 +1,95 @@ -{% extends "base.html" %} + + +{% load static %} -{% block page_header %} -

    Log in to your account.

    -{% endblock page_header %} + + + + + Sign In + + -{% block content %} + +
    + +
    +
    + +
    + +
    +
    +
    -
    - {% csrf_token %} - {{ form.as_p }} + - - - -
    +
    +
    + +
    +

    Welcome Back

    +

    Please enter your details.

    +
    +
    + {% csrf_token %} + +
    + + +
    +
    +
    + Forgot Password? +
    +
    + +
    + +
    +
    +
    +
    +
    + +
    +
    -{% endblock content %} +
    + +
    +
    +
    + +
    +
    + +
    + +
    +
    + +
    + +
    +
    + +
    + +
    +
    +
    +
    + + + diff --git a/accounts/templates/registration/register.html b/accounts/templates/registration/register.html index ca999b1..17b0a39 100644 --- a/accounts/templates/registration/register.html +++ b/accounts/templates/registration/register.html @@ -1,21 +1,481 @@ -{% extends "base.html" %} + + -{% block page_header %} -

    Create An Account.

    -{% endblock page_header %} + + + + + Sign Up + + + + +
    +
    + +
    +
    +
    +
    +
    + +

    Join the Varsity Family

    +

    Please enter your details

    +
    - {% csrf_token %} - - {{ form.as_p }} - {{ user_info_form.as_p }} +{% csrf_token %} - +
    +

    + + +

    - +

    + + +

    +
    + +
    +
    +

    + + +

    + +

    + + +

    +
    +
    + +
    +

    + + +

    + +

    + + +

    + + + + + +
    + +
    + +
    +

    + + +

    + +

    + + + +

    +
    +
    +
    +

    + + +

    + +

    + + +

    +
    +
    +
    + +

    Already have an account? Sign in

    +
    +
    -{% endblock content %} +
    + + \ No newline at end of file diff --git a/accounts/urls.py b/accounts/urls.py index 984150d..aad1f2a 100644 --- a/accounts/urls.py +++ b/accounts/urls.py @@ -1,5 +1,6 @@ from django.urls import path,include from . import views +from django.contrib.auth.views import LoginView app_name = "accounts" diff --git a/dfgh/assets/404 PAGE NOT FOUND - Desktop.png b/dfgh/assets/404 PAGE NOT FOUND - Desktop.png new file mode 100644 index 0000000..99ca6e1 Binary files /dev/null and b/dfgh/assets/404 PAGE NOT FOUND - Desktop.png differ diff --git a/dfgh/assets/Forgot Password - Mobile.png b/dfgh/assets/Forgot Password - Mobile.png new file mode 100644 index 0000000..6effaec Binary files /dev/null and b/dfgh/assets/Forgot Password - Mobile.png differ diff --git a/dfgh/assets/Forgot password - Desktop.png b/dfgh/assets/Forgot password - Desktop.png new file mode 100644 index 0000000..53260c3 Binary files /dev/null and b/dfgh/assets/Forgot password - Desktop.png differ diff --git a/dfgh/assets/IMAGE (1).png b/dfgh/assets/IMAGE (1).png new file mode 100644 index 0000000..f0539b5 Binary files /dev/null and b/dfgh/assets/IMAGE (1).png differ diff --git a/dfgh/assets/IMAGE.png b/dfgh/assets/IMAGE.png new file mode 100644 index 0000000..5eb2db3 Binary files /dev/null and b/dfgh/assets/IMAGE.png differ diff --git a/dfgh/assets/Icon.png b/dfgh/assets/Icon.png new file mode 100644 index 0000000..d7b7878 Binary files /dev/null and b/dfgh/assets/Icon.png differ diff --git a/dfgh/assets/Page not Found - Mobile.png b/dfgh/assets/Page not Found - Mobile.png new file mode 100644 index 0000000..77e4b19 Binary files /dev/null and b/dfgh/assets/Page not Found - Mobile.png differ diff --git a/dfgh/assets/Search.png b/dfgh/assets/Search.png new file mode 100644 index 0000000..78e74b8 Binary files /dev/null and b/dfgh/assets/Search.png differ diff --git a/dfgh/assets/Sign in page.png b/dfgh/assets/Sign in page.png new file mode 100644 index 0000000..e2c9a47 Binary files /dev/null and b/dfgh/assets/Sign in page.png differ diff --git a/dfgh/assets/Yasmine.jpg b/dfgh/assets/Yasmine.jpg new file mode 100644 index 0000000..3a18a09 Binary files /dev/null and b/dfgh/assets/Yasmine.jpg differ diff --git a/dfgh/assets/bell.png b/dfgh/assets/bell.png new file mode 100644 index 0000000..ceed70b Binary files /dev/null and b/dfgh/assets/bell.png differ diff --git a/dfgh/assets/hamburger.png b/dfgh/assets/hamburger.png new file mode 100644 index 0000000..12474ed Binary files /dev/null and b/dfgh/assets/hamburger.png differ diff --git a/dfgh/assets/image 1.png b/dfgh/assets/image 1.png new file mode 100644 index 0000000..e7749e5 Binary files /dev/null and b/dfgh/assets/image 1.png differ diff --git a/static/assets/manage.py b/dfgh/assets/manage.py similarity index 100% rename from static/assets/manage.py rename to dfgh/assets/manage.py diff --git a/dfgh/assets/mic.png b/dfgh/assets/mic.png new file mode 100644 index 0000000..88bed81 Binary files /dev/null and b/dfgh/assets/mic.png differ diff --git a/dfgh/assets/rafiki.png b/dfgh/assets/rafiki.png new file mode 100644 index 0000000..ede079b Binary files /dev/null and b/dfgh/assets/rafiki.png differ diff --git a/dfgh/assets/video_upload.png b/dfgh/assets/video_upload.png new file mode 100644 index 0000000..1b7433f Binary files /dev/null and b/dfgh/assets/video_upload.png differ diff --git a/dfgh/dummy.png b/dfgh/dummy.png new file mode 100644 index 0000000..6bd8a7f Binary files /dev/null and b/dfgh/dummy.png differ diff --git a/media/avatar/FOUNDATION_LOGO_kc9LevH.jpg b/media/avatar/FOUNDATION_LOGO_kc9LevH.jpg new file mode 100644 index 0000000..6bfb429 Binary files /dev/null and b/media/avatar/FOUNDATION_LOGO_kc9LevH.jpg differ diff --git a/media/avatar/OIP.jpg b/media/avatar/OIP.jpg new file mode 100644 index 0000000..bd380ea Binary files /dev/null and b/media/avatar/OIP.jpg differ diff --git a/media/videos/10000000_5283624655065423_7484461294482746976_n.mp4 b/media/videos/10000000_5283624655065423_7484461294482746976_n.mp4 new file mode 100644 index 0000000..2190b0b Binary files /dev/null and b/media/videos/10000000_5283624655065423_7484461294482746976_n.mp4 differ diff --git a/media/videos/Jesus_Growing_Up_Luke_2_52_1.mp4 b/media/videos/Jesus_Growing_Up_Luke_2_52_1.mp4 new file mode 100644 index 0000000..94e7d50 Binary files /dev/null and b/media/videos/Jesus_Growing_Up_Luke_2_52_1.mp4 differ diff --git a/media/videos/_caintrent__explorepage_explore_reels.mp4 b/media/videos/_caintrent__explorepage_explore_reels.mp4 new file mode 100644 index 0000000..5dfd358 Binary files /dev/null and b/media/videos/_caintrent__explorepage_explore_reels.mp4 differ diff --git a/media/videos/zw4Qjf8SPNnploLa.mp4 b/media/videos/zw4Qjf8SPNnploLa.mp4 new file mode 100644 index 0000000..1c0bda1 Binary files /dev/null and b/media/videos/zw4Qjf8SPNnploLa.mp4 differ diff --git a/movie/settings.py b/movie/settings.py index f1e9add..b498a85 100644 --- a/movie/settings.py +++ b/movie/settings.py @@ -149,4 +149,7 @@ GRAPH_MODELS = { 'all_applications': True, 'group_models': True, -} \ No newline at end of file +} + + +LOGIN_REDIRECT_URL = "movies:all_movies" \ No newline at end of file diff --git a/movie/urls.py b/movie/urls.py index 5196971..3594cf4 100644 --- a/movie/urls.py +++ b/movie/urls.py @@ -19,8 +19,8 @@ from django.conf.urls.static import static urlpatterns = [ - path('', include('movies.urls')), path('accounts/', include('accounts.urls')), + path('', include('movies.urls')), path('admin/', admin.site.urls), ] diff --git a/movies/forms.py b/movies/forms.py index 18cd920..1bfe679 100644 --- a/movies/forms.py +++ b/movies/forms.py @@ -41,4 +41,4 @@ def save(self, commit=True): class UserInfoForm(forms.ModelForm): class Meta: model = UserInfo - fields = {'user_type' : '', 'avatar': ''} \ No newline at end of file + fields = {'user_type' : '','school': '', 'avatar': ''} \ No newline at end of file diff --git a/movies/migrations/0002_alter_userinfo_avatar.py b/movies/migrations/0002_alter_userinfo_avatar.py new file mode 100644 index 0000000..3343bd9 --- /dev/null +++ b/movies/migrations/0002_alter_userinfo_avatar.py @@ -0,0 +1,18 @@ +# Generated by Django 4.0.6 on 2022-08-11 19:59 + +from django.db import migrations, models + + +class Migration(migrations.Migration): + + dependencies = [ + ('movies', '0001_initial'), + ] + + operations = [ + migrations.AlterField( + model_name='userinfo', + name='avatar', + field=models.FileField(blank=True, null=True, upload_to='avatar/', verbose_name='Avatar'), + ), + ] diff --git a/movies/migrations/0003_userinfo_school.py b/movies/migrations/0003_userinfo_school.py new file mode 100644 index 0000000..2fda054 --- /dev/null +++ b/movies/migrations/0003_userinfo_school.py @@ -0,0 +1,18 @@ +# Generated by Django 4.0.6 on 2022-08-11 20:02 + +from django.db import migrations, models + + +class Migration(migrations.Migration): + + dependencies = [ + ('movies', '0002_alter_userinfo_avatar'), + ] + + operations = [ + migrations.AddField( + model_name='userinfo', + name='school', + field=models.CharField(blank=True, max_length=100, null=True, verbose_name='school'), + ), + ] diff --git a/movies/migrations/0004_userinfo_gender_alter_userinfo_user_type.py b/movies/migrations/0004_userinfo_gender_alter_userinfo_user_type.py new file mode 100644 index 0000000..99d27c5 --- /dev/null +++ b/movies/migrations/0004_userinfo_gender_alter_userinfo_user_type.py @@ -0,0 +1,24 @@ +# Generated by Django 4.0.6 on 2022-08-11 23:56 + +from django.db import migrations, models + + +class Migration(migrations.Migration): + + dependencies = [ + ('movies', '0003_userinfo_school'), + ] + + operations = [ + migrations.AddField( + model_name='userinfo', + name='gender', + field=models.CharField(default=1, max_length=10), + preserve_default=False, + ), + migrations.AlterField( + model_name='userinfo', + name='user_type', + field=models.CharField(max_length=10), + ), + ] diff --git a/movies/models.py b/movies/models.py index db6ceeb..b359e81 100644 --- a/movies/models.py +++ b/movies/models.py @@ -12,13 +12,16 @@ class UserInfo(models.Model): user = models.OneToOneField(User, on_delete=models.CASCADE) - user_type = models.CharField(max_length=10,choices=ACCOUNT_TYPE) + user_type = models.CharField(max_length=10) + school = models.CharField(max_length=100,null=True, blank=True, verbose_name="school") + + gender = models.CharField(max_length=10) #these are extended models features #user_type = models.CharField(max_length=6,null=True) - avatar = models.FileField(upload_to='avatar/', null=True, verbose_name="Avatar") + avatar = models.FileField(upload_to='avatar/', null=True, blank=True, verbose_name="Avatar") def __str__(self): return self.user.username diff --git a/movies/templates/12base.html b/movies/templates/12base.html new file mode 100644 index 0000000..d115c61 --- /dev/null +++ b/movies/templates/12base.html @@ -0,0 +1,287 @@ +{% load static %} + + + + + {% load static %} + + + + Base page + + + + +
    + + + {% if user.is_authenticated %} + {% if user.userinfo.user_type == "Student" %} + +
    + +
    + + + + {% else %} + +
    + +
    + + + + {% endif %} + + {% else %} + + + +
    + +
    + + + + {% endif %} +
    + + {% block content %} + + {% endblock content %} + + + \ No newline at end of file diff --git a/movies/templates/1base.html b/movies/templates/1base.html deleted file mode 100644 index a722581..0000000 --- a/movies/templates/1base.html +++ /dev/null @@ -1,49 +0,0 @@ - - - - Add a new Movie. - - - -
    - {% block content %} - - {% endblock content %} -
    - - - - diff --git a/movies/templates/base.html b/movies/templates/base.html index d115c61..2a4c8d3 100644 --- a/movies/templates/base.html +++ b/movies/templates/base.html @@ -1,287 +1,47 @@ -{% load static %} - - - - {% load static %} - - - - Base page - - - - -
    - - - {% if user.is_authenticated %} - {% if user.userinfo.user_type == "Student" %} - -
    - -
    - - - - {% else %} - -
    - -
    - - - - {% endif %} - - {% else %} - - - -
    - -
    - + + + Add a new Movie. + + - - {% endif %} -
    - {% block content %} - - {% endblock content %} - - - \ No newline at end of file + {% endif %} + +
    + {% block content %} + + {% endblock content %} +
    + + diff --git a/movies/templates/baseee.html b/movies/templates/baseee.html new file mode 100644 index 0000000..68c110c --- /dev/null +++ b/movies/templates/baseee.html @@ -0,0 +1,745 @@ + + + + + + + + Landing Page + + + + +
    +
    +
    +

    Share your world

    +

    in 15 mins or less

    +
    +

    A tutorial, a tour, a short movie or anything you want to watch,
    + Varsity Vine is here for you.

    +
    + + +
    +
    +
    +
    + +
    +
    +
    +
    +
    +

    As clear as day

    +

    Watch HD videos in real time. No stress, no delay.

    + +
    + +
    +
    +
    +

    Find videos on anything

    +

    Watch anything. No ads. No hidden charges

    +
    +
    + +
    +
    +
    +
    +

    Watch anywhere,
    anytime

    +

    Whether you're in your home or on the go, + stream VVines video's
    anywhere, anytime.

    +
    + +
    +
    +

    Latest on the Vine

    +
    + +
    +
    +

    Touring the Amazon

    +

    The Flutter Team

    +
    +
    +

    Explore Thankgiving week at Harvard

    +

    The Flutter Team

    +
    +
    +

    Introduction to Calculus - A series

    +

    The Flutter Team

    +
    +
    +

    The scholar Fellowship Program for Africans

    +

    The Flutter Team

    +
    +
    +

    Touring The Amazon

    +

    The Flutter Team

    +
    +
    +

    Explore Thankgiving week at Harvard

    +

    The Flutter Team

    +
    +
    +
    +
    +
    +
    +

    Ready?

    +

    Try it, it's free

    +
    + +
    + + + + \ No newline at end of file diff --git a/movies/templates/done/view_movie.html b/movies/templates/done/view_movie.html new file mode 100644 index 0000000..78ff7bc --- /dev/null +++ b/movies/templates/done/view_movie.html @@ -0,0 +1,86 @@ +{% extends "base.html" %} +{% load static %} + +{% block content %} + +

    {{ movie.title }}

    +
    + +
    + +
    + +
    + +

    Comments

    +{% for comment in comments %} + +{% endfor %} +{% endblock content %} \ No newline at end of file diff --git a/movies/templates/movies/index.html b/movies/templates/movies/index.html index 18f82a2..2bcd571 100644 --- a/movies/templates/movies/index.html +++ b/movies/templates/movies/index.html @@ -1,15 +1,737 @@ -{% extends "base.html" %} + + -{% block content %} + + + {% load static %} + + + Landing Page + + -
    -
    - -
    -
    +
    + {% include 'movies/navbar.html' %} +
    +
    +
    +
    +

    Share your world

    +

    in 15 mins or less

    +
    +

    A tutorial, a tour, a short movie or anything you want to watch,
    + Varsity Vine is here for you.

    +
    + + + + +
    +
    +
    +
    + +
    +
    +
    +
    +
    +

    As clear as day

    +

    Watch HD videos in real time. No stress, no delay.

    + {% if user.is_authenticated %} + + {% else %} + + {% endif %} +
    + +
    +
    +
    +

    Find videos on anything

    +

    Watch anything. No ads. No hidden charges

    +
    +
    + +
    +
    +
    +
    +

    Watch anywhere,
    anytime

    +

    Whether you're in your home or on the go, + stream VVines video's
    anywhere, anytime.

    +
    + +
    +
    +

    Latest on the Vine

    +
    + +
    + {% for movie in movies %} +
    +

    {{ movie.title }}

    +

    {{ movie.desciption }}

    +
    + {% endfor %} +
    +
    +
    +
    +
    +

    Ready?

    +

    Try it, it's free

    +
    + + +
    + -{% endblock content %} \ No newline at end of file + \ No newline at end of file diff --git a/movies/templates/movies/login copy.html b/movies/templates/movies/login copy.html new file mode 100644 index 0000000..862b1be --- /dev/null +++ b/movies/templates/movies/login copy.html @@ -0,0 +1,14 @@ +{% extends "base.html" %} + +{% block content %} + +
    + {% csrf_token %} + {{ form.as_p }} + + + + +
    + +{% endblock content %} \ No newline at end of file diff --git a/movies/templates/movies/login.html b/movies/templates/movies/login.html index 862b1be..44cdace 100644 --- a/movies/templates/movies/login.html +++ b/movies/templates/movies/login.html @@ -1,14 +1,93 @@ -{% extends "base.html" %} + + +{% load static %} + + + + + Sign In + + -{% block content %} + +
    + +
    +
    + +
    + +
    +
    +
    -
    - {% csrf_token %} - {{ form.as_p }} + - +
    +
    + +
    +

    Welcome Back

    +

    Please enter your details.

    +
    + + +
    + + +
    +
    +
    + Forgot Password? +
    +
    + +
    + + +
    +
    +
    +
    + +
    +
    - - +
    + +
    +
    -{% endblock content %} \ No newline at end of file +
    + +
    +
    + +
    + +
    +
    + +
    + +
    +
    + +
    + +
    +
    +
    +
    + + + \ No newline at end of file diff --git a/movies/templates/movies/movies copy.html b/movies/templates/movies/movies copy.html index 332484b..2a2177d 100644 --- a/movies/templates/movies/movies copy.html +++ b/movies/templates/movies/movies copy.html @@ -43,4 +43,176 @@

    +{% endblock content %} + + + + + + + + + + + + + + + + + + +{% extends "base.html" %} +{% load static %} +{% block content %} + +

    Lists of all posts

    + + + + + + +
    + +
    + + {% for movie in page_obj %} +
    +
    + + + + +
    + +
    + {% if movie.author.userinfo.avatar %} +
    + +
    + {% else %} +
    + +
    + {% endif %} + +
    +

    + {{ movie.title }} +

    + +

    + {{movie.author}} +

    + +

    + {{ movie.liked.count }} Likes · Updated : {{ movie.updated }} +

    +
    +
    +
    + + + {% empty %} + +

    + No Movies have been added yet. +

    + +
  • Add Movie
    • + + {% endfor %} +
    + + + + +
    + + {% if page_obj.has_previous %} + « first + previous + {% endif %} + + + Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}. + + + {% if page_obj.has_next %} + next + last » + {% endif %} + +
    + {% endblock content %} \ No newline at end of file diff --git a/movies/templates/movies/movies.html b/movies/templates/movies/movies.html index 6535fe4..0a0f105 100644 --- a/movies/templates/movies/movies.html +++ b/movies/templates/movies/movies.html @@ -1,153 +1,405 @@ -{% extends "base.html" %} -{% load static %} -{% block content %} - -

    Lists of all posts

    - - - - - -
    - -
    - - {% for movie in page_obj %} -
    -
    - - - - -
    - -
    - {% if movie.author.userinfo.avatar %} -
    - -
    - {% else %} -
    - -
    - {% endif %} - -
    -

    - {{ movie.title }} -

    - -

    - {{movie.author}} -

    - -

    - {{ movie.liked.count }} Likes · Updated : {{ movie.updated }} -

    -
    -
    -
    - - - {% empty %} - -

    - No Movies have been added yet. -

    - -
  • Add Movie
    • - - {% endfor %} + } + + + +{% include 'movies/navbar.html' %} + + + + {% load static %} + {% include 'movies/sidebar.html' %} +
    +
    +
    +
    +
    +
    + + + + + + + + + +
    +
    + +
    +
    +
    +
    +
    +
    +
    +
    + {% for movie in page_obj %} +
    + +
    +
    + + +
    +
    +

    {{ movie.title }} +

    +

    + {% if movie.description %} + {{ movie.description }} + {% else %} + No Description has been added! + {% endif %} +

    +
    +

    {{ movie.liked.count }} Likes

    +

    | {{ movie.updated }}

    +
    - +
    +
    +
    -
    - - {% if page_obj.has_previous %} - « first - previous - {% endif %} + {% empty %} - - Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}. - +

    + No Movies have been added yet. +

    - {% if page_obj.has_next %} - next - last » - {% endif %} -     -
    +
  • Add Movie
    • + + {% endfor %} + +
    +
    +
    +
    +
    +
    + + + + -{% endblock content %} \ No newline at end of file + \ No newline at end of file diff --git a/movies/templates/movies/navbar.html b/movies/templates/movies/navbar.html new file mode 100644 index 0000000..fd370f2 --- /dev/null +++ b/movies/templates/movies/navbar.html @@ -0,0 +1,231 @@ + + +{% load static %} + {% if user.is_authenticated %} +
    + +
    + + {% else %} + +
    + +
    + {% endif %} \ No newline at end of file diff --git a/movies/templates/movies/new_movie copy.html b/movies/templates/movies/new_movie copy.html new file mode 100644 index 0000000..3537a81 --- /dev/null +++ b/movies/templates/movies/new_movie copy.html @@ -0,0 +1,77 @@ +{% extends "base.html" %} + +{% block content %} + +
    + {% if msg %} {% autoescape off %} {{ msg }} {% endautoescape %} {% endif %} + + + +
    + + {% csrf_token %} +    +
    + +
    +
    +    +
    + +
    +
    +    +
    + + + + + +

    + +

    +
    +
    + +{% endblock content %} \ No newline at end of file diff --git a/movies/templates/movies/new_movie.html b/movies/templates/movies/new_movie.html index e1e1bd1..4ce41a4 100644 --- a/movies/templates/movies/new_movie.html +++ b/movies/templates/movies/new_movie.html @@ -1,18 +1,118 @@ -{% extends "base.html" %} + + -{% block content %} + + + + + Uploadui + + {% load static %} + + {% include 'movies/sidebar.html' %} + + + + + +
    +
    +
    +
    +
    +
    + + return true; + } + -
    - + {% csrf_token %} -    -
    - -
    -
    -    -
    - -
    -
    -    -
    - - - - - -

    - -

    -
    - - -{% endblock content %} \ No newline at end of file + +

    +

    +

    + + + +

    + + +
    + + + \ No newline at end of file diff --git a/movies/templates/movies/search.html b/movies/templates/movies/search.html index 6085992..2335e7a 100644 --- a/movies/templates/movies/search.html +++ b/movies/templates/movies/search.html @@ -1,25 +1,378 @@ -{% extends "base.html" %} -{% block content %} + -

    Lists of Search Results

    + + + + + + + Search Page + +{% include 'movies/navbar.html' %} + + + + + +{% load static %} +{% include 'movies/sidebar.html' %} +
    +
    +
    +
    +
    +
    + + + + + + + + + +
    +
    + +
    +
    + +
    +
    +
    +
    +
    +
    + {% for movie in movies %} +
    + + + +
    +
    + +
    +
    +

    {{movie.title}}

     + +

    {% if movie.description %} + {{ movie.description }} + {% else %} + No Description has been added! + {% endif %}

    +
    +

    {{ movie.liked.count }} Likes

    +

    | {{ movie.updated }}

    +
    +
    +
    +
    + + {% empty %} + +

    + No Movies matches that query!. +

    +
    + + {% endfor %} +
    +
    +
    +
    + +
    +
    + + + \ No newline at end of file diff --git a/movies/templates/movies/sidebar.html b/movies/templates/movies/sidebar.html new file mode 100644 index 0000000..e62865e --- /dev/null +++ b/movies/templates/movies/sidebar.html @@ -0,0 +1,89 @@ + + +{% load static %} + +
    + +
    \ No newline at end of file diff --git a/movies/templates/movies/view_movie.html b/movies/templates/movies/view_movie.html index 78ff7bc..7989333 100644 --- a/movies/templates/movies/view_movie.html +++ b/movies/templates/movies/view_movie.html @@ -1,86 +1,252 @@ -{% extends "base.html" %} -{% load static %} + + -{% block content %} + + + {% load static %} + + + Watch page + + -

    {{ movie.title }}

    -
    - -
    + + -
    - -
    +
    + + {% if request.user.userinfo.avatar %} + Your avatar + {% else %} + My image + {% endif %} + +
    + {% csrf_token %} + + +
    + +
    +
    +
    -

    Comments

    -{% for comment in comments %} - -{% endfor %} -{% endblock content %} \ No newline at end of file +
    +

    + {{ comment.comment_author }} + {{comment.date_added}} +

    +

    {{comment.comment_text}}

    +
    + {% if request.user == comment.comment_author %} + + EDIT + + {% endif %} + +
    + + 0 + + 0 + +
    +
    +
    + + {% endfor %} + + + +
    +

    Selected just for you

    + +
    + +
    +
    + +
    +
    + Why Business sucks by a business student +

    Your Business Girl

    +

    100k Views | 5 months ago

    +
    +
    +
    + +
    +
    + +

    Sneak Peaks

    +
    +
    + + + +
    +
    + +
    + +
    +
    + +
    +
    + Teaching the art of optical tricks professionally +

    Your Business Guy

    +

    100k Views | 5 months ago

    +
    +
    + +
    +
    + +
    +
    + +
    +
    + 10 DIY ways to make crafty photo Frames!!! +

    Your Business Guy

    +

    100k Views | 5 months ago

    +
    +
    + +
    +

    from your last watch

    +
    + +
    +
    + + + + + + + + \ No newline at end of file diff --git a/movies/templates/movies/viewcommentprofile copy.html b/movies/templates/movies/viewcommentprofile copy.html new file mode 100644 index 0000000..b5d61f9 --- /dev/null +++ b/movies/templates/movies/viewcommentprofile copy.html @@ -0,0 +1,46 @@ +{% extends "base.html" %} + +{% block page_header %} +

    Log in to your account.

    +{% endblock page_header %} + +{% block content %} + +

    + User Details +

    +

    + {{ user.username }} +
    + {{ user.userinfo.user_type }} + +

    + +

    Lists of all User's Videos

    + + {% for movie in movies %} + + + + + + {% empty %} + +

    + No movie Yet! +

    + {% endfor %} + +{% endblock content %} + + + + + + + + + + diff --git a/movies/templates/movies/viewcommentprofile.html b/movies/templates/movies/viewcommentprofile.html index b5d61f9..1d16b38 100644 --- a/movies/templates/movies/viewcommentprofile.html +++ b/movies/templates/movies/viewcommentprofile.html @@ -1,46 +1,436 @@ -{% extends "base.html" %} + + -{% block page_header %} -

    Log in to your account.

    -{% endblock page_header %} + + + + + Creator Profile + -{% block content %} + + + + + + {% load static %} +
    + {% include 'movies/navbar.html' %} +
    + {% include 'movies/sidebar.html' %} +
    + + {% if user.userinfo.avatar %} +
    + {% else %} + + {% endif %} + +
    {{ user.first_name }} {{user.last_name}}
    0 subscribers.
    +
    Subscribe
    +
    + +
    +
    +
    +
    +
    +
    + +
    +
    + +
    + +
    +

    Latest Video

    +
    +
    +

    + "A High school Story"-
    Teen Comedy

    +
    As the new school year begins at faith high.the football team is ready to win and the cheerleaders are + ready to jump. +
    + +
    +
    +

    +
    +
    +

    User Guide Video

    +

    Advert Video
    50k Likes|5 months ago

    +
    + + {% for movie in movies %} +

    + + + +

    {{movie.title }}
    + + {% if movie.liked.count == 1 %} + 1 Like + {% else %} + + {{ movie.liked.count }} Likes + + {% endif %} + |{{movie.updated}} +

    +
    + {% endfor %} + +
    + + + + \ No newline at end of file diff --git a/movies/templates/movies/viewprofile copy 2.html b/movies/templates/movies/viewprofile copy 2.html new file mode 100644 index 0000000..92857a6 --- /dev/null +++ b/movies/templates/movies/viewprofile copy 2.html @@ -0,0 +1,437 @@ + + + + + + + + Creator Profile + + + + + + + + {% load static %} +
    + {% include 'movies/navbar.html' %} +
    + {% include 'movies/sidebar.html' %} +
    + + {% if request.user.userinfo.avatar %} +
    + {% else %} + + {% endif %} + +
    {{ user.first_name }} {{user.last_name}}
    0 subscribers.
    +
    Subscribe
    +
    + +
    +
    +
    +
    +
    +
    + +
    +
    + +
    + +
    +

    Latest Video

    +
    +
    +

    + "A High school Story"-
    Teen Comedy

    +
    As the new school year begins at faith high.the football team is ready to win and the cheerleaders are + ready to jump. +
    +
    +
    +

    +
    +
    +

    My Videos

    +
    +

    Advert Video
    50k Likes | Aug. 11, 2022

    +
    + + {% for movie in movies %} +

    + + + +

    {{movie.title }}
    + + {% if movie.liked.count == 1 %} + 1 Like + {% else %} + + {{ movie.liked.count }} Likes + + {% endif %} + | {{ movie.updated }}

    +
    + {% endfor %} + +
    + + + + \ No newline at end of file diff --git a/movies/templates/movies/viewprofile copy.html b/movies/templates/movies/viewprofile copy.html new file mode 100644 index 0000000..fca8121 --- /dev/null +++ b/movies/templates/movies/viewprofile copy.html @@ -0,0 +1,45 @@ +{% extends "base.html" %} + +{% block page_header %} +

    Log in to your account.

    +{% endblock page_header %} + +{% block content %} +

    + User Details +

    +

    + {{ user.username }} +
    + {{ user.userinfo.user_type }} + +

    + +

    Lists of all User's Videos

    + + {% for movie in movies %} + + + + + + {% empty %} + +

    + No movie Yet! +

    + {% endfor %} + +{% endblock content %} + + + + + + + + + + diff --git a/movies/templates/movies/viewprofile.html b/movies/templates/movies/viewprofile.html index 5ed9f9c..fc397bf 100644 --- a/movies/templates/movies/viewprofile.html +++ b/movies/templates/movies/viewprofile.html @@ -1,47 +1,437 @@ -{% extends "base.html" %} + + -{% block page_header %} -

    Log in to your account.

    -{% endblock page_header %} + + + + + Creator Profile + -{% block content %} + + + + + + {% load static %} +
    + {% include 'movies/navbar.html' %} +
    + {% include 'movies/sidebar.html' %} +
    + + {% if user.userinfo.avatar %} +
    + {% else %} + + {% endif %} + +
    {{ user.first_name }} {{user.last_name}}
    0 subscribers.
    +
    Subscribe
    +
    + +
    +
    +
    +
    +
    +
    + +
    +
    + +
    + +
    +

    Latest Video

    +
    +
    +

    + "A High school Story"-
    Teen Comedy

    +
    As the new school year begins at faith high.the football team is ready to win and the cheerleaders are + ready to jump. +
    + +
    +
    +

    +
    +
    +

    User Guide Video

    +

    Advert Video
    50k Likes|5 months ago

    +
    + + {% for movie in movies %} +

    + + + +

    {{movie.title }}
    + + {% if movie.liked.count == 1 %} + 1 Like + {% else %} + + {{ movie.liked.count }} Likes + + {% endif %} + |{{movie.updated}}

    +
    + {% endfor %} + +
    + + + + \ No newline at end of file diff --git a/movies/urls.py b/movies/urls.py index 38c471e..0ca4cb9 100644 --- a/movies/urls.py +++ b/movies/urls.py @@ -38,7 +38,7 @@ path('view-profile//', views.view_profile, name='view_profile'), - path('viewcommentprofile//', views.view_comment_profile, name='view_commenter'), + path('viewcommentprofile//', views.view_comment_profile, name='view_comment_profile'), path('like//', views.like_movie, name='like_movie'), @@ -46,8 +46,4 @@ path('edit_comment//', views.edit_comment, name='edit_comment'), - #path('accounts/', include('django.contrib.auth.urls')), - - # path("accounts/register/", views.register, name="register"), - ] \ No newline at end of file diff --git a/movies/views.py b/movies/views.py index 91d2d22..a2e0314 100644 --- a/movies/views.py +++ b/movies/views.py @@ -17,7 +17,11 @@ def check_comment_owner(author, user): def index(request): """Returns to the Homepage""" - return render(request, "movies/index.html") + movies = Movie.objects.all().order_by("-created") + + context = {'movies': movies} + + return render(request, "movies/index.html", context) @login_required @student_only @@ -82,11 +86,10 @@ def new_comment(request, movie_id): new_comment.movie = movie new_comment.comment_author = request.user new_comment.save() - return redirect("movies:view_movie", movie_id=movie_id) + return redirect("movies:view_movie", movie_id=movie.id) context = {"form" : form, "movie" : movie} - return render(request, "movies/new_comment.html", context) - + return render(request, "movies/view_movie.html", context) @login_required def edit_comment(request, comment_id): @@ -183,7 +186,7 @@ def view_profile(request, movie_id): return render(request, 'movies/viewprofile.html', context) @login_required -def view_comment_profile(request,comment_id): +def view_comment_profile(request, comment_id): comment = MovieComment.objects.get(id=comment_id) user = comment.comment_author @@ -194,4 +197,4 @@ def view_comment_profile(request,comment_id): context = {'favourites' : favourites, 'movies' : movies, 'user' : user} - return render(request, 'movies/viewprofile.html', context) \ No newline at end of file + return render(request, 'movies/viewcommentprofile.html', context) \ No newline at end of file diff --git a/static/assets/Account page/Ellipse 9.svg b/static/assets/Account page/Ellipse 9.svg new file mode 100644 index 0000000..084a6f9 --- /dev/null +++ b/static/assets/Account page/Ellipse 9.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + + diff --git a/static/assets/Arrow 1.svg b/static/assets/Arrow 1.svg new file mode 100644 index 0000000..b795a76 --- /dev/null +++ b/static/assets/Arrow 1.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/Content area.png b/static/assets/Content area.png new file mode 100644 index 0000000..ec68720 Binary files /dev/null and b/static/assets/Content area.png differ diff --git a/static/assets/Ellipse 1.png b/static/assets/Ellipse 1.png new file mode 100644 index 0000000..b17d0ef Binary files /dev/null and b/static/assets/Ellipse 1.png differ diff --git a/static/assets/Ellipse 5 (1).png b/static/assets/Ellipse 5 (1).png new file mode 100644 index 0000000..421e616 Binary files /dev/null and b/static/assets/Ellipse 5 (1).png differ diff --git a/static/assets/Ellipse 5 (2).png b/static/assets/Ellipse 5 (2).png new file mode 100644 index 0000000..96da521 Binary files /dev/null and b/static/assets/Ellipse 5 (2).png differ diff --git a/static/assets/Ellipse 5.png b/static/assets/Ellipse 5.png new file mode 100644 index 0000000..ca6e458 Binary files /dev/null and b/static/assets/Ellipse 5.png differ diff --git a/static/assets/Frame 61 (1) (1).png b/static/assets/Frame 61 (1) (1).png new file mode 100644 index 0000000..fb3cf98 Binary files /dev/null and b/static/assets/Frame 61 (1) (1).png differ diff --git a/static/assets/Frame 61 (1).png b/static/assets/Frame 61 (1).png new file mode 100644 index 0000000..c5ae6f0 Binary files /dev/null and b/static/assets/Frame 61 (1).png differ diff --git a/static/assets/Frame 61 (2) (1).png b/static/assets/Frame 61 (2) (1).png new file mode 100644 index 0000000..801d8df Binary files /dev/null and b/static/assets/Frame 61 (2) (1).png differ diff --git a/static/assets/Heart image.png b/static/assets/Heart image.png new file mode 100644 index 0000000..eef1001 Binary files /dev/null and b/static/assets/Heart image.png differ diff --git a/static/assets/Home2.svg b/static/assets/Home2.svg new file mode 100644 index 0000000..b462362 --- /dev/null +++ b/static/assets/Home2.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/static/assets/Microphone icon.svg b/static/assets/Microphone icon.svg new file mode 100644 index 0000000..336b3ae --- /dev/null +++ b/static/assets/Microphone icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/Settings.svg b/static/assets/Settings.svg new file mode 100644 index 0000000..9c87d08 --- /dev/null +++ b/static/assets/Settings.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/User-profile.png b/static/assets/User-profile.png new file mode 100644 index 0000000..fc3325d Binary files /dev/null and b/static/assets/User-profile.png differ diff --git a/static/assets/Vector.svg b/static/assets/Vector.svg new file mode 100644 index 0000000..cbe9cab --- /dev/null +++ b/static/assets/Vector.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/Watch page/Back-forward.png b/static/assets/Watch page/Back-forward.png new file mode 100644 index 0000000..c6993e6 Binary files /dev/null and b/static/assets/Watch page/Back-forward.png differ diff --git a/static/assets/Watch page/Ellipse 5-1.png b/static/assets/Watch page/Ellipse 5-1.png new file mode 100644 index 0000000..acbc971 Binary files /dev/null and b/static/assets/Watch page/Ellipse 5-1.png differ diff --git a/static/assets/Watch page/Ellipse 5-2.png b/static/assets/Watch page/Ellipse 5-2.png new file mode 100644 index 0000000..3e43a47 Binary files /dev/null and b/static/assets/Watch page/Ellipse 5-2.png differ diff --git a/static/assets/Watch page/Ellipse 5.png b/static/assets/Watch page/Ellipse 5.png new file mode 100644 index 0000000..ea54901 Binary files /dev/null and b/static/assets/Watch page/Ellipse 5.png differ diff --git a/static/assets/Watch page/Ellipse 8-1.png b/static/assets/Watch page/Ellipse 8-1.png new file mode 100644 index 0000000..837e648 Binary files /dev/null and b/static/assets/Watch page/Ellipse 8-1.png differ diff --git a/static/assets/Watch page/Ellipse 8-2.png b/static/assets/Watch page/Ellipse 8-2.png new file mode 100644 index 0000000..6f4e7ce Binary files /dev/null and b/static/assets/Watch page/Ellipse 8-2.png differ diff --git a/static/assets/Watch page/Ellipse 8.png b/static/assets/Watch page/Ellipse 8.png new file mode 100644 index 0000000..019fce8 Binary files /dev/null and b/static/assets/Watch page/Ellipse 8.png differ diff --git a/static/assets/Watch page/Ellipse 9.png b/static/assets/Watch page/Ellipse 9.png new file mode 100644 index 0000000..dbabd86 Binary files /dev/null and b/static/assets/Watch page/Ellipse 9.png differ diff --git a/static/assets/Watch page/Frame 61-1.png b/static/assets/Watch page/Frame 61-1.png new file mode 100644 index 0000000..2330f1b Binary files /dev/null and b/static/assets/Watch page/Frame 61-1.png differ diff --git a/static/assets/Watch page/Frame 61-2.png b/static/assets/Watch page/Frame 61-2.png new file mode 100644 index 0000000..dcec431 Binary files /dev/null and b/static/assets/Watch page/Frame 61-2.png differ diff --git a/static/assets/Watch page/Frame 61-3.png b/static/assets/Watch page/Frame 61-3.png new file mode 100644 index 0000000..4c3800a Binary files /dev/null and b/static/assets/Watch page/Frame 61-3.png differ diff --git a/static/assets/Watch page/Frame 61.png b/static/assets/Watch page/Frame 61.png new file mode 100644 index 0000000..4141a8a Binary files /dev/null and b/static/assets/Watch page/Frame 61.png differ diff --git a/static/assets/Watch page/Rectangle 114.png b/static/assets/Watch page/Rectangle 114.png new file mode 100644 index 0000000..4669f4a Binary files /dev/null and b/static/assets/Watch page/Rectangle 114.png differ diff --git a/static/assets/Watch page/Rectangle 115.png b/static/assets/Watch page/Rectangle 115.png new file mode 100644 index 0000000..3f23ffc Binary files /dev/null and b/static/assets/Watch page/Rectangle 115.png differ diff --git a/static/assets/Watch page/Rectangle 116.png b/static/assets/Watch page/Rectangle 116.png new file mode 100644 index 0000000..f618d0c Binary files /dev/null and b/static/assets/Watch page/Rectangle 116.png differ diff --git a/static/assets/Watch page/Video.png b/static/assets/Watch page/Video.png new file mode 100644 index 0000000..997ce40 Binary files /dev/null and b/static/assets/Watch page/Video.png differ diff --git a/static/assets/Watch page/fast-forward.png b/static/assets/Watch page/fast-forward.png new file mode 100644 index 0000000..e988344 Binary files /dev/null and b/static/assets/Watch page/fast-forward.png differ diff --git a/static/assets/Watch page/filter-3-line.png b/static/assets/Watch page/filter-3-line.png new file mode 100644 index 0000000..7489183 Binary files /dev/null and b/static/assets/Watch page/filter-3-line.png differ diff --git a/static/assets/Watch page/heart-add-line.png b/static/assets/Watch page/heart-add-line.png new file mode 100644 index 0000000..e1f852b Binary files /dev/null and b/static/assets/Watch page/heart-add-line.png differ diff --git a/static/assets/Watch page/hq-line.png b/static/assets/Watch page/hq-line.png new file mode 100644 index 0000000..3453511 Binary files /dev/null and b/static/assets/Watch page/hq-line.png differ diff --git a/static/assets/Watch page/maximize-2.png b/static/assets/Watch page/maximize-2.png new file mode 100644 index 0000000..8fde173 Binary files /dev/null and b/static/assets/Watch page/maximize-2.png differ diff --git a/static/assets/Watch page/play.png b/static/assets/Watch page/play.png new file mode 100644 index 0000000..a9e2d4f Binary files /dev/null and b/static/assets/Watch page/play.png differ diff --git a/static/assets/Watch page/reply-line.png b/static/assets/Watch page/reply-line.png new file mode 100644 index 0000000..29843f9 Binary files /dev/null and b/static/assets/Watch page/reply-line.png differ diff --git a/static/assets/Watch page/ri-add-fill.png b/static/assets/Watch page/ri-add-fill.png new file mode 100644 index 0000000..18952f5 Binary files /dev/null and b/static/assets/Watch page/ri-add-fill.png differ diff --git a/static/assets/Watch page/settings.png b/static/assets/Watch page/settings.png new file mode 100644 index 0000000..66d980b Binary files /dev/null and b/static/assets/Watch page/settings.png differ diff --git a/static/assets/Watch page/share-line.png b/static/assets/Watch page/share-line.png new file mode 100644 index 0000000..e8c5c96 Binary files /dev/null and b/static/assets/Watch page/share-line.png differ diff --git a/static/assets/Watch page/sneak peak.svg b/static/assets/Watch page/sneak peak.svg new file mode 100644 index 0000000..1232757 --- /dev/null +++ b/static/assets/Watch page/sneak peak.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/Watch page/thumb-down-line.png b/static/assets/Watch page/thumb-down-line.png new file mode 100644 index 0000000..79b4ce0 Binary files /dev/null and b/static/assets/Watch page/thumb-down-line.png differ diff --git a/static/assets/Watch page/thumb-up-line.png b/static/assets/Watch page/thumb-up-line.png new file mode 100644 index 0000000..22c7e42 Binary files /dev/null and b/static/assets/Watch page/thumb-up-line.png differ diff --git a/static/assets/Watch page/volume-up-fill.png b/static/assets/Watch page/volume-up-fill.png new file mode 100644 index 0000000..9993f59 Binary files /dev/null and b/static/assets/Watch page/volume-up-fill.png differ diff --git a/static/assets/account.svg b/static/assets/account.svg new file mode 100644 index 0000000..0ec4074 --- /dev/null +++ b/static/assets/account.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/advanced.svg b/static/assets/advanced.svg new file mode 100644 index 0000000..c960092 --- /dev/null +++ b/static/assets/advanced.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/advancedsettings.svg b/static/assets/advancedsettings.svg new file mode 100644 index 0000000..0598a19 --- /dev/null +++ b/static/assets/advancedsettings.svg @@ -0,0 +1,4 @@ + + + + diff --git a/static/assets/advertisericon.svg b/static/assets/advertisericon.svg new file mode 100644 index 0000000..38a4ced --- /dev/null +++ b/static/assets/advertisericon.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/arrow.svg b/static/assets/arrow.svg new file mode 100644 index 0000000..69901dc --- /dev/null +++ b/static/assets/arrow.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/backarrowicon.svg b/static/assets/backarrowicon.svg new file mode 100644 index 0000000..5a6e429 --- /dev/null +++ b/static/assets/backarrowicon.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/static/assets/bell.svg b/static/assets/bell.svg new file mode 100644 index 0000000..312a3aa --- /dev/null +++ b/static/assets/bell.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/card1.png b/static/assets/card1.png new file mode 100644 index 0000000..aa4e73e Binary files /dev/null and b/static/assets/card1.png differ diff --git a/static/assets/card2.png b/static/assets/card2.png new file mode 100644 index 0000000..6c6886e Binary files /dev/null and b/static/assets/card2.png differ diff --git a/static/assets/card3.png b/static/assets/card3.png new file mode 100644 index 0000000..238d8c7 Binary files /dev/null and b/static/assets/card3.png differ diff --git a/static/assets/card4.png b/static/assets/card4.png new file mode 100644 index 0000000..051629f Binary files /dev/null and b/static/assets/card4.png differ diff --git a/static/assets/creatoricon.svg b/static/assets/creatoricon.svg new file mode 100644 index 0000000..89038e2 --- /dev/null +++ b/static/assets/creatoricon.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/delete.svg b/static/assets/delete.svg new file mode 100644 index 0000000..ab70591 --- /dev/null +++ b/static/assets/delete.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/dislike.png b/static/assets/dislike.png new file mode 100644 index 0000000..cd3e846 Binary files /dev/null and b/static/assets/dislike.png differ diff --git a/static/assets/download.svg b/static/assets/download.svg new file mode 100644 index 0000000..b9db99f --- /dev/null +++ b/static/assets/download.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/dropdownarrowdown.svg b/static/assets/dropdownarrowdown.svg new file mode 100644 index 0000000..c0a064f --- /dev/null +++ b/static/assets/dropdownarrowdown.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/dropdownarrowright.svg b/static/assets/dropdownarrowright.svg new file mode 100644 index 0000000..573f944 --- /dev/null +++ b/static/assets/dropdownarrowright.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/face.png b/static/assets/face.png new file mode 100644 index 0000000..9e04b9e Binary files /dev/null and b/static/assets/face.png differ diff --git a/static/assets/forwardarrow.svg b/static/assets/forwardarrow.svg new file mode 100644 index 0000000..cab6624 --- /dev/null +++ b/static/assets/forwardarrow.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/forwardarrowicon.svg b/static/assets/forwardarrowicon.svg new file mode 100644 index 0000000..732a827 --- /dev/null +++ b/static/assets/forwardarrowicon.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/static/assets/fpdesktop.svg b/static/assets/fpdesktop.svg new file mode 100644 index 0000000..c57a9f2 --- /dev/null +++ b/static/assets/fpdesktop.svg @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/assets/fpmobile.svg b/static/assets/fpmobile.svg new file mode 100644 index 0000000..b20d5c9 --- /dev/null +++ b/static/assets/fpmobile.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/static/assets/free.png b/static/assets/free.png new file mode 100644 index 0000000..a0c2d31 Binary files /dev/null and b/static/assets/free.png differ diff --git a/static/assets/hamburger.svg b/static/assets/hamburger.svg new file mode 100644 index 0000000..378850a --- /dev/null +++ b/static/assets/hamburger.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/header-navbar/nav bar/Ellipse 7.png b/static/assets/header-navbar/nav bar/Ellipse 7.png new file mode 100644 index 0000000..8df1940 Binary files /dev/null and b/static/assets/header-navbar/nav bar/Ellipse 7.png differ diff --git a/static/assets/header-navbar/nav bar/Frame 87.png b/static/assets/header-navbar/nav bar/Frame 87.png new file mode 100644 index 0000000..0fc65ef Binary files /dev/null and b/static/assets/header-navbar/nav bar/Frame 87.png differ diff --git a/static/assets/header-navbar/nav bar/Frame 89.png b/static/assets/header-navbar/nav bar/Frame 89.png new file mode 100644 index 0000000..7a05d05 Binary files /dev/null and b/static/assets/header-navbar/nav bar/Frame 89.png differ diff --git a/static/assets/header-navbar/nav bar/Icon.png b/static/assets/header-navbar/nav bar/Icon.png new file mode 100644 index 0000000..c289048 Binary files /dev/null and b/static/assets/header-navbar/nav bar/Icon.png differ diff --git a/static/assets/header-navbar/nav bar/mic-line.png b/static/assets/header-navbar/nav bar/mic-line.png new file mode 100644 index 0000000..af66c85 Binary files /dev/null and b/static/assets/header-navbar/nav bar/mic-line.png differ diff --git a/static/assets/header-navbar/nav bar/notification-3-line.png b/static/assets/header-navbar/nav bar/notification-3-line.png new file mode 100644 index 0000000..6d208de Binary files /dev/null and b/static/assets/header-navbar/nav bar/notification-3-line.png differ diff --git a/static/assets/header-navbar/nav bar/video-add-line.png b/static/assets/header-navbar/nav bar/video-add-line.png new file mode 100644 index 0000000..97ccb8c Binary files /dev/null and b/static/assets/header-navbar/nav bar/video-add-line.png differ diff --git a/static/assets/help.svg b/static/assets/help.svg new file mode 100644 index 0000000..c06c1c6 --- /dev/null +++ b/static/assets/help.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/heroimg.png b/static/assets/heroimg.png new file mode 100644 index 0000000..e600912 Binary files /dev/null and b/static/assets/heroimg.png differ diff --git a/static/assets/heroleft.png b/static/assets/heroleft.png new file mode 100644 index 0000000..2bc7cdf Binary files /dev/null and b/static/assets/heroleft.png differ diff --git a/static/assets/heroright.png b/static/assets/heroright.png new file mode 100644 index 0000000..63dbbad Binary files /dev/null and b/static/assets/heroright.png differ diff --git a/static/assets/herovideocard.png b/static/assets/herovideocard.png new file mode 100644 index 0000000..53cd2e0 Binary files /dev/null and b/static/assets/herovideocard.png differ diff --git a/static/assets/hom-icon.svg b/static/assets/hom-icon.svg new file mode 100644 index 0000000..a55955c --- /dev/null +++ b/static/assets/hom-icon.svg @@ -0,0 +1,4 @@ + + + + diff --git a/static/assets/home-icon.svg b/static/assets/home-icon.svg new file mode 100644 index 0000000..3dfef22 --- /dev/null +++ b/static/assets/home-icon.svg @@ -0,0 +1,4 @@ + + + + diff --git a/static/assets/home.svg b/static/assets/home.svg new file mode 100644 index 0000000..86da556 --- /dev/null +++ b/static/assets/home.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/home3.svg b/static/assets/home3.svg new file mode 100644 index 0000000..e2a5609 --- /dev/null +++ b/static/assets/home3.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/imagecard.png b/static/assets/imagecard.png new file mode 100644 index 0000000..507c445 Binary files /dev/null and b/static/assets/imagecard.png differ diff --git a/static/assets/images/Account page/Ellipse 9.svg b/static/assets/images/Account page/Ellipse 9.svg new file mode 100644 index 0000000..084a6f9 --- /dev/null +++ b/static/assets/images/Account page/Ellipse 9.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + + diff --git a/static/assets/images/img..png b/static/assets/images/img..png new file mode 100644 index 0000000..f96cbc2 Binary files /dev/null and b/static/assets/images/img..png differ diff --git a/static/assets/images/img2.png b/static/assets/images/img2.png new file mode 100644 index 0000000..4d00abe Binary files /dev/null and b/static/assets/images/img2.png differ diff --git a/static/assets/images/img3.png b/static/assets/images/img3.png new file mode 100644 index 0000000..7eaa12b Binary files /dev/null and b/static/assets/images/img3.png differ diff --git a/static/assets/images/img4png.png b/static/assets/images/img4png.png new file mode 100644 index 0000000..c9b77d9 Binary files /dev/null and b/static/assets/images/img4png.png differ diff --git a/static/assets/images/img5.png b/static/assets/images/img5.png new file mode 100644 index 0000000..d16418a Binary files /dev/null and b/static/assets/images/img5.png differ diff --git a/static/assets/images/img6png.png b/static/assets/images/img6png.png new file mode 100644 index 0000000..9937c3d Binary files /dev/null and b/static/assets/images/img6png.png differ diff --git a/static/assets/images/profile.png b/static/assets/images/profile.png new file mode 100644 index 0000000..fee658a Binary files /dev/null and b/static/assets/images/profile.png differ diff --git a/static/assets/img..png b/static/assets/img..png new file mode 100644 index 0000000..f96cbc2 Binary files /dev/null and b/static/assets/img..png differ diff --git a/static/assets/img2.png b/static/assets/img2.png new file mode 100644 index 0000000..4d00abe Binary files /dev/null and b/static/assets/img2.png differ diff --git a/static/assets/img3.png b/static/assets/img3.png new file mode 100644 index 0000000..7eaa12b Binary files /dev/null and b/static/assets/img3.png differ diff --git a/static/assets/img4png.png b/static/assets/img4png.png new file mode 100644 index 0000000..c9b77d9 Binary files /dev/null and b/static/assets/img4png.png differ diff --git a/static/assets/img5.png b/static/assets/img5.png new file mode 100644 index 0000000..d16418a Binary files /dev/null and b/static/assets/img5.png differ diff --git a/static/assets/img6png.png b/static/assets/img6png.png new file mode 100644 index 0000000..9937c3d Binary files /dev/null and b/static/assets/img6png.png differ diff --git a/static/assets/library.svg b/static/assets/library.svg new file mode 100644 index 0000000..4aa479d --- /dev/null +++ b/static/assets/library.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/like.png b/static/assets/like.png new file mode 100644 index 0000000..838f0e5 Binary files /dev/null and b/static/assets/like.png differ diff --git a/static/assets/logo.svg b/static/assets/logo.svg new file mode 100644 index 0000000..a2fd1fe --- /dev/null +++ b/static/assets/logo.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/static/assets/main.png b/static/assets/main.png new file mode 100644 index 0000000..0d34061 Binary files /dev/null and b/static/assets/main.png differ diff --git a/static/assets/menu.svg b/static/assets/menu.svg new file mode 100644 index 0000000..a8fe45c --- /dev/null +++ b/static/assets/menu.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/mic.svg b/static/assets/mic.svg new file mode 100644 index 0000000..3f011d1 --- /dev/null +++ b/static/assets/mic.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/myvideo.svg b/static/assets/myvideo.svg new file mode 100644 index 0000000..46026d0 --- /dev/null +++ b/static/assets/myvideo.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/notification.svg b/static/assets/notification.svg new file mode 100644 index 0000000..61ef7b2 --- /dev/null +++ b/static/assets/notification.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/phone.png b/static/assets/phone.png new file mode 100644 index 0000000..4992d4d Binary files /dev/null and b/static/assets/phone.png differ diff --git a/static/assets/pic2.png b/static/assets/pic2.png new file mode 100644 index 0000000..b7e98f7 Binary files /dev/null and b/static/assets/pic2.png differ diff --git a/static/assets/pic3.png b/static/assets/pic3.png new file mode 100644 index 0000000..cb891eb Binary files /dev/null and b/static/assets/pic3.png differ diff --git a/static/assets/pic4.png b/static/assets/pic4.png new file mode 100644 index 0000000..2bc1ec8 Binary files /dev/null and b/static/assets/pic4.png differ diff --git a/static/assets/pic5.png b/static/assets/pic5.png new file mode 100644 index 0000000..a6f629d Binary files /dev/null and b/static/assets/pic5.png differ diff --git a/static/assets/pics.png b/static/assets/pics.png new file mode 100644 index 0000000..fc3325d Binary files /dev/null and b/static/assets/pics.png differ diff --git a/static/assets/pics6.png b/static/assets/pics6.png new file mode 100644 index 0000000..614e503 Binary files /dev/null and b/static/assets/pics6.png differ diff --git a/static/assets/pics7.png b/static/assets/pics7.png new file mode 100644 index 0000000..9d96fcf Binary files /dev/null and b/static/assets/pics7.png differ diff --git a/static/assets/playlist.svg b/static/assets/playlist.svg new file mode 100644 index 0000000..f26f37e --- /dev/null +++ b/static/assets/playlist.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/privacy.svg b/static/assets/privacy.svg new file mode 100644 index 0000000..3f7d97a --- /dev/null +++ b/static/assets/privacy.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/profile (2).png b/static/assets/profile (2).png new file mode 100644 index 0000000..fee658a Binary files /dev/null and b/static/assets/profile (2).png differ diff --git a/static/assets/profile.png b/static/assets/profile.png new file mode 100644 index 0000000..bf82252 Binary files /dev/null and b/static/assets/profile.png differ diff --git a/static/assets/profile1.png b/static/assets/profile1.png new file mode 100644 index 0000000..31c082f Binary files /dev/null and b/static/assets/profile1.png differ diff --git a/static/assets/questionicon.svg b/static/assets/questionicon.svg new file mode 100644 index 0000000..cc625d6 --- /dev/null +++ b/static/assets/questionicon.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/rod.png b/static/assets/rod.png new file mode 100644 index 0000000..45ee572 Binary files /dev/null and b/static/assets/rod.png differ diff --git a/static/assets/save (1).png b/static/assets/save (1).png new file mode 100644 index 0000000..eecb707 Binary files /dev/null and b/static/assets/save (1).png differ diff --git a/static/assets/save (3).png b/static/assets/save (3).png new file mode 100644 index 0000000..53260c3 Binary files /dev/null and b/static/assets/save (3).png differ diff --git a/static/assets/search.svg b/static/assets/search.svg new file mode 100644 index 0000000..379aefc --- /dev/null +++ b/static/assets/search.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/security.svg b/static/assets/security.svg new file mode 100644 index 0000000..8d091f5 --- /dev/null +++ b/static/assets/security.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/security2.svg b/static/assets/security2.svg new file mode 100644 index 0000000..57568bd --- /dev/null +++ b/static/assets/security2.svg @@ -0,0 +1,4 @@ + + + + diff --git a/static/assets/share.png b/static/assets/share.png new file mode 100644 index 0000000..36346a0 Binary files /dev/null and b/static/assets/share.png differ diff --git a/static/assets/sign-up-bkg.svg b/static/assets/sign-up-bkg.svg new file mode 100644 index 0000000..ba93af3 --- /dev/null +++ b/static/assets/sign-up-bkg.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/static/assets/text.png b/static/assets/text.png new file mode 100644 index 0000000..23bae92 Binary files /dev/null and b/static/assets/text.png differ diff --git a/static/assets/uploadvideo.svg b/static/assets/uploadvideo.svg new file mode 100644 index 0000000..d992101 --- /dev/null +++ b/static/assets/uploadvideo.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/assets/varsity vines.svg b/static/assets/varsity vines.svg new file mode 100644 index 0000000..9ecd1a5 --- /dev/null +++ b/static/assets/varsity vines.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/static/assets/varsity.PNG b/static/assets/varsity.PNG new file mode 100644 index 0000000..8d8c83e Binary files /dev/null and b/static/assets/varsity.PNG differ diff --git a/static/assets/varsity_vines_grey.svg b/static/assets/varsity_vines_grey.svg new file mode 100644 index 0000000..061f00a --- /dev/null +++ b/static/assets/varsity_vines_grey.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/static/assets/video placeholder.jpeg b/static/assets/video placeholder.jpeg new file mode 100644 index 0000000..80350cf Binary files /dev/null and b/static/assets/video placeholder.jpeg differ diff --git a/static/assets/video.png b/static/assets/video.png new file mode 100644 index 0000000..cc99d8e Binary files /dev/null and b/static/assets/video.png differ diff --git a/static/assets/video.svg b/static/assets/video.svg new file mode 100644 index 0000000..d992101 --- /dev/null +++ b/static/assets/video.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/css/about.css b/static/css/about.css new file mode 100644 index 0000000..16dcab4 --- /dev/null +++ b/static/css/about.css @@ -0,0 +1,293 @@ +* { + margin: 0; + padding: 0; + list-style: none; + text-decoration: none; + font-family:'Inter', sans-serif; + /* outline: 1px solid salmon; */ + box-sizing: border-box; +} +:root { + --bkg: #00A9A5; + --bkg2: #F5F5F5; + --txt: #ffffff; + --txt2: #424242; + --font1: 'Inter', sans-serif; +} +body { + width: 100%; + /* background-color: rgb(180, 171, 189); */ + display: flex; + flex-direction: column; +} +.topnav { + position: relative; + z-index: 1; + color: #ffffff; + padding: 0 40px; + height: 72px; + display: flex; + align-items: center; + justify-content: space-between; + box-shadow: 0px 0px 42px rgba(0, 27, 29, 0.08); +} +.topnav a { + text-decoration: none; +} +.leftnav { + display: flex; + gap: 25px; +} +.leftnav .one{ + width:120px; + display: flex; + gap: 25px; +} +.leftnav .two{ + width: 30px; + display: flex; + gap: 25px; + height: 100px; +} +.middle { + display: flex; + gap: 25px; +} +.search { + display: flex; + gap: 0; +} +.search input { + font-family: var(--font1); + font-weight: 700; + font-size: 14px; + color: #A6A6A6;; + width: 480px; + height: 40px; + padding: 12px 16px; + border-radius: 4px 0px 0px 4px; + border: 1px solid #A6A6A6; +} +.search button { + width: 50px; + height: 40px; + border-radius: 0px 4px 4px 0px; + border: 1px solid #A6A6A6; + cursor: pointer; +} +.search button img { + width: 18px; +} +.middle .micbtn { + background-color: transparent; + border: none; +} +.middle button img { + width: 18px; + height: 22px; + cursor: pointer; +} +.topnav ul { + display: flex; + gap: 25px; + list-style: none; +} +.topnav ul li button { + font-family: var(--font1); + font-weight: 700; + font-size: 14px; + border: none; + border-radius: 2.5px; + background-color: var(--bkg); + color: var(--txt); + padding: 10px 30px; + cursor: pointer; +} +@media screen and (max-width: 600px) { + /* Authenticated mobile .topnav */ + .topnav { + width: 100%; + padding: 0 20px; + } + .topnav .middle { + display: none; + + } + .topnav ul li button { + padding: 5px 10px; + } +} +nav .rightnav { + display: flex; + gap: 25px; + justify-content: center; + align-items: center; +} +.rightnav button { + background-color: transparent; + border: none; + cursor: pointer; +} +.topnav .rightnav .icons { + width: 22px; +} +.pic{ + display: grid; + grid-template-columns: auto auto auto auto; + background-color:white; + padding: 10px; + width: 70%; + margin: auto; + margin-left: 18em; + } + .grid-item2{ + background-color: rgba(255, 255, 255, 0.8); + border: 1px solid transparent; + padding: 10px; + font-size: 30px; + text-align: center; + } + .pic2{ + display: grid; + grid-template-columns: auto auto auto auto; + background-color:transparent; + padding: 5px; + width: 30%; + margin: auto; + margin-left: 40em; + } + .grid-item3 button{ + background-color: rgba(255, 255, 255, 0.8); + border: 1px solid transparent; + padding: 10px; + font-size: 20px; + text-align: center; + } + .grid-item3 img{ + width: 22px; + } + .grid-item3 button:hover{ + background-color: rgb(24, 129, 129); + + } + .butt2{ + background-color: rgb(24, 129, 129); + border: none; + color: white; + margin-left: auto; + margin-right: auto; + display: block; + font-size: 20px; + padding: 15px; + width: 170px; + transition: all 0.5s; + cursor: pointer; + text-align: center; + border-radius: 7px; + top : 20px + + + } + + .butt2 { + cursor: pointer; + + position: relative; + transition: 0.5s; + } + + .butt2 :after { + content: '\00bb'; + + opacity: 0; + top: 0; + right: -20px; + transition: 0.5s; + } + + .butt2:hover { + padding-right: 25px; + } + + .butt2:hover .butt2:after { + opacity: 1; + right: 0; + } + .grid-container { + display: grid; + grid-template-columns: auto auto ; + background-color: transparent; + padding: 10px; + width: 60%; + margin: auto; + margin-left: 18em; + } + .grid-item { + background-color: rgba(255, 255, 255, 0.8); + border: 1px solid transparent; + padding: 20px; + font-size: 30px; + text-align: center; + } + .grid-container { + display: grid; + grid-template-columns: auto auto ; + background-color: transparent; + padding: 10px; + width: 90%; + margin: auto; + margin-left: 200px; + } + .grid-item { + background-color: rgba(255, 255, 255, 0.8); + border: 1px solid transparent; + padding: 20px; + font-size: 20px; + + } + .side { + position: fixed; + width: 220px; + background-color: var(--txt); + } + .sidebar { + width: 100%; + height: 120vh; + color: var(--txt2); + display: flex; + flex-direction: column; + box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.12); + align-items: center; + gap: 10px; + } + .sidebar h1 { + display: block; + padding: 30px 73px; + } + .sidebar .sidelist { + display: flex; + flex-direction: column; + gap: 10px; + } + .sidelist li { + display: flex; + align-items: center; + padding: 20px 40px; + } + .sidelist li:hover { + background-color: var(--bkg2); + } + .sidelist li a { + display: flex; + align-items: center; + font-size: 14px; + color: var(--txt2); + gap: 5px; + } + .sidelist li a:hover { + color: var(--bkg); + filter: invert(43%) sepia(98%) saturate(2578%) hue-rotate(150deg) brightness(97%) contrast(101%); + } + .sidelist li a .icons { + width: 20px; + } \ No newline at end of file diff --git a/static/css/account.css b/static/css/account.css new file mode 100644 index 0000000..f2dc141 --- /dev/null +++ b/static/css/account.css @@ -0,0 +1,89 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500&display=swap'); + +*{ + margin: 0; + padding: 0; + font-family: 'Inter', sans-serif; + box-sizing: border-box; + color: #424242; +} + +.container{ + /* width: 100%; */ + /* background: #F5F5F5; */ + /* align-items: center; + justify-content: center; */ + padding: 30px; +} + +.account{ + font-size: .5em; + margin-bottom: 40px; +} + +.account i{ + margin-right: 10px; +} + +h3{ + font-size: 1.5em; + margin-bottom: 20px ; +} + +.pp{ + margin-bottom: 20px; +} + +.email{ + margin-bottom: 50px; +} + +.email a{ + color: #5975ff; + text-decoration: none; +} + +.flex-container{ + display: flex; + gap: 50px; + align-items: center; +} + +.btn{ + padding: 10px 15px; + border-radius: 5px; + border: 1px solid #424242; +} + +.pn{ + margin-bottom: 10px; +} + +.profile-view{ + margin: 20px 10px; +} + +.vw{ + border-right: 1px solid; + font-size: 13px; + padding: 2px 15px; +} + +.sc{ + font-size: 13px; + padding: 2px 15px; +} + +.flex-container2{ + display: flex; + align-items: start; + gap: 20px; +} + +.flex-item, .flex-p{ + display: block; + margin-bottom: 10px; + /* border: 1px solid red; */ +} + + diff --git a/static/css/creator.css b/static/css/creator.css new file mode 100644 index 0000000..c679949 --- /dev/null +++ b/static/css/creator.css @@ -0,0 +1,301 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap'); + +* { + margin: 0; + padding: 0; + list-style: none; + text-decoration: none; + font-family:'Inter', sans-serif; + /* outline: 1px solid salmon; */ + box-sizing: border-box; +} +:root { + --bkg: #00A9A5; + --bkg2: #F5F5F5; + --txt: #ffffff; + --txt2: #424242; + --font1: 'Inter', sans-serif; +} +body { + width: 100%; + /* background-color: rgb(180, 171, 189); */ + display: flex; + flex-direction: column; +} +.topnav { + position: relative; + z-index: 1; + color: #ffffff; + padding: 0 40px; + height: 72px; + display: flex; + align-items: center; + justify-content: space-between; + box-shadow: 0px 0px 42px rgba(0, 27, 29, 0.08); +} +.topnav a { + text-decoration: none; +} +.leftnav { + display: flex; + gap: 25px; +} +.leftnav .one{ + width:120px; + display: flex; + gap: 25px; +} +.leftnav .two{ + width: 30px; + display: flex; + gap: 25px; + height: 100px; +} +.middle { + display: flex; + gap: 25px; +} +.search { + display: flex; + gap: 0; +} +.search input { + font-family: var(--font1); + font-weight: 700; + font-size: 14px; + color: #A6A6A6;; + width: 480px; + height: 40px; + padding: 12px 16px; + border-radius: 4px 0px 0px 4px; + border: 1px solid #A6A6A6; +} +.search button { + width: 50px; + height: 40px; + border-radius: 0px 4px 4px 0px; + border: 1px solid #A6A6A6; + cursor: pointer; +} +.search button img { + width: 18px; +} +.middle .micbtn { + background-color: transparent; + border: none; +} +.middle button img { + width: 18px; + height: 22px; + cursor: pointer; +} +.topnav ul { + display: flex; + gap: 25px; + list-style: none; +} +.topnav ul li button { + font-family: var(--font1); + font-weight: 700; + font-size: 14px; + border: none; + border-radius: 2.5px; + background-color: var(--bkg); + color: var(--txt); + padding: 10px 30px; + cursor: pointer; +} +@media screen and (max-width: 600px) { + /* Authenticated mobile .topnav */ + .topnav { + width: 100%; + padding: 0 20px; + } + .topnav .middle { + display: none; + + } + .topnav ul li button { + padding: 5px 10px; + } +} +nav .rightnav { + display: flex; + gap: 25px; + justify-content: center; + align-items: center; +} +.rightnav button { + background-color: transparent; + border: none; + cursor: pointer; +} +.topnav .rightnav .icons { + width: 22px; +} +.side { +position: fixed; + +width: 220px; +background-color: var(--txt); +} +.sidebar { +width: 100%; +height: 120vh; +color: var(--txt2); +display: flex; +flex-direction: column; +box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.12); +align-items: center; +gap: 10px; +} +.sidebar h1 { +display: block; +padding: 30px 73px; +} +.sidebar .sidelist { +display: flex; +flex-direction: column; +gap: 10px; +} +.sidelist li { +display: flex; +align-items: center; +padding: 20px 40px; +} +.sidelist li:hover { +background-color: var(--bkg2); +} +.sidelist li a { +display: flex; +align-items: center; +font-size: 14px; +color: var(--txt2); +gap: 10px; +} +.sidelist li a:hover { +color: var(--bkg); +filter: invert(43%) sepia(98%) saturate(2578%) hue-rotate(150deg) brightness(97%) contrast(101%); +} +.sidelist li a .icons { +width: 20px; +} +.grid-container { + display: grid; + grid-template-columns: auto auto auto; + background-color: transparent; + padding: 10px; + width: 60%; + margin: auto; + margin-left: 18em; + } + .grid-item { + background-color: rgba(255, 255, 255, 0.8); + border: 1px solid transparent; + padding: 20px; + font-size: 30px; + text-align: center; + } + .pic{ + display: grid; + grid-template-columns: auto auto auto auto; + background-color:white; + padding: 10px; + width: 70%; + margin: auto; + margin-left: 18em; + } + .grid-item2{ + background-color: rgba(255, 255, 255, 0.8); + border: 1px solid transparent; + padding: 10px; + font-size: 30px; + text-align: center; + } + .pic2{ + display: grid; + grid-template-columns: auto auto auto auto; + background-color:transparent; + padding: 5px; + width: 30%; + margin: auto; + margin-left: 35em; + } + .grid-item3 button{ + background-color: rgba(255, 255, 255, 0.8); + border: 1px solid transparent; + padding: 10px; + font-size: 20px; + text-align: center; + } + .grid-item3 img{ + width: 22px; + } + .grid-item3 button:hover{ + background-color: rgb(24, 129, 129); + + } + .pic3{ + display: grid; + grid-template-columns: auto auto ; + background-color:transparent; + padding: 5px; + width: 70%; + margin: auto; + margin-left: 18em; + } + .grid-item4{ + background-color: rgba(255, 255, 255, 0.8); + border: 1px solid transparent; + padding: 10px; + font-size: 20px; + text-align: center; + } + .grid-item4 p{ + font-size: 25px; + font-weight: 400; + margin-bottom: 1em; + } + .butt2{ + background-color: rgb(24, 129, 129); + border: none; + color: white; + margin-left: auto; + margin-right: auto; + display: block; + font-size: 20px; + padding: 15px; + width: 170px; + transition: all 0.5s; + cursor: pointer; + text-align: center; + border-radius: 7px; + top : 20px + + + } + + .butt2 { + cursor: pointer; + + position: relative; + transition: 0.5s; + } + + .butt2 :after { + content: '\00bb'; + + opacity: 0; + top: 0; + right: -20px; + transition: 0.5s; + } + + .butt2:hover { + padding-right: 25px; + } + + .butt2:hover .butt2:after { + opacity: 1; + right: 0; + } \ No newline at end of file diff --git a/static/css/fake.css b/static/css/fake.css new file mode 100644 index 0000000..d0b2178 --- /dev/null +++ b/static/css/fake.css @@ -0,0 +1,151 @@ +*{ + margin: 0; + padding: 0; + font-family:'poppins', sans-serif ; + box-sizing: border-box; +} + +a{ + text-decoration: none; + color: #5a5a5a; +} +img{ + cursor: pointer; +} +.flex-div{ + display: flex; + align-items: center; +} +nav{ + padding: 2px 1%; + justify-content: space-between; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.2) ; + background: white; + position: sticky; + top: 0; + z-index:10 ; +} +.nav-left .menu-icon{ + width: 22px; + margin-right: 70px; + margin-left: 10px; + display: flex; + gap: 25px; +} + +.nav-left .logo{ + width: 90px; + display: flex; + gap: 25px; + + +} +.nav-middle .mic-icon{ + width: 20px; +} +.nav-middle .search-box{ + border: 1px solid #ccc; + margin-right: 15px; + padding: 8px 12px; + border-radius: 5px; +} +.nav-middle .search-box input{ + width: 400px; + border: 0; + outline: 0; + background: transparent; + font-size: 18px; +} +.nav-middle .search-box img { + width: 15px; + +} +.nav-right .one{ + padding-right: 20px; + width: 42px; +} +.nav-right .two{ + padding-right: 10px; + width: 30px; +} +.nav-right .three{ + padding-right: 5px; + width: 30px; +} + +.sidebar{ + background: #fff; + width: 17%; + height: 50vh; + position: fixed; + top: 5em; + + padding-top: 50px; + +} +.shortcut-links a img{ + width: 20px; + margin-right: 50px; +} +.shortcut-links a{ + display: flex; + align-items: center; + margin-bottom: 20px; + width: fit-content; + flex-wrap: wrap; + padding: 8px; + +} +.shortcut-links .big{ + width: 90px; + height: 30px; + margin-left: 30px +}; +.side { + position: relative; + display: flex; + width: 220px; + background-color: var(--txt); +} +.sidebar { + width: 100%; + height: 120vh; + color: var(--txt2); + display: flex; + flex-direction: column; + box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.12); + align-items: center; + gap: 10px; +} +.sidebar .big { + width: 90px; + height: 30px; + margin-left: 30px +} +.sidebar .sidelist { + display: flex; + flex-direction: column; + gap: 10px; +} +.sidelist li { + display: flex; + align-items: center; + padding: 20px 40px; +} +.sidelist li:hover { + background-color: var(--bkg2); +} +.sidelist li a { + display: flex; + align-items: center; + font-size: 14px; + color: var(--txt2); + gap: 10px; +} +.sidelist li a:hover { + color: var(--bkg); + filter: invert(43%) sepia(98%) saturate(2578%) hue-rotate(150deg) brightness(97%) contrast(101%); +} +.sidelist li a .icons { + width: 20px; +} \ No newline at end of file diff --git a/static/css/forgot.css b/static/css/forgot.css new file mode 100644 index 0000000..9fee7fe --- /dev/null +++ b/static/css/forgot.css @@ -0,0 +1,227 @@ + +/* Imported the font "Inter" from the google font library. */ +@import url("https://fonts.googleapis.com/css2?family=Inter:wght@700&display=swap"); + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} +/* To make it easier to access certain values and change them globally, + a root style system has been created. Mainly for colors, fonts, etc. */ +:root { + --bkg: #00a9a5; + --txt: #fff; + --txt2: #424242; + --txt3: #777777; + --font1: "Inter", sans-serif; +} + +body { + width: 100%; + font-family: Inter; +} + +/* The image and the container of the Forgot Password form are side by side, +therefore a Flex-box Display Method was used to place both items side by side according to the design specification. */ + + +.forgot-password-section { + display: flex; + flex-direction: row; /* to place flex-items horizontally*/ +} + +/*styling of the Forgot password box*/ + +.forgot-password { + display: flex; + flex-direction: column; + align-items: center; + padding: 80px 104px; + gap: 32px; + width: 595px; + height: 570px; + border: 2px solid var(--bkg); + border-radius: 40px; + margin: 70px 113px 10px 132px; +} + +/* styling of the logo on the page */ + +.fplogo { + Width: 105px; + Height: 31.62px; + Top: 74px; + Left: 245px; +} + +.forgot-password h2 { + font-weight: 700; + line-height: 41.15px; + font-size: 34px; + color: var(--bkg); + padding-bottom: 0px; +} + +.textfp { + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + color: var(--txt3); +} + +.forgot-password p { + font-weight: 400; + font-size: 16px; + line-height: 24px; +} + +.fpemail { + position: relative; + right: -4%; +} + +.fpemail p { + color: var(--txt2); +} +.fpemail input { + width: 240px; + height: 48px; + color: var(--txt3); + padding: 12px; + border: 1px solid #5975FF; + border-radius: 4px; +} + +.fprequest button { + position: relative; + left: 5%; + border-radius: 8px; + border: none; + padding: 14px 28px; + background-color: var(--bkg); + color: var(--txt); + font-weight: 700; + height: 52px; + text-align: center; + width: 234px; +} + +.remember p{ + color: var(--txt3); + font-size: 14px; + line-height: 24px; + width:180px; + text-align: center; + margin-bottom: 16px; +} + +.remember span { + font-size: 14px; + width: 91px; + height: 24px; + position: relative; + left: 44px; + padding:0px; +} + +.remember a { + text-decoration: none; + color: var(--bkg); +} + +.mbfpimg { + display: none; +} + + +/* A seperate div was used to style the Help Center under the Forgot Password Box */ + +.help-privacy-terms { + position: absolute; + top: 660px; + left: 296.5px; + display: flex; + flex-direction: row; + gap: 24px; + text-align: center; + font-size: 16px; + line-height: 24px; + color: var(--txt2); + text-decoration: none; +} +.help-privacy-terms a { + text-decoration: none; + color: var(--txt2) +} +/* mobile responsiveness using screen and max-width */ + +@media screen and (max-width: 428px) { + +/* The Design Specification had a column view for the Flexbox*/ +/* Flex-item 2 had the 1st order in the Flex-box for this screen */ +/* The Desktop image and the logo were not displayed in this Design. */ +body { + overflow-y: hidden; +} + .forgot-password-section { + flex-direction: column-reverse; + } + + .img1 { + display: none; + } + + .mbfpimg { + display:block; + width: 428px; + height: 129.95px; + } + + .forgot-password { + position: absolute; + top: 195px; + width: 334px; + height: 441px; + margin: 0px 47px; + border: 1px solid #CCEEED; + border-radius: 20px; + background: var(--txt); + } + + .fplogo { + display: none; + } + + .textfp { + position: absolute; + top: 32px; + margin-bottom: 32px; + padding-bottom: 10px; + } + + .textfp h2 { + font-size: 22px; + line-height: 29px; + width: 270px; + } + + .textfp p { + width: 231px; + height: 48px; + text-align: center; + margin-bottom: 32px; + } + + .fpemail { + margin-top: 32px; + } + + .help-privacy-terms { + top: 762px; + left: 71px; + text-decoration: none; + } + +} diff --git a/static/css/playlist.css b/static/css/playlist.css new file mode 100644 index 0000000..353b594 --- /dev/null +++ b/static/css/playlist.css @@ -0,0 +1,279 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap'); +* { + margin: 0; + padding: 0; + list-style: none; + text-decoration: none; + font-family:'Inter', sans-serif; + /* outline: 1px solid salmon; */ + box-sizing: border-box; +} +:root { + --bkg: #00A9A5; + --bkg2: #F5F5F5; + --txt: #ffffff; + --txt2: #424242; + --font1: 'Inter', sans-serif; +} +body { + width: 100%; + /* background-color: rgb(180, 171, 189); */ + display: flex; + flex-direction: column; +} +.topnav { + position: relative; + z-index: 1; + color: #ffffff; + padding: 0 40px; + height: 72px; + display: flex; + align-items: center; + justify-content: space-between; + box-shadow: 0px 0px 42px rgba(0, 27, 29, 0.08); +} +.topnav a { + text-decoration: none; +} +.leftnav { + display: flex; + gap: 25px; +} +.leftnav .one{ + width:120px; + display: flex; + gap: 25px; +} +.leftnav .two{ + width: 30px; + display: flex; + gap: 25px; + height: 100px; +} +.middle { + display: flex; + gap: 25px; +} +.search { + display: flex; + gap: 0; +} +.search input { + font-family: var(--font1); + font-weight: 700; + font-size: 14px; + color: #A6A6A6;; + width: 480px; + height: 40px; + padding: 12px 16px; + border-radius: 4px 0px 0px 4px; + border: 1px solid #A6A6A6; +} +.search button { + width: 50px; + height: 40px; + border-radius: 0px 4px 4px 0px; + border: 1px solid #A6A6A6; + cursor: pointer; +} +.search button img { + width: 18px; +} +.middle .micbtn { + background-color: transparent; + border: none; +} +.middle button img { + width: 18px; + height: 22px; + cursor: pointer; +} +.topnav ul { + display: flex; + gap: 25px; + list-style: none; +} +.topnav ul li button { + font-family: var(--font1); + font-weight: 700; + font-size: 14px; + border: none; + border-radius: 2.5px; + background-color: var(--bkg); + color: var(--txt); + padding: 10px 30px; + cursor: pointer; +} +@media screen and (max-width: 600px) { + /* Authenticated mobile .topnav */ + .topnav { + width: 100%; + padding: 0 20px; + } + .topnav .middle { + display: none; + + } + .topnav ul li button { + padding: 5px 10px; + } +} +nav .rightnav { + display: flex; + gap: 25px; + justify-content: center; + align-items: center; +} +.rightnav button { + background-color: transparent; + border: none; + cursor: pointer; +} +.topnav .rightnav .icons { + width: 22px; +} +.grid-container { + display: grid; + grid-template-columns: auto auto ; + background-color: transparent; + padding: 10px; + width: 60%; + margin: auto; + margin-left: 18em; + } + .grid-item { + background-color: rgba(255, 255, 255, 0.8); + border: 1px solid transparent; + padding: 20px; + font-size: 30px; + text-align: center; + } + .pic{ + display: grid; + grid-template-columns: auto auto auto auto; + background-color:white; + padding: 10px; + width: 70%; + margin: auto; + margin-left: 18em; + } + .grid-item2{ + background-color: rgba(255, 255, 255, 0.8); + border: 1px solid transparent; + padding: 10px; + font-size: 30px; + text-align: center; + } + .pic2{ + display: grid; + grid-template-columns: auto auto auto auto; + background-color:transparent; + padding: 5px; + width: 30%; + margin: auto; + margin-left: 35em; + } + .grid-item3 button{ + background-color: rgba(255, 255, 255, 0.8); + border: 1px solid transparent; + padding: 10px; + font-size: 20px; + text-align: center; + } + .grid-item3 img{ + width: 22px; + } + .grid-item3 button:hover{ + background-color: rgb(24, 129, 129); + + } + .butt2{ + background-color: rgb(24, 129, 129); + border: none; + color: white; + margin-left: auto; + margin-right: auto; + display: block; + font-size: 20px; + padding: 15px; + width: 170px; + transition: all 0.5s; + cursor: pointer; + text-align: center; + border-radius: 7px; + top : 20px + + + } + + .butt2 { + cursor: pointer; + + position: relative; + transition: 0.5s; + } + + .butt2 :after { + content: '\00bb'; + + opacity: 0; + top: 0; + right: -20px; + transition: 0.5s; + } + + .butt2:hover { + padding-right: 25px; + } + + .butt2:hover .butt2:after { + opacity: 1; + right: 0; + } + .side { + position: fixed; + + width: 220px; + background-color: var(--txt); + } + .sidebar { + width: 100%; + height: 120vh; + color: var(--txt2); + display: flex; + flex-direction: column; + box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.12); + align-items: center; + gap: 10px; + } + .sidebar h1 { + display: block; + padding: 30px 73px; + } + .sidebar .sidelist { + display: flex; + flex-direction: column; + gap: 10px; + } + .sidelist li { + display: flex; + align-items: center; + padding: 20px 40px; + } + .sidelist li:hover { + background-color: var(--bkg2); + } + .sidelist li a { + display: flex; + align-items: center; + font-size: 14px; + color: var(--txt2); + gap: 10px; + } + .sidelist li a:hover { + color: var(--bkg); + filter: invert(43%) sepia(98%) saturate(2578%) hue-rotate(150deg) brightness(97%) contrast(101%); + } + .sidelist li a .icons { + width: 20px; + } \ No newline at end of file diff --git a/static/css/settings.css b/static/css/settings.css new file mode 100644 index 0000000..fc24df4 --- /dev/null +++ b/static/css/settings.css @@ -0,0 +1,182 @@ + + @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap'); + + * { + margin: 0; + padding: 0; + list-style: none; + text-decoration: none; + font-family:'Inter', sans-serif; + /* outline: 1px solid salmon; */ + } + :root { + --bkg: #00A9A5; + --bkg2: #F5F5F5; + --txt: #ffffff; + --txt2: #424242; + --font1: 'Inter', sans-serif; + } + body { + width: 100%; + /* background-color: rgb(180, 171, 189); */ + display: flex; + flex-direction: column; + } + .topnav { + position: relative; + z-index: 1; + color: #ffffff; + padding: 0 40px; + height: 72px; + display: flex; + align-items: center; + justify-content: space-between; + box-shadow: 0px 0px 42px rgba(0, 27, 29, 0.08); + } + .topnav a { + text-decoration: none; + } + .leftnav { + display: flex; + gap: 25px; + } + .leftnav .one{ + width:120px; + display: flex; + gap: 25px; + } + .leftnav .two{ + width: 30px; + display: flex; + gap: 25px; + height: 100px; + } + .middle { + display: flex; + gap: 25px; + } + .search { + display: flex; + gap: 0; + } + .search input { + font-family: var(--font1); + font-weight: 700; + font-size: 14px; + color: #A6A6A6;; + width: 480px; + height: 40px; + padding: 12px 16px; + border-radius: 4px 0px 0px 4px; + border: 1px solid #A6A6A6; + } + .search button { + width: 50px; + height: 40px; + border-radius: 0px 4px 4px 0px; + border: 1px solid #A6A6A6; + cursor: pointer; + } + .search button img { + width: 18px; + } + .middle .micbtn { + background-color: transparent; + border: none; + } + .middle button img { + width: 18px; + height: 22px; + cursor: pointer; + } + .topnav ul { + display: flex; + gap: 25px; + list-style: none; + } + .topnav ul li button { + font-family: var(--font1); + font-weight: 700; + font-size: 14px; + border: none; + border-radius: 2.5px; + background-color: var(--bkg); + color: var(--txt); + padding: 10px 30px; + cursor: pointer; + } + @media screen and (max-width: 600px) { + /* Authenticated mobile .topnav */ + .topnav { + width: 100%; + padding: 0 20px; + } + .topnav .middle { + display: none; + + } + .topnav ul li button { + padding: 5px 10px; + } + } + nav .rightnav { + display: flex; + gap: 25px; + justify-content: center; + align-items: center; + } + .rightnav button { + background-color: transparent; + border: none; + cursor: pointer; + } + .topnav .rightnav .icons { + width: 22px; + } +.side { + position: relative; + display: flex; + width: 220px; + background-color: var(--txt); +} +.sidebar { + width: 100%; + height: 120vh; + color: var(--txt2); + display: flex; + flex-direction: column; + box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.12); + align-items: center; + gap: 10px; +} +.sidebar h1 { + display: block; + padding: 30px 73px; +} +.sidebar .sidelist { + display: flex; + flex-direction: column; + gap: 10px; +} +.sidelist li { + display: flex; + align-items: center; + padding: 20px 40px; +} +.sidelist li:hover { + background-color: var(--bkg2); +} +.sidelist li a { + display: flex; + align-items: center; + font-size: 14px; + color: var(--txt2); + gap: 10px; +} +.sidelist li a:hover { + color: var(--bkg); + filter: invert(43%) sepia(98%) saturate(2578%) hue-rotate(150deg) brightness(97%) contrast(101%); +} +.sidelist li a .icons { + width: 20px; +} \ No newline at end of file diff --git a/static/css/sign_in.css b/static/css/sign_in.css new file mode 100644 index 0000000..5fe291e --- /dev/null +++ b/static/css/sign_in.css @@ -0,0 +1,268 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300&display=swap'); + +* +{ + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: 'Inter', sans-serif; +} + +body{ + display: flex; + justify-content: center; + height: 100vh; +} + + + +h1{ + font-style: normal; + margin-bottom: 5px; +} + +.split-screen{ + /* border: 1px solid red; */ + display: flex; + justify-content: space-around; + width: 70%; + margin: auto; +} + +.logo{ + text-align: center; + color:#00A9A5; + width: 60px; + margin: auto; + font-weight: bolder; +} + +#versity{ + border-bottom:2px solid #00A9A5; + padding-bottom: 3px; +} + +.copy{ + text-align: center; + margin: 20px 0; +} + +.copy > p{ + font-size: 10px; +} + +label{ + display: block; + font-size: 10px; +} + +/* to STYLE THE REMEBER ME AND FORGOT PASSWORD */ +.remember{ + display: flex; + justify-content: space-between; +} + +/* Switch the default display for label to inline block */ +.remember label{ + display: inline-block; + margin-left: 5px; +} + +.remember a{ + color: #00A9A5; + font-size: 10px; +} + +.email{ + margin: auto; +} + +.loginframe{ + border: 2px solid #CCEEED; + border-radius: 40px; + padding: 40px 40px; +} + +.left form { + width: 334px; +} + +.contentbx +{ + /* border: 1px solid red; */ + /* width: 50%; */ + display: flex; + justify-content: center; + align-items: center; +} + +.imgbx > div,.imgbx img{ + width: 100px; + height: 100px; +} + +/* GRID FOR THE IMAGE CONTAINER */ +.grid-container { + display: grid; + grid-template-columns: auto auto auto; + gap:2px; + /* margin: auto; */ + /* border: 1px solid red; */ + } + .grid-item { + /* background-color: rgba(255, 255, 255, 0.8); + border: 1px solid rgba(0, 0, 0, 0.8); */ + } + + + /* END ADDED */ + +.img1, .img1 > img +{ + border-radius: 0px 50px 0px 0px; + +} + +.img2, .img2 > img +{ + border-radius: 50px 0px 0px 0px; +} + +.img3, .img3 > img +{ + border-radius: 50px; +} + +.img4, .img4 > img +{ + border-radius: 50px; +} + +.img5, .img5 > img +{ + border-radius: 0px 50px; +} + +.img6, .img6 > img +{ + border-radius: 50px; +} + +.color1 +{ + background-color: #5975FF; + border-radius: 0px 0px 0px 70px; +} + +.color2 +{ + background-color: rgba(30, 191, 3, 0.8); + border-radius: 70px 0px 0px 70px; +} + +.color3,.color6 +{ + background-color:#F9851B; + border-radius: 0px 40px; +} + +.color4 +{ + background-color: #005452; + border-radius: 70px 0px 0px 70px; +} + +.color5 +{ + background-color:#00A9A5; + border-radius: 70px 0px 0px 70px; +} + +input[type=email], input[type=password]{ + width: 100%; + border: 1px solid #939393; + border-radius: 4px; + padding: 8px; +} + +/* ADDED */ +form{ + color: #939393; + width: 250px; +} + +.mb-3{ + margin-bottom: 3px; +} + +.mb-15{ + margin-bottom: 15px; +} + + +.btn{ + width: 100%; + padding: 8px; + background-color: #00A9A5; + border-radius: 5px; + border: none; + color: white; +} + +.no-account{ + font-size: 10px; +} + +.no-account a{ + color: #00A9A5 +} + +.mobile{ + display: none; +} + +/* Extra small devices (phones, 600px and down) */ +@media only screen and (max-width:400px) { + body{ + display: flex; + height: auto; + font-size: 1.2em; + } + + .imgbx{ + display: none; + } + + .split-screen{ + flex-direction: column; + width: 100%; + margin-top: 40px; + } + + .loginframe{ + padding: 40px 40px 80px 40px; + position: absolute; + top: 150px; + background-color: #FFFFFF; + } + + .mobile{ + position: relative; + display: grid; + } + + .grid-container { + z-index: -1; /* this container should be behind */ + gap:1px; + /* border: 1px solid red; */ + } + .grid-item { + + /* background-color: rgba(255, 255, 255, 0.8); + border: 1px solid rgba(0, 0, 0, 0.8); */ + } + + .color2, .color3{ + width: 90px; + } +} \ No newline at end of file diff --git a/static/css/upload.css b/static/css/upload.css new file mode 100644 index 0000000..3485216 --- /dev/null +++ b/static/css/upload.css @@ -0,0 +1,74 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap'); +*{ + margin: 0; + padding: 0; + font-family:'Inter', sans-serif; + box-sizing: border-box; +} +body{ + width: 100%; +} +.butt2 { + border-radius: 5px; + background-color: rgb(24, 129, 129); + border: none; + color: white; + + font-size: 20px; + padding: 10px; + width: 170px; + transition: all 0.5s; + cursor: pointer; + margin-left: 55em; + bottom: 10px; + } + + .butt2 { + cursor: pointer; + display: inline-block; + position: relative; + transition: 0.5s; + } + + .butt2 :after { + content: '\00bb'; + position: absolute; + opacity: 0; + top: 0; + right: -20px; + transition: 0.5s; + } + + .butt2:hover { + padding-right: 25px; + } + + .butt2:hover .butt2:after { + opacity: 1; + right: 0; + } + h2{ + margin-left: 15em; + } +table { + border: 3px solid black ; + border-collapse: collapse; + width: 70%; + border-radius: 1px; + margin-left: auto; + margin-right: 100px; + + } + + td,th { + border: 1px solid transparent ; + text-align: left; + padding: 8px; + + border-bottom: 1px solid #ddd; + } + th{ + border: 1px solid #ddd; + width: 8.75; + + } diff --git a/static/css/upload2.css b/static/css/upload2.css new file mode 100644 index 0000000..5197122 --- /dev/null +++ b/static/css/upload2.css @@ -0,0 +1,81 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap'); + + * { + margin: 0; + padding: 0; + list-style: none; + text-decoration: none; + font-family:'Inter', sans-serif; + /* outline: 1px solid salmon; */ + } + h1{ + font-size: 30px; + margin-top: 2em; + } + .one{ + margin-left: auto; + margin-right: auto; + display: block; + margin-top: 8em; + } + .two{ + margin-left: auto; + margin-right: auto; + display: block; + } + .butt2{border-radius: 5px; + background-color: rgb(24, 129, 129); + border: none; + color: white; + margin-left: auto; + margin-right: auto; + display: block; + font-size: 20px; + padding: 15px; + width: 170px; + transition: all 0.5s; + cursor: pointer; + text-align: center; + bottom: 10px; + + } + + .butt2 { + cursor: pointer; + + position: relative; + transition: 0.5s; + } + + .butt2 :after { + content: '\00bb'; + position: absolute; + opacity: 0; + top: 0; + right: -20px; + transition: 0.5s; + } + + .butt2:hover { + padding-right: 25px; + } + + .butt2:hover .butt2:after { + opacity: 1; + right: 0; + } + @media screen and (max-width: 600px) { + /* Authenticated mobile .topnav */ + .h1 { + width: 100%; + padding: 0 20px; + } + .butt2 { + margin: auto; + } + .two { + margin: auto; + width: 80%; + } + + } \ No newline at end of file diff --git a/static/css/watch.css b/static/css/watch.css new file mode 100644 index 0000000..2cff067 --- /dev/null +++ b/static/css/watch.css @@ -0,0 +1,418 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap'); +*{ + margin: 0; + padding: 0; + font-family: 'Inter', sans-serif; + box-sizing: border-box; + text-decoration: none; +} +/* general */ +.flex{ + display: flex; +} + /* Unregistered Nav Bar */ + nav { + margin: 0 40px; + height: 72px; + display: flex; + align-items: center; + justify-content: space-between; +} +nav a { + text-decoration: none; +} +.leftnav { + display: flex; + gap: 25px; +} +.middle { + display: flex; + gap: 25px; +} +.search { + display: flex; + gap: 0; +} +.search input { + font-family: var(--font1); + font-weight: 700; + font-size: 14px; + color: #A6A6A6;; + width: 480px; + height: 40px; + padding: 12px 16px; + border-radius: 4px 0px 0px 4px; + border: 1px solid #A6A6A6; + cursor: pointer; +} +.search button img { + width: 18px; +} +.middle .micbtn { + background-color: transparent; + border: none; +} +.middle button img { + width: 18px; + height: 22px; + cursor: pointer; +} +.search button { + width: 50px; + height: 40px; + border-radius: 0px 4px 4px 0px; + border: 1px solid #A6A6A6; + cursor: pointer; +} +nav ul { + display: flex; + gap: 25px; + list-style: none; +} +nav ul li button { + font-family: var(--font1); + font-weight: 700; + font-size: 14px; + border: none; + border-radius: 2.5px; + background-color: var(--bkg); + color: var(--txt); + padding: 10px 30px; + cursor: pointer; +} + +/* Registered Nav Bar */ +nav .rightnav { + display: flex; + gap: 25px; + justify-content: center; + align-items: center; +} +.rightnav button { + background-color: transparent; + border: none; +} +nav .rightnav .icons { + width: 22px; +} + +/* ------------------ play video page ---- */ +.play-container{ + padding-left: 2%; + justify-content: space-between; +} + +.row{ + display:flex; + justify-content: space-between; + flex-wrap: wrap; +} +.play-video{ + flex-basis: 69%; +} +.right-sidebar{ + flex-basis: 30%; + padding: 0 20px; +} +.play-back-div{ + justify-content: space-between; + display: flex; + padding: 18px 24px; +} +.play-back-a { + display: flex; + justify-content: center; + align-items: center; + gap: 30px; +} +.play-back-a .image-a img, .play-back-b .image-b img { + width: 20px; + display: flex; + flex-direction: row; +} +.play-back-a .volume{ + padding-left: 20px; +} +.play-back-b{ + display: flex; + justify-content: center; + align-items: center; + gap: 30px; + text-decoration: none; +} +.kami{ + border-radius: 50%; +} +.right-sidebar h3{ + font-weight: 400; + font-size: 20px; + line-height: 24px; + color: #424242; + margin-bottom: 30px; +} +.play-video video{ + width: 100%; +} +.side-video-list{ + display: flex; + flex-direction: column; + justify-content: space-between; + margin-bottom: 8px; +} +.side-video-list .small-image{ + display: flex; +} +.side-video-list img{ + width: 100%; +} +.side-video-list .small-thumbnail{ + flex-basis: 49%; +} +.video-info-container{ + display: flex; +} +.vid-info{ + font-size: 14px; + font-family: 'Inter'; + font-style: normal; + font-weight: 500; + line-height: 24px; + color: #424242; + align-items: center; + flex: none; + order: 0; + align-self: stretch; + flex-grow: 0; +} +.vid-info a{ + color: #504f4f; + text-decoration: none; + font-weight: 600; + font-size: 0.95rem + +} +.sneak-peaks-text{ + padding: 1rem; + gap: 10px; +} +.sneak-peaks-img{ + display: flex; + gap: 5px; + padding-bottom: 2rem; +} + +.sneak-peaks-img img { + width: 32%; +} + +.play-video h3{ + font-weight: 600; + font-size: 22px; +} +.play-video-info p{ + margin-top: 15px; + text-align: left; +} +.play-video-info{ + display: flex; + flex-direction: column; + text-align: left; +} +.video-heading{ + display: flex; + flex-direction: row; + justify-content: space-between; + align-items:center; +} +.play-video .play-video-info{ + display: flex; + justify-content: space-between; + flex-wrap: wrap; + margin-top: 10px; + font-size: 14px; + color: #5a5a5a; +} +.play-video .play-video-info a img{ + width: 20px; + margin-right: 8px; +} +.play-video .play-video-info a{ + display: inline-flex; + align-items: center; + margin-left: 15px; + text-decoration: none; + color: #424242; +} +.play-video hr{ + border: 0; + height: 1px; + background: #ccc; + margin: 10px 0; +} +.publisher{ + display: flex; + align-items: flex-start; + margin-top: 20px; +} +.publisher div{ + flex: 1; + line-height: 18px; +} +.publisher img{ + width: 60px; + border-radius: 50%; + margin-right: 15px; +} +.publisher div p{ + color: #000; + font-weight: 600; + font-size: 18px; + margin-bottom: 10px; +} +.publisher div span{ + font-size: 13px; + color: #5a5a5a; + +} +.publisher button{ + background: #5975FF; + color: #fff; + padding: 8px 30px; + border: 0; + outline: 0; + border-radius: 4px; + cursor: pointer; + margin-top: 10px; +} +.publisher p{ + font-size: 10px; + margin: left; + color: #424242; +} +.vid-description{ + margin: 15px 0; +} + + +.vid-description p{ + font-size: 14px; + margin-bottom: 5px; + color: #5a5a5a; +} +.vid-description h4{ + font-size: 20px; + font-weight: 400; + color: #5a5a5a; + margin-top: 35px; +} + +.add-comment{ + display: flex; + align-items: flex-start; + margin: 30px 0; +} +.add-comment img{ + width: 6%; + border-radius: 50%; + margin-right: 15px; +} +.add-comment textarea{ + padding: 10px; + background-color: #f8f8f8; + border-radius: 8px; + border: 1px solid #ccc; + width: 90%; + height: 100px; +} +.comment-button { + display: flex; + justify-content: flex-end; + margin-right: 25px; +} +.comment-button button:first-of-type{ + background: none; + border: none; + color: #5975FF; + font-size: 14px; + font-weight: 700; + margin-right: 20px; +} +.comment-button button:last-of-type{ + color: #ffffff; + font-weight: 700; + padding: 8px 16px; + width: 131px; + height: 40px; + background: #00A9A5; + border-radius: 8px; + border: none; +} + +.old-comment{ + display: flex; + align-items: center; + margin: 20px 0; +} +.old-comment img{ + width: 60px; + border-radius: 50%; + margin-right: 15px; +} +.old-comment h3{ + font-size: 14px; + margin-bottom: 2px; +} +.old-comment h3 span{ + font-size: 12px; + color: #5a5a5a; + display: block; + font-weight: 500; + margin-top: 12px; +} +.old-comment p { + margin-top: 15px; + line-height: 30px; +} +.old-comment .comment-action{ + display: flex; + justify-content: space-between; + align-items: center; + margin: 8px 0; + font-size: 14px; +} +.old-comment .comment-action-icons{ + display: flex; + align-items: center; +} +.old-comment .comment-action img{ + border-radius: 0; + width: 20px; + margin-right: 5px; +} +.old-comment .comment-action span{ + margin: 20px; + color: #5a5a5a; +} +.old-comment .comment-action a{ + color: #0000ff; + +} +@media (max-width:900px){ + .play-video{ + flex-basis:100%; + } + .right-sidebar{ + flex-basis: 100%; + } + .play-container{ + padding-left: 5%; + } + .vid-description{ + padding-left: 0; + } + .play-video .play-video-info a{ + margin-left: 0; + margin-right: 15px; + margin-top: 15px; + } +} \ No newline at end of file