Browse Source

Merge pull request #2718 from nocodb/fix/signup-overflow

fix(gui-v2): overflow container on signin/signup forms
pull/2720/head
Pranav C 2 years ago committed by GitHub
parent
commit
1fd62fe6c0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 13
      packages/nc-gui-v2/assets/style-v2.css
  2. 13
      packages/nc-gui-v2/pages/projects/index.vue
  3. 10
      packages/nc-gui-v2/pages/signin.vue
  4. 4
      packages/nc-gui-v2/pages/signup.vue

13
packages/nc-gui-v2/assets/style-v2.css

@ -2,7 +2,18 @@ html,
body, body,
#__nuxt, #__nuxt,
.v-application__wrap { .v-application__wrap {
@apply m-0 h-[100vh] w-[100vw] bg-white dark:(bg-black text-white); @apply m-0 h-full w-full bg-white dark:(bg-black text-white);
}
.v-main {
@apply w-full h-full;
overflow: hidden;
flex: unset !important;
}
.v-main .v-main__wrap {
@apply flex-0 w-full relative scrollbar-thin-primary;
overflow-x: hidden;
} }
nav, nav,

13
packages/nc-gui-v2/pages/projects/index.vue

@ -130,16 +130,3 @@ const activePage = $ref(navDrawerOptions[0].title)
</v-container> </v-container>
</NuxtLayout> </NuxtLayout>
</template> </template>
<style scoped>
.v-main {
@apply w-full;
overflow: hidden;
flex: unset !important;
}
:deep(.v-main__wrap) {
@apply flex-0 w-full relative scrollbar-thin-primary;
overflow-x: hidden;
}
</style>

10
packages/nc-gui-v2/pages/signin.vue

@ -120,13 +120,13 @@ const resetError = () => {
@focus="resetError" @focus="resetError"
/> />
<div class="self-end"> <div class="hidden md:block self-end mx-8">
<nuxt-link class="prose-sm text-primary underline hover:opacity-75" to="/forgot-password"> <nuxt-link class="prose-sm text-primary underline hover:opacity-75" to="/forgot-password">
{{ $t('msg.info.signUp.forgotPassword') }} {{ $t('msg.info.signUp.forgotPassword') }}
</nuxt-link> </nuxt-link>
</div> </div>
<div class="self-center flex items-center justify-between w-100"> <div class="self-center flex flex-wrap gap-4 items-center mt-4 md:mx-8 md:justify-between justify-center w-full">
<button <button
:disabled="!valid" :disabled="!valid"
:class="[ :class="[
@ -143,6 +143,12 @@ const resetError = () => {
{{ $t('msg.info.signUp.dontHaveAccount') }} {{ $t('msg.info.signUp.dontHaveAccount') }}
<nuxt-link class="text-primary underline hover:opacity-75" to="/signup">{{ $t('general.signUp') }}</nuxt-link> <nuxt-link class="text-primary underline hover:opacity-75" to="/signup">{{ $t('general.signUp') }}</nuxt-link>
</div> </div>
<div class="prose-sm md:hidden">
<nuxt-link class="prose-sm text-primary underline hover:opacity-75" to="/forgot-password">
{{ $t('msg.info.signUp.forgotPassword') }}
</nuxt-link>
</div>
</div> </div>
</div> </div>
</div> </div>

4
packages/nc-gui-v2/pages/signup.vue

@ -64,7 +64,7 @@ const resetError = () => {
<v-form <v-form
ref="formValidator" ref="formValidator"
v-model="valid" v-model="valid"
class="h-full min-h-[600px] flex justify-center items-center" class="h-[calc(100%_+_90px)] min-h-[600px] flex justify-center items-center"
@submit.prevent="signUp" @submit.prevent="signUp"
> >
<div class="h-full w-full flex flex-col flex-wrap justify-center items-center"> <div class="h-full w-full flex flex-col flex-wrap justify-center items-center">
@ -112,7 +112,7 @@ const resetError = () => {
<v-text-field <v-text-field
id="password_repeat" id="password_repeat"
v-model="form.password" v-model="form.passwordRepeat"
class="bg-white dark:!bg-gray-900" class="bg-white dark:!bg-gray-900"
:rules="formRules.passwordRepeat" :rules="formRules.passwordRepeat"
:label="`Repeat ${$t('labels.password')}`" :label="`Repeat ${$t('labels.password')}`"

Loading…
Cancel
Save