[CORL-743] Fix sort menu on small screens (#2698)

* fix: sort menu on small screens

* chore: add comments

src/core/client/stream/tabs/Comments/Stream/SortMenu.css

@@ -1,8 +1,18 @@
 .mobileSelect {
-  padding: 11px;
-  width: 0px;
-  font-size: 0;
+  /* This adds left padding to Chrome on windows.. */
+  padding: 3px;
+  font-size: 16px;
+  line-height: 0;
+  height: 24px;
+  width: 24px;
+  /* Make the native select invisible */
+  opacity: 0;
 }
 .mobileAfterWrapper {
-  right: 5px;
+  height: 24px;
+  width: 24px;
+  right: 0px;
+  border: 1px solid var(--palette-text-primary);
+  box-sizing: border-box;
+  border-radius: var(--round-corners);
 }

src/core/client/ui/components/SelectField/SelectField.css

@@ -26,6 +26,7 @@
   outline: none;
   color: var(--palette-text-primary);
   width: 100%;
+  font-family: system-ui !important;
 
   &::-moz-focus-inner {
     border: 0;