dark mode update

This commit is contained in:
carodej
2020-07-09 10:56:17 +02:00
parent a43f0e6908
commit 5a9f5813c8
89 changed files with 1633 additions and 912 deletions

View File

@@ -11,38 +11,42 @@
<PageTitle
class="headline"
title="Contact Us"
description="Dominion, open bearing brought may dominion male beginning."
description="Do you have any questions? Get in touch with us."
></PageTitle>
<!--Content-->
<div class="page-content">
<ValidationObserver @submit.prevent="contactForm" ref="contactForm" v-slot="{ invalid }" tag="form"
class="form block-form">
<ValidationObserver v-if="! isSuccess" @submit.prevent="contactForm" ref="contactForm" v-slot="{ invalid }" tag="form"
class="form block-form">
<div class="block-wrapper">
<label>{{ $t('page_registration.label_email') }}</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="E-Mail" rules="required"
v-slot="{ errors }">
<input v-model="contact.email" :placeholder="$t('page_registration.placeholder_email')" type="email"
:class="{'is-error': errors[0]}"/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
<label>{{ $t('page_registration.label_email') }}</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="E-Mail" rules="required"
v-slot="{ errors }">
<input v-model="contact.email" :placeholder="$t('page_registration.placeholder_email')" type="email"
:class="{'is-error': errors[0]}"/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
<label>Message:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Message" rules="required"
v-slot="{ errors }">
<textarea v-model="contact.message" placeholder="Type your message here..." rows="4" :class="{'is-error': errors[0]}"></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
<label>Message:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Message" rules="required"
v-slot="{ errors }">
<textarea v-model="contact.message" placeholder="Type your message here..." rows="4" :class="{'is-error': errors[0]}"></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div>
<AuthButton class="submit-button" icon="chevron-right" text="Send Message" :loading="isLoading" :disabled="isLoading"/>
</div>
</ValidationObserver>
</div>
<InfoBox v-if="isError">
<p>Something went wrong, please try it again.</p>
</InfoBox>
<div>
<AuthButton class="submit-button" icon="chevron-right" text="Send Message" :loading="isLoading" :disabled="isLoading"/>
</div>
</ValidationObserver>
<InfoBox v-if="isSuccess">
<p>Your message was send successfully.</p>
</InfoBox>
</div>
<!--Footer-->
@@ -52,12 +56,12 @@
<script>
import {ValidationProvider, ValidationObserver} from 'vee-validate/dist/vee-validate.full'
import AuthButton from '@/components/Auth/AuthButton'
import {required} from 'vee-validate/dist/rules'
import PageTitle from '@/components/Index/Components/PageTitle'
import PageFooter from '@/components/Index/IndexPageFooter'
import Navigation from '@/components/Index/IndexNavigation'
import InfoBox from '@/components/Others/Forms/InfoBox'
import AuthButton from '@/components/Auth/AuthButton'
import {required} from 'vee-validate/dist/rules'
import {mapGetters} from 'vuex'
import axios from 'axios'
@@ -71,6 +75,7 @@
Navigation,
PageTitle,
required,
InfoBox,
},
computed: {
...mapGetters(['config']),
@@ -78,6 +83,8 @@
data() {
return {
isLoading: false,
isSuccess: false,
isError: false,
contact: {
email: '',
message: '',
@@ -97,59 +104,20 @@
// Send request to get user token
axios
.post('/api/user/register', this.register)
.post('/api/contact', this.contact)
.then(() => {
// End loading
this.isLoading = false
// Set login state
this.$store.commit('SET_AUTHORIZED', true)
// Go to files page
this.$router.push({name: 'Files'})
this.isSuccess = true
})
.catch(error => {
if (error.response.status == 401) {
if (error.response.data.error === 'invalid_client') {
events.$emit('alert:open', {
emoji: '🤔',
title: this.$t('popup_passport_error.title'),
message: this.$t('popup_passport_error.message')
})
}
}
if (error.response.status == 500) {
events.$emit('alert:open', {
emoji: '🤔',
title: this.$t('popup_signup_error.title'),
message: this.$t('popup_signup_error.message')
})
}
if (error.response.status == 422) {
if (error.response.data.errors['email']) {
this.$refs.sign_up.setErrors({
'E-Mail': error.response.data.errors['email']
});
}
if (error.response.data.errors['password']) {
this.$refs.sign_up.setErrors({
'Your New Password': error.response.data.errors['password']
});
}
}
// End loading
this.isLoading = false
this.isError = true
})
}
},
@@ -165,21 +133,15 @@
@import '@assets/vue-file-manager/_mixins';
@import '@assets/vue-file-manager/_forms';
.form {
max-width: 100%;
}
.headline {
padding-top: 70px;
padding-bottom: 50px;
}
.page-content {
p {
@include font-size(20);
font-weight: 500;
line-height: 1.65;
padding-bottom: 30px;
}
}
.form.block-form {
.submit-button {
@@ -193,7 +155,10 @@
}
@media only screen and (max-width: 690px) {
@media only screen and (max-width: 960px) {
.headline {
padding-top: 50px;
padding-bottom: 30px;
}
}
</style>