Slightly improve usability of the mobile layout

src/paths/index/components/prs/PullRequestList.js

@@ -112,6 +112,8 @@ export default class PullRequestList extends LitElement {
           @media only screen and (max-width: 900px) {
             :host .team-pulls {
               padding: 8px;
+              max-width: 95%;
+              margin: 0px auto;
             }
             :host .pulls-count {
               margin-bottom: 12px;
@@ -123,6 +125,17 @@ export default class PullRequestList extends LitElement {
               width: 100%;
               justify-content: space-between;
             }
+
+            :host .pulls-filters-column {
+                font-size: 15px;
+            }
+            :host .pulls-filters-column > span {
+                padding: 2px 0;
+            }
+            :host .pulls-filter > *:first-child,
+            :host .pulls-sort > *:first-child {
+                padding-right: 12px;
+            }
           }
         `;
     }

src/paths/index/components/teams/TeamItem.js

@@ -17,12 +17,12 @@ export default class TeamItem extends LitElement {
               --tab-active-border-color: #397adf;
             }
           }
-          
+
           /** Component styling **/
           :host {
             max-width: 240px;
           }
-          
+
           :host .team-item {
             border-left: 5px solid transparent;
             color: var(--g-font-color);
@@ -47,13 +47,13 @@ export default class TeamItem extends LitElement {
             width: 16px;
             height: 16px;
           }
-          
+
           :host .team-title {
             font-size: 13px;
             padding-left: 12px;
             white-space: nowrap;
           }
-          
+
           :host .team-pull-count {
             color: var(--dimmed-font-color);
             flex-grow: 1;
@@ -65,6 +65,17 @@ export default class TeamItem extends LitElement {
             color: var(--g-font-color);
             font-weight: 700;
           }
+
+          @media only screen and (max-width: 900px) {
+            :host .team-item {
+              padding: 6px 16px;
+            }
+
+            :host .team-title,
+            :host .team-pull-count {
+              font-size: 16px;
+            }
+          }
         `;
     }
 
@@ -87,7 +98,7 @@ export default class TeamItem extends LitElement {
 
         return html`
             <div class="${classList.join(" ")}">
-                <div 
+                <div
                     class="team-icon"
                     style="background-image: url('${this.avatar}')"
                 ></div>

src/paths/index/components/teams/TeamList.js

@@ -80,10 +80,18 @@ export default class TeamList extends LitElement {
             :host {
               width: 100%
             }
+
+            :host .team-list-switcher {
+                font-size: 17px;
+            }
+
             :host .team-list {
               display: none;
               width: 100% !important;
             }
+            :host .team-list.team-list--active {
+                margin-bottom: 24px;
+            }
             :host .team-mobile-container,
             :host .team-list.team-list--active {
               display: block !important;