Responsive video container not quite working the way it should.

2 files changed, 39 insertions, 4 deletions

diff --git a/pydis_site/static/css/base/base.css b/pydis_site/static/css/base/base.css
index f9c557d5..969511f4 100644
--- a/pydis_site/static/css/base/base.css
+++ b/pydis_site/static/css/base/base.css
@@ -12,6 +12,12 @@ main.site-content {
   flex: 1;
 }
 
+div.card.has-equal-height {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+}
+
 #django-logo {
   padding-bottom: 2px;
   background: url(https://static.djangoproject.com/img/logos/django-logo-negative.png) no-repeat center;
diff --git a/pydis_site/static/css/home/index.css b/pydis_site/static/css/home/index.css
index 9f060562..4f1a25ab 100644
--- a/pydis_site/static/css/home/index.css
+++ b/pydis_site/static/css/home/index.css
@@ -48,9 +48,9 @@
 
 .video-container {
     position: relative;
-    padding-bottom: 285px;
-    padding-top: 30px;
-    height: 0;
+    padding-top: 56.25%;
+    margin-left: 10px;
+    margin-right: 10px;
     overflow: hidden;
 }
 
@@ -60,8 +60,37 @@
     position: absolute;
     top: 0;
     left: 0;
+    right: 0;
     width: 100%;
     height: 100%;
-    max-width: 560px;
+    border: 0;
     max-height: 315px;
+    max-width: 560px;
+}
+
+span.repo-language-dot {
+    border-radius: 50%;
+    height: 12px;
+    width: 12px;
+    top: 1px;
+    display: inline-block;
+    position: relative;
+}
+
+span.repo-language-dot.python {
+    background-color: #3572A5;
+}
+
+span.repo-language-dot.html {
+    background-color: #e34c26;
+}
+
+span.repo-language-dot.css {
+    background-color: #563d7c;
+}
+
+
+
+#repo-footer-item {
+    margin-left: 1.2rem;
 }