fix chrome scaling issue, #616

7 months ago · feabc87c9f
parent 6f1a45ffb1
commit feabc87c9f
2 changed files with 10 additions and 12 deletions
--- a/tubearchivist/home/templates/home/base.html
+++ b/tubearchivist/home/templates/home/base.html
@ -33,11 +33,9 @@
 <body>
    <div class="main-content">
        <div class="boxed-content">
-            <div class="top-banner">
-                <a href="{% url 'home' %}">
-                    <img alt="tube-archivist-banner">
-                </a>
-            </div>
+            <a href="{% url 'home' %}">
+                <div class="top-banner"></div>
+            </a>
            <div class="top-nav">
                <div class="nav-items">
                    <a href="{% url 'home' %}">
--- a/tubearchivist/static/css/style.css
+++ b/tubearchivist/static/css/style.css
@ -159,13 +159,13 @@ button:hover {
 }

 .top-banner {
-    text-align: center;
-}
-
-.top-banner img {
-    width: 100%;
-    max-width: 700px;
-    content: var(--banner);
+    background-image: var(--banner);
+    background-repeat: no-repeat;
+    background-size: contain;
+    height: 10vh;
+    min-height: 80px;
+    max-height: 120px;
+    background-position: center center;
 }

 .footer {