From e56f64afc6aa4cf2b34bd1d9f484a14ec06c05c1 Mon Sep 17 00:00:00 2001
From: Alexandr Karpov <alexandr.d.karpov@gmail.com>
Date: Fri, 14 Apr 2023 10:23:48 +0300
Subject: [PATCH] fixed adaptive

---
 akarpov/files/previews/video/basic.py | 2 +-
 akarpov/files/previews/video/mp4.py   | 4 ++--
 akarpov/static/css/project.css        | 2 +-
 akarpov/templates/base.html           | 6 +++---
 akarpov/templates/blog/list.html      | 2 +-
 akarpov/templates/files/view.html     | 4 ++--
 6 files changed, 10 insertions(+), 10 deletions(-)
diff --git a/akarpov/files/previews/video/basic.py b/akarpov/files/previews/video/basic.py
index 40d2ae9..077c09d 100644
--- a/akarpov/files/previews/video/basic.py
+++ b/akarpov/files/previews/video/basic.py
@@ -11,7 +11,7 @@ def view(file: File) -> (str, str):
     <meta property="og:video:height" content="480" />
     <link href="https://vjs.zencdn.net/8.0.4/video-js.css" rel="stylesheet" />
     """
-    data = """"playbackRates": [0.5, 1, 1.5, 2], "responsive": true }"""
+    data = """{"playbackRates": [0.5, 1, 1.5, 2], "responsive": true, "fit": true, "fluid": true }"""
     content = f"""
 
       <video id="my_video_1" class="video-js vjs-default-skin" height="500px"
diff --git a/akarpov/files/previews/video/mp4.py b/akarpov/files/previews/video/mp4.py
index 40d2ae9..ba99a09 100644
--- a/akarpov/files/previews/video/mp4.py
+++ b/akarpov/files/previews/video/mp4.py
@@ -11,10 +11,10 @@ def view(file: File) -> (str, str):
     <meta property="og:video:height" content="480" />
     <link href="https://vjs.zencdn.net/8.0.4/video-js.css" rel="stylesheet" />
     """
-    data = """"playbackRates": [0.5, 1, 1.5, 2], "responsive": true }"""
+    data = """{"playbackRates": [0.5, 1, 1.5, 2], "responsive": true, "fit": true, "fluid": true }"""
     content = f"""
 
-      <video id="my_video_1" class="video-js vjs-default-skin" height="500px"
+      <video id="my_video_1" class="video-js vjs-default-skin"
           controls poster='{file.preview.url if file.preview else ''}'
           data-setup='{data}'>
         <source src="{file.file.url}" type='{file.file_type}' />
diff --git a/akarpov/static/css/project.css b/akarpov/static/css/project.css
index bddb619..c4c827c 100644
--- a/akarpov/static/css/project.css
+++ b/akarpov/static/css/project.css
@@ -507,7 +507,7 @@ p {
 }
 
 .sidebar {
-  max-height: 15%;
+  max-height: 7%;
 }
 
 @media (min-width: 576px) {
diff --git a/akarpov/templates/base.html b/akarpov/templates/base.html
index d58a568..1d437c8 100644
--- a/akarpov/templates/base.html
+++ b/akarpov/templates/base.html
@@ -33,7 +33,7 @@
   <body>
       <div class="container-fluid">
         <div class="row vh-100 overflow-auto">
-            <div class="sidebar col-12 col-sm-3 col-xl-1 px-sm-2 px-0 bg-dark d-flex sticky-top">
+            <div class="sidebar col-12 col-lg-2 col-sm-3 col-md-2 col-xl-1 px-sm-2 px-0 bg-dark d-flex sticky-top">
                 <div class="d-flex flex-sm-column flex-row flex-grow-1 align-items-center align-items-sm-start px-3 pt-2 text-white">
                     <a href="/" class="d-flex align-items-center pb-sm-3 mb-md-0 me-md-auto text-white text-wrap text-decoration-none">
                         <span class="fs-5">A<span class="d-none d-sm-inline">karpov</span></span>
@@ -97,8 +97,8 @@
                     </div>
                 </div>
             </div>
-            <div id="body" class="col d-flex flex-column h-sm-100">
-                <main class="row overflow-aut px-lg-4">
+            <div id="body" class="col-xl-11 col-lg-10 col-md-9 col-sm-9 col-12 d-flex align-self-start justify-content-start flex-column h-100">
+                <main class="px-lg-4 row overflow-auto">
                     <div class="col pt-4">
                          {% if messages %}
                             {% for message in messages %}
diff --git a/akarpov/templates/blog/list.html b/akarpov/templates/blog/list.html
index dec2381..34e24b4 100644
--- a/akarpov/templates/blog/list.html
+++ b/akarpov/templates/blog/list.html
@@ -9,7 +9,7 @@
   {% endif %}
   <div class="row mb-2">
   {% for post in post_list %}
-      <div class="col-md-6 col-xl-12">
+      <div class="col-12">
         <div class="row g-0 border rounded overflow-hidden flex-md-row mb-4 shadow-sm h-md-250 position-relative blog-cards">
           <div class="col p-4 d-flex flex-column position-static">
             <strong style="color: {{ post.h_tag.color }}" class="d-inline-block mb-2">{{ post.h_tag.name }}</strong>
diff --git a/akarpov/templates/files/view.html b/akarpov/templates/files/view.html
index 9b95a79..05e4d55 100644
--- a/akarpov/templates/files/view.html
+++ b/akarpov/templates/files/view.html
@@ -9,7 +9,7 @@
 {% block content %}
 <div class="row m-2">
   <h1 class="fs-1 text-break mb-4">{{ file.name }}</h1>
-  <div class="col-md-4 col-sm-6 col-xs-auto">
+  <div class="col-md-4 col-sm-6 col-xs-auto mb-5">
     {% if not has_perm %}
         <p>Uploaded by: <a href="{% url 'users:detail' file.user.username %}">
         {% if file.user.image_cropped %}<img class="rounded" width="20" src="{{ file.user.image_cropped.url }}" alt=""> {% endif %}
@@ -39,7 +39,7 @@
       {% endif %}
     </div>
   </div>
-  <div class="col-md-8 col-sm-10 col-xs-auto">
+  <div class="col-md-8 col-sm-10 col-xs-auto mt-xs-4">
   {% autoescape off %}
   {{ preview_content }}
   {% endautoescape %}
