minor web satelite ui bug fixes (#1031)

web/satellite/src/App.vue

@@ -87,10 +87,11 @@ export default class App extends Vue {
         font-family: inherit;
         font-weight: 600;
         border: 1px solid rgba(56, 75, 101, 0.4);
+        color: #354049;
     }
 
     input:hover,
     textarea:hover {
-        border-color: #737791 !important;
+        border-color: #2683FF !important;
     }
 </style>

web/satellite/src/components/apiKeys/headerArea/SearchArea.vue

@@ -58,7 +58,6 @@ export default class SearchArea extends Vue {
                     padding-left: 20px;
                     font-family: 'montserrat_regular';
                     font-size: 16px;
-                    color: #AFB7C1;
                     outline: none;
                     box-shadow: none;
 

web/satellite/src/components/team/TeamMemberItem.vue

@@ -6,8 +6,8 @@
         <div class="user-container__avatar">
             <h1>{{projectMember.user.firstName.slice(0,1)}}</h1>
         </div>
-        <p class="user-container__user-name">{{`${projectMember.user.firstName} ${projectMember.user.lastName}`}}</p>
-        <p class="user-container__user-email">{{projectMember.user.email}}</p>
+        <p class="user-container__user-name">{{userInfo.fullName}}</p>
+        <p class="user-container__user-email">{{userInfo.email}}</p>
         <p class="user-container__date">{{new Date(projectMember.joinedAt).toLocaleDateString()}}</p>
     </div>
 </template>
@@ -19,6 +19,23 @@ import { Component, Vue } from 'vue-property-decorator';
     props: {
         projectMember: Object,
     },
+    computed: {
+        userInfo: function (): object { 
+            let fullName: string = this.$props.projectMember.user.firstName + ' ' + this.$props.projectMember.user.lastName;
+            let email: string = this.$props.projectMember.user.email;
+
+            if (fullName.length > 16) {
+                fullName = this.$props.projectMember.user.firstName.slice(0, 1).toUpperCase() + 
+                            '. ' + this.$props.projectMember.user.lastName.slice(0, 1).toUpperCase() + '.';
+            }
+
+            if (email.length > 16) {
+                email = this.$props.projectMember.user.email.slice(0, 13) + '...';
+            }
+
+            return { fullName, email };
+        },
+    }
 })
 
 export default class TeamMemberItem extends Vue {
@@ -65,20 +82,12 @@ export default class TeamMemberItem extends Vue {
             margin-bottom: 15px;
         }
 
-        &__company-name {
-            font-family: 'montserrat_bold';
-            font-size: 16px;
-            color: #354049;
-            margin-top: 20px;
-            margin-bottom: 10px;
-        }
-
         &__user-name {
-            font-family: 'montserrat_regular';
+            font-family: 'montserrat_bold';
             font-size: 14px;
             line-height: 19px;
-            color: #AFB7C1;
-            margin: 0;
+            color: #354049;
+            margin-top: 20px;
         }
 
         &__avatar {

web/satellite/src/components/team/headerArea/SearchArea.vue

@@ -75,7 +75,6 @@ export default class SearchArea extends Vue {
                     padding-left: 20px;
                     font-family: 'montserrat_regular';
                     font-size: 16px;
-                    color: #AFB7C1;
                     transition: all .2s ease-in-out;
 
                     &:hover {

web/satellite/src/views/Login.vue

@@ -4,7 +4,7 @@
 <template>
     <div class="login-container">
         <div class="login-container__wrapper">
-            <img class="login-container__logo" src="../../static/images/login/Logo.svg" alt="logo">
+            <img class="login-container__logo" src="../../static/images/login/Logo.svg" alt="logo" v-on:click="onLogoClick">
             <div class="login-area">
                 <div class="login-area__title-container">
                     <h1>Welcome to Storj</h1>
@@ -58,6 +58,9 @@ import { getTokenRequest } from '@/api/users';
         };
     },
     methods: {
+        onLogoClick: function (): void {
+            location.reload();
+        },
         setEmail: function (value: string) {
             this.$data.email = value;
         },

web/satellite/src/views/Register.vue

@@ -211,7 +211,6 @@ export default class Register extends Vue {
 
         &__scrollable {
             height: 100vh;
-            overflow-y: scroll;
             display: flex;
             flex-direction: column;
             justify-content: flex-start;