Merge pull request #999 from centerofci/line-height

Improve line-height CSS
mathesar-foundation · Jan 28, 2022 · f62f516 · f62f516
2 parents 3ebc91e + 40e9b2a
commit f62f516
Show file tree

Hide file tree

Showing 3 changed files with 66 additions and 45 deletions.
diff --git a/mathesar/templates/mathesar/base.html b/mathesar/templates/mathesar/base.html
@@ -8,70 +8,84 @@
     <title>Mathesar - {% block title %}{% endblock %}</title>
 
     <!-- TODO: Specify Mathesar favicon. Using a dummy data URI until then. -->
-    <link rel="icon" href="data:;base64,iVBORw0KGgo=">
+    <link rel="icon" href="data:;base64,iVBORw0KGgo=" />
 
     <style type="text/css">
-      html, body {
+      html,
+      body {
         position: absolute;
         width: 100%;
         height: 100%;
         overflow: hidden;
-        font-family: -apple-system,system-ui,BlinkMacSystemFont,'Segoe UI',
-                      Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',
-                      Helvetica, Arial, sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
+        font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI",
+          Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica,
+          Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
+          "Segoe UI Symbol";
         font-weight: 400;
         margin: 0;
         padding: 0;
         font-size: 14px;
-        line-height: 1em;
-        color: #1E1E1E;
+        line-height: 1.2;
+        color: #1e1e1e;
       }
       * {
         box-sizing: border-box;
         outline: 0;
       }
     </style>
-    {% if not development_mode %}
-      {% for css_file in manifest_data.module_css %}
-        <link rel="stylesheet" href="{% static css_file %}">
-      {% endfor %}
-    {% endif %}
-    {% block styles %}
-    {% endblock %}
+    {% if not development_mode %} {% for css_file in manifest_data.module_css %}
+    <link rel="stylesheet" href="{% static css_file %}" />
+    {% endfor %} {% endif %} {% block styles %} {% endblock %}
   </head>
   <body>
-    {% block scripts %}
-    {% endblock %}
-
-    {% if development_mode %}
-      <script type="module" src="{{ client_dev_url }}/@vite/client"></script>
-      <script type="module" src="{{ client_dev_url }}/src/main.ts"></script>
+    {% block scripts %} {% endblock %} {% if development_mode %}
+    <script type="module" src="{{ client_dev_url }}/@vite/client"></script>
+    <script type="module" src="{{ client_dev_url }}/src/main.ts"></script>
     {% else %}
-      <!-- For legacy browsers that do not support modules -->
-      <script nomodule>
-        !function(){
-          var e=document,t=e.createElement("script");
-          if(!("noModule"in t)&&"onbeforeload"in t){
-            var n=!1;e.addEventListener(
-              "beforeload",
-              (function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute("nomodule")||!n)return;e.preventDefault()}),
-              !0
-            ),t.type="module",t.src=".",e.head.appendChild(t),t.remove()
-          }
-        }();
-      </script>
+    <!-- For legacy browsers that do not support modules -->
+    <script nomodule>
+      !(function () {
+        var e = document,
+          t = e.createElement("script");
+        if (!("noModule" in t) && "onbeforeload" in t) {
+          var n = !1;
+          e.addEventListener(
+            "beforeload",
+            function (e) {
+              if (e.target === t) n = !0;
+              else if (!e.target.hasAttribute("nomodule") || !n) return;
+              e.preventDefault();
+            },
+            !0
+          ),
+            (t.type = "module"),
+            (t.src = "."),
+            e.head.appendChild(t),
+            t.remove();
+        }
+      })();
+    </script>
 
-      {% for js_file in manifest_data.module_vendor_js %}
-        <link rel="modulepreload" href="{% static js_file %}">
-      {% endfor %}
-      <script type="module" src="{% static manifest_data.module_js %}"></script>
-      <script nomodule src="{% static manifest_data.legacy_polyfill_js %}"></script>
-      {% for js_file in manifest_data.legacy_vendor_js %}
-        <script nomodule src="{% static js_file %}"></script>
-      {% endfor %}
-      <script nomodule id="vite-legacy-entry" data-src="{% static manifest_data.legacy_js %}">
-        System.import(document.getElementById("vite-legacy-entry").getAttribute("data-src"))
-      </script>
+    {% for js_file in manifest_data.module_vendor_js %}
+    <link rel="modulepreload" href="{% static js_file %}" />
+    {% endfor %}
+    <script type="module" src="{% static manifest_data.module_js %}"></script>
+    <script
+      nomodule
+      src="{% static manifest_data.legacy_polyfill_js %}"
+    ></script>
+    {% for js_file in manifest_data.legacy_vendor_js %}
+    <script nomodule src="{% static js_file %}"></script>
+    {% endfor %}
+    <script
+      nomodule
+      id="vite-legacy-entry"
+      data-src="{% static manifest_data.legacy_js %}"
+    >
+      System.import(
+        document.getElementById("vite-legacy-entry").getAttribute("data-src")
+      );
+    </script>
     {% endif %}
   </body>
 </html>
diff --git a/mathesar_ui/src/header/Header.scss b/mathesar_ui/src/header/Header.scss
@@ -25,6 +25,13 @@ header {
     border-radius: 3px;
     margin-left: auto;
     margin-right: auto;
+    display: flex;
+    align-items: center;
+
+    > * {
+      flex-shrink: 0;
+      flex-grow: 1;
+    }
   }
 
   .right-options {

diff --git a/mathesar_ui/src/sections/table-view/row/Row.scss b/mathesar_ui/src/sections/table-view/row/Row.scss
@@ -122,7 +122,7 @@ section.table-section .tab-container .table-data .body {
         right: 0;
         top: 0;
         bottom: 0;
-        padding: 7px 14px;
+        padding: 6px 14px;
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;