fix new user table

Signed-off-by: GretaD <gretadoci@gmail.com>

apps/settings/css/settings.scss

@@ -1414,7 +1414,7 @@ doesnotexist:-o-prefocus, .strengthify-wrapper {
 				@include position('sticky');
 				align-self: normal;
 				background-color: var(--color-main-background);
-				z-index: 55; /* above multiselect */
+				z-index: 100; /* above multiselect */
 				top: $header-height;
 				&.sticky {
 					box-shadow: 0 -2px 10px 1px var(--color-box-shadow);
@@ -1430,8 +1430,7 @@ doesnotexist:-o-prefocus, .strengthify-wrapper {
 			}
 			// separate prop to set initial value to top: 50px
 			&#new-user {
-			  top: $header-height + $grid-row-height;
-			  height: 90px;
+			  height: 120px;
 			  .row {
 				padding-top: 50px;
 			  }

apps/settings/src/components/UserList.vue

@@ -22,58 +22,6 @@
 
 <template>
 	<div id="app-content" class="user-list-grid" @scroll.passive="onScroll">
-		<div id="grid-header"
-			:class="{'sticky': scrolled && !showConfig.showNewUserForm}"
-			class="row">
-			<div id="headerAvatar" class="avatar" />
-			<div id="headerName" class="name">
-				{{ t('settings', 'Username') }}
-
-				<div class="subtitle">
-					{{ t('settings', 'Display name') }}
-				</div>
-			</div>
-			<div id="headerPassword" class="password">
-				{{ t('settings', 'Password') }}
-			</div>
-			<div id="headerAddress" class="mailAddress">
-				{{ t('settings', 'Email') }}
-			</div>
-			<div id="headerGroups" class="groups">
-				{{ t('settings', 'Groups') }}
-			</div>
-			<div v-if="subAdminsGroups.length>0 && settings.isAdmin"
-				id="headerSubAdmins"
-				class="subadmins">
-				{{ t('settings', 'Group admin for') }}
-			</div>
-			<div id="headerQuota" class="quota">
-				{{ t('settings', 'Quota') }}
-			</div>
-			<div v-if="showConfig.showLanguages"
-				id="headerLanguages"
-				class="languages">
-				{{ t('settings', 'Language') }}
-			</div>
-
-			<div v-if="showConfig.showUserBackend || showConfig.showStoragePath"
-				class="headerUserBackend userBackend">
-				<div v-if="showConfig.showUserBackend" class="userBackend">
-					{{ t('settings', 'User backend') }}
-				</div>
-				<div v-if="showConfig.showStoragePath"
-					class="subtitle storageLocation">
-					{{ t('settings', 'Storage location') }}
-				</div>
-			</div>
-			<div v-if="showConfig.showLastLogin"
-				class="headerLastLogin lastLogin">
-				{{ t('settings', 'Last login') }}
-			</div>
-
-			<div class="userActions" />
-		</div>
-
 		<form v-show="showConfig.showNewUserForm"
 			id="new-user"
 			:class="{'sticky': scrolled && showConfig.showNewUserForm}"
@@ -206,6 +154,57 @@
 					value="">
 			</div>
 		</form>
+		<div id="grid-header"
+			:class="{'sticky': scrolled && !showConfig.showNewUserForm}"
+			class="row">
+			<div id="headerAvatar" class="avatar" />
+			<div id="headerName" class="name">
+				{{ t('settings', 'Username') }}
+
+				<div class="subtitle">
+					{{ t('settings', 'Display name') }}
+				</div>
+			</div>
+			<div id="headerPassword" class="password">
+				{{ t('settings', 'Password') }}
+			</div>
+			<div id="headerAddress" class="mailAddress">
+				{{ t('settings', 'Email') }}
+			</div>
+			<div id="headerGroups" class="groups">
+				{{ t('settings', 'Groups') }}
+			</div>
+			<div v-if="subAdminsGroups.length>0 && settings.isAdmin"
+				id="headerSubAdmins"
+				class="subadmins">
+				{{ t('settings', 'Group admin for') }}
+			</div>
+			<div id="headerQuota" class="quota">
+				{{ t('settings', 'Quota') }}
+			</div>
+			<div v-if="showConfig.showLanguages"
+				id="headerLanguages"
+				class="languages">
+				{{ t('settings', 'Language') }}
+			</div>
+
+			<div v-if="showConfig.showUserBackend || showConfig.showStoragePath"
+				class="headerUserBackend userBackend">
+				<div v-if="showConfig.showUserBackend" class="userBackend">
+					{{ t('settings', 'User backend') }}
+				</div>
+				<div v-if="showConfig.showStoragePath"
+					class="subtitle storageLocation">
+					{{ t('settings', 'Storage location') }}
+				</div>
+			</div>
+			<div v-if="showConfig.showLastLogin"
+				class="headerLastLogin lastLogin">
+				{{ t('settings', 'Last login') }}
+			</div>
+
+			<div class="userActions" />
+		</div>
 
 		<user-row v-for="(user, key) in filteredUsers"
 			:key="key"