some webv2 UI polish (#2940)

* style tweaks for Action Button, UserMenu, Modal

* a bunch of misc polish; some around chat

* Prettified Code!

* cleanup

* fix formatting

* Reduce content padding a bit

* some stylesheet cleanup

* fix action button sizing

* Remove action button height completely

---------

Co-authored-by: gingervitis <gingervitis@users.noreply.github.com>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>

web/styles/ant-overrides.scss

@@ -39,7 +39,6 @@ BUTTONS
 .ant-btn-primary {
   height: 2rem;
   font-size: 0.85rem;
-  font-weight: bold;
   border-width: 2px;
   border-radius: var(--theme-rounded-corners);
   color: var(--theme-color-components-primary-button-text);
@@ -110,30 +109,13 @@ DROPDOWN
     background-color: var(--theme-color-components-menu-item-focus-bg);
   }
 }
-
-.ant-modal-header {
-  color: var(--theme-color-components-modal-header-text);
-  font-family: var(--theme-text-display-font-family);
-}
-.ant-modal-title {
-  color: var(--theme-color-components-modal-header-text);
-}
-.ant-modal-body {
-  overflow: auto;
-  border-radius: 0 0 var(--theme-rounded-corners) var(--theme-rounded-corners);
-}
-.ant-modal {
-  color: var(--theme-color-components-text-on-light);
-  h1 {
-    color: var(--theme-color-components-text-on-light);
-  }
-}
-.ant-modal-content {
-  box-shadow: 3px 15px 15px -3px rgba(0, 0, 0, 0.15), 0px 4px 6px -2px rgba(0, 0, 0, 0.08);
+.ant-dropdown-menu-item,
+.ant-dropdown-menu-submenu-title {
+  font-size: 0.8rem;
+  padding: 4px 15px;
 }
 
 .ant-input-affix-wrapper {
-  padding: 4px 5px;
   background-color: var(--theme-color-components-form-field-background);
 }
 
@@ -238,10 +220,10 @@ th {
   color: var(--theme-color-palette-12);
 }
 
-.line-chart-container{
+.line-chart-container {
   position: relative;
-  .download-btn{
-    position:absolute;
+  .download-btn {
+    position: absolute;
     top: 0.3rem;
     right: 0.35rem;
   }

web/styles/globals.scss

@@ -7,12 +7,18 @@
 @import './mixins.scss';
 
 :root {
-  --content-padding: 12px;
+  --content-padding: 0.95rem;
   --module-spacing: 12px; // margin size between lines of stuff, if needed
   --header-height: 4.3rem; // needed for making main content scrollable;
   --footer-height: 2.5rem; // needed for making main content scrollable;
   --content-height: calc(100vh - var(--header-height));
   --replacement-bar-height: 46px; // needed for making main content scrollable on mobile;
+
+  // chat modules
+  --chat-message-text-size: 0.825rem;
+  --chat-notification-icon-padding: 6px;
+  --chat-message-padding: 10px;
+  --chat-text-highlight-border-radius: 3px;
 }
 
 ::selection {
@@ -25,7 +31,7 @@ html {
 
 body {
   font-family: var(--theme-text-body-font-family);
-  line-height: 1.5em;
+  font-weight: 300;
   margin: 0;
   background-color: var(--theme-color-background-main);
 
@@ -54,6 +60,7 @@ body {
 
   h1 {
     font-size: 2em;
+    font-weight: 600;
   }
 
   h2 {
@@ -64,7 +71,7 @@ body {
   h3 {
     font-family: var(--theme-text-body-font-family);
     font-size: 1.25em;
-    font-weight: 500;
+    font-weight: 600;
   }
 
   h4 {
@@ -101,7 +108,7 @@ body {
 
   strong,
   b {
-    font-weight: 700;
+    font-weight: 600;
   }
 }