Merge branch 'master' of github.com:gradido/gradido into 1697-refactor-thx-page-#2

2025-12-13 07:45:54 +00:00 · 2022-05-30 12:06:35 +02:00 · 2022-05-30 12:06:35 +02:00 · 2b715fe338
commit 2b715fe338
parent cd398cce9f afde83e2cb
35 changed files with 153 additions and 429 deletions
--- a/backend/src/graphql/arg/UpdateUserInfosArgs.ts
+++ b/backend/src/graphql/arg/UpdateUserInfosArgs.ts
@ -19,7 +19,4 @@ export default class UpdateUserInfosArgs {

  @Field({ nullable: true })
  passwordNew?: string
-
-  @Field({ nullable: true })
-  coinanimation?: boolean
 }
--- a/backend/src/graphql/enum/Setting.ts
+++ b/backend/src/graphql/enum/Setting.ts
@ -1,5 +0,0 @@
-enum Setting {
-  COIN_ANIMATION = 'coinanimation',
-}
-
-export { Setting }
--- a/backend/src/graphql/model/User.ts
+++ b/backend/src/graphql/model/User.ts
@ -15,8 +15,6 @@ export class User {
    this.language = user.language
    this.publisherId = user.publisherId
    this.isAdmin = user.isAdmin
-    // TODO
-    this.coinanimation = null
    this.klickTipp = null
    this.hasElopage = null
  }
@ -61,11 +59,6 @@ export class User {
  @Field(() => Date, { nullable: true })
  isAdmin: Date | null

-  // TODO this is a bit inconsistent with what we query from the database
-  // therefore all those fields are now nullable with default value null
-  @Field(() => Boolean, { nullable: true })
-  coinanimation: boolean | null
-
  @Field(() => KlickTipp, { nullable: true })
  klickTipp: KlickTipp | null

--- a/backend/src/graphql/resolver/UserResolver.test.ts
+++ b/backend/src/graphql/resolver/UserResolver.test.ts
@ -344,7 +344,6 @@ describe('UserResolver', () => {
          expect.objectContaining({
            data: {
              login: {
-                coinanimation: true,
                email: 'bibi@bloxberg.de',
                firstName: 'Bibi',
                hasElopage: false,
@ -479,7 +478,6 @@ describe('UserResolver', () => {
                  firstName: 'Bibi',
                  lastName: 'Bloxberg',
                  language: 'de',
-                  coinanimation: true,
                  klickTipp: {
                    newsletterState: false,
                  },
--- a/backend/src/graphql/resolver/UserResolver.ts
+++ b/backend/src/graphql/resolver/UserResolver.ts
@ -3,7 +3,7 @@ import { backendLogger as logger } from '@/server/logger'

 import { Context, getUser } from '@/server/context'
 import { Resolver, Query, Args, Arg, Authorized, Ctx, UseMiddleware, Mutation } from 'type-graphql'
-import { getConnection, getCustomRepository } from '@dbTools/typeorm'
+import { getConnection } from '@dbTools/typeorm'
 import CONFIG from '@/config'
 import { User } from '@model/User'
 import { User as DbUser } from '@entity/User'
@ -13,8 +13,6 @@ import CreateUserArgs from '@arg/CreateUserArgs'
 import UnsecureLoginArgs from '@arg/UnsecureLoginArgs'
 import UpdateUserInfosArgs from '@arg/UpdateUserInfosArgs'
 import { klicktippNewsletterStateMiddleware } from '@/middleware/klicktippMiddleware'
-import { UserSettingRepository } from '@repository/UserSettingRepository'
-import { Setting } from '@enum/Setting'
 import { OptInType } from '@enum/OptInType'
 import { LoginEmailOptIn } from '@entity/LoginEmailOptIn'
 import { sendResetPasswordEmail as sendResetPasswordEmailMailer } from '@/mailer/sendResetPasswordEmail'
@ -228,15 +226,6 @@ export class UserResolver {
    // Elopage Status & Stored PublisherId
    user.hasElopage = await this.hasElopage(context)

-    // coinAnimation
-    const userSettingRepository = getCustomRepository(UserSettingRepository)
-    const coinanimation = await userSettingRepository
-      .readBoolean(userEntity.id, Setting.COIN_ANIMATION)
-      .catch((error) => {
-        logger.error('error:', error)
-        throw new Error(error)
-      })
-    user.coinanimation = coinanimation
    logger.debug(`verifyLogin... successful: ${user.firstName}.${user.lastName}, ${user.email}`)
    return user
  }
@ -294,15 +283,6 @@ export class UserResolver {
      DbUser.save(dbUser)
    }

-    // coinAnimation
-    const userSettingRepository = getCustomRepository(UserSettingRepository)
-    const coinanimation = await userSettingRepository
-      .readBoolean(dbUser.id, Setting.COIN_ANIMATION)
-      .catch((error) => {
-        throw new Error(error)
-      })
-    user.coinanimation = coinanimation
-
    context.setHeaders.push({
      key: 'token',
      value: encode(dbUser.pubKey),
@ -598,12 +578,10 @@ export class UserResolver {
  @Mutation(() => Boolean)
  async updateUserInfos(
    @Args()
-    { firstName, lastName, language, password, passwordNew, coinanimation }: UpdateUserInfosArgs,
+    { firstName, lastName, language, password, passwordNew }: UpdateUserInfosArgs,
    @Ctx() context: Context,
  ): Promise<boolean> {
-    logger.info(
-      `updateUserInfos(${firstName}, ${lastName}, ${language}, ***, ***, ${coinanimation})...`,
-    )
+    logger.info(`updateUserInfos(${firstName}, ${lastName}, ${language}, ***, ***)...`)
    const userEntity = getUser(context)

    if (firstName) {
@ -655,15 +633,6 @@ export class UserResolver {
    await queryRunner.startTransaction('READ UNCOMMITTED')

    try {
-      if (coinanimation !== null && coinanimation !== undefined) {
-        queryRunner.manager
-          .getCustomRepository(UserSettingRepository)
-          .setOrUpdate(userEntity.id, Setting.COIN_ANIMATION, coinanimation.toString())
-          .catch((error) => {
-            throw new Error('error saving coinanimation: ' + error)
-          })
-      }
-
      await queryRunner.manager.save(userEntity).catch((error) => {
        throw new Error('error saving user: ' + error)
      })
--- a/backend/src/seeds/graphql/mutations.ts
+++ b/backend/src/seeds/graphql/mutations.ts
@ -31,7 +31,6 @@ export const updateUserInfos = gql`
    $password: String
    $passwordNew: String
    $locale: String
-    $coinanimation: Boolean
  ) {
    updateUserInfos(
      firstName: $firstName
@ -39,7 +38,6 @@ export const updateUserInfos = gql`
      password: $password
      passwordNew: $passwordNew
      language: $locale
-      coinanimation: $coinanimation
    )
  }
 `
--- a/backend/src/seeds/graphql/queries.ts
+++ b/backend/src/seeds/graphql/queries.ts
@ -8,7 +8,6 @@ export const login = gql`
      firstName
      lastName
      language
-      coinanimation
      klickTipp {
        newsletterState
      }
@ -26,7 +25,6 @@ export const verifyLogin = gql`
      firstName
      lastName
      language
-      coinanimation
      klickTipp {
        newsletterState
      }
--- a/backend/src/typeorm/repository/UserSettingRepository.ts
+++ b/backend/src/typeorm/repository/UserSettingRepository.ts
@ -1,33 +1,22 @@
 import { EntityRepository, Repository } from '@dbTools/typeorm'
 import { UserSetting } from '@entity/UserSetting'
-import { Setting } from '@enum/Setting'
 import { isStringBoolean } from '@/util/validate'

@EntityRepository(UserSetting)
 export class UserSettingRepository extends Repository<UserSetting> {
-  async setOrUpdate(userId: number, key: Setting, value: string): Promise<UserSetting> {
-    switch (key) {
-      case Setting.COIN_ANIMATION:
-        if (!isStringBoolean(value)) {
-          throw new Error("coinanimation value isn't boolean")
-        }
-        break
-      default:
-        throw new Error("key isn't defined: " + key)
-    }
-    let entity = await this.findOne({ userId: userId, key: key })
+  async setOrUpdate(userId: number, value: string): Promise<UserSetting> {
+    let entity = await this.findOne({ userId: userId })

    if (!entity) {
      entity = new UserSetting()
      entity.userId = userId
-      entity.key = key
    }
    entity.value = value
    return this.save(entity)
  }

-  async readBoolean(userId: number, key: Setting): Promise<boolean> {
-    const entity = await this.findOne({ userId: userId, key: key })
+  async readBoolean(userId: number): Promise<boolean> {
+    const entity = await this.findOne({ userId: userId })
    if (!entity || !isStringBoolean(entity.value)) {
      return true
    }
--- a/docu/Style/Images/Bild_1_2400.jpg
+++ b/docu/Style/Images/Bild_1_2400.jpg
--- a/frontend/public/img/template/Foto_01_2400_small.jpg
+++ b/frontend/public/img/template/Foto_01_2400_small.jpg
--- a/frontend/public/img/template/Foto_02_2400_small.jpg
+++ b/frontend/public/img/template/Foto_02_2400_small.jpg
--- a/frontend/public/img/template/Foto_03_2400_small.jpg
+++ b/frontend/public/img/template/Foto_03_2400_small.jpg
--- a/frontend/public/img/template/Foto_04_2400_small.jpg
+++ b/frontend/public/img/template/Foto_04_2400_small.jpg
--- a/frontend/src/assets/scss/gradido-template.scss
+++ b/frontend/src/assets/scss/gradido-template.scss
@ -17,10 +17,17 @@ body {

 /* Navbar  */
 a,
-.navbar-light .navbar-nav .nav-link {
+.navbar-light,
+.navbar-nav,
+.nav-link {
  color: #047006;
 }

+a:hover,
+.nav-link:hover {
+  color: #383838 !important;
+}
+
 .navbar-light .navbar-nav .nav-link.active {
  color: rgb(35 121 188 / 90%);
 }
@ -36,31 +43,58 @@ a,
 /* Button */
 .btn {
  border-radius: 25px;
-  padding-right: 50px;
-  padding-left: 50px;
 }

 .btn-gradido {
-  background-image: linear-gradient(146deg, rgb(220 167 44) 50%, rgb(197 141 56 / 100%) 100%);
-  background-size: auto;
-  background-position: 0% 0%;
-  background-repeat: repeat;
-  border-style: none;
-  box-shadow: 10px 10px 50px 10px rgb(56 56 56 / 31%);
+  display: inline-block;
+  padding: 0.6em 3em;
+  letter-spacing: 0.05em;
  color: #fff;
+  transition: all 0.5s ease;
+  background: rgb(249 205 105);
+  background: linear-gradient(135deg, rgb(249 205 105 / 100%) 2%, rgb(197 141 56 / 100%) 55%);
+  box-shadow: rgb(0 0 0 / 40%) 0 30px 90px;
+  border-radius: 26px;
+  padding-right: 50px;
+  padding-left: 50px;
+  border-style: none;
 }

 .btn-gradido:hover {
-  color: #212529;
+  color: #fff;
+  box-shadow: 0 5px 10px rgb(0 0 0 / 20%);
 }

 .btn-gradido:focus {
  outline: none;
 }

+.btn-gradido-disable {
+  padding: 0.6em 3em;
+  letter-spacing: 0.05em;
+  color: #fff;
+  transition: all 0.5s ease;
+  background: rgb(97 97 97);
+  background: linear-gradient(135deg, rgb(180 180 180 / 100%) 46%, rgb(180 180 180 / 100%) 99%);
+  box-shadow: rgb(0 0 0 / 40%) 0 30px 90px;
+  border-radius: 26px;
+  padding-right: 50px;
+  padding-left: 50px;
+  border-style: none;
+}
+
+.btn-gradido-disable:hover {
+  color: #fff;
+}
+
 .btn-outline-gradido {
  color: rgb(140 121 88);
  border: 1px solid #f5b805;
+  box-shadow: 10px 10px 50px 10px rgb(56 56 56 / 31%);
+}
+
+.btn-outline-gradido:hover {
+  box-shadow: 10px 10px 50px 10px rgb(56 56 56 / 0%);
 }

 .form-control,
--- a/frontend/src/components/Auth/AuthCarousel.vue
+++ b/frontend/src/components/Auth/AuthCarousel.vue
@ -1,10 +1,9 @@
 <template>
  <div>
-    <b-carousel :interval="3000">
+    <b-carousel :interval="13000">
      <b-carousel-slide img-src="/img/template/Foto_01_2400_small.jpg"></b-carousel-slide>
      <b-carousel-slide img-src="/img/template/Foto_02_2400_small.jpg"></b-carousel-slide>
      <b-carousel-slide img-src="/img/template/Foto_03_2400_small.jpg"></b-carousel-slide>
-      <b-carousel-slide img-src="/img/template/Foto_04_2400_small.jpg"></b-carousel-slide>
    </b-carousel>
  </div>
 </template>
@ -25,5 +24,10 @@ export default {
 .carousel-inner {
  height: 100%;
  border-radius: 0% 49% 49% 0% / 0% 51% 49% 0%;
+  -webkit-border-radius: 0% 49% 49% 0% / 0% 51% 49% 0%;
+  backface-visibility: hidden;
+  -webkit-backface-visibility: hidden;
+  transform: translate3d(0, 0, 0);
+  -webkit-transform: translate3d(0, 0, 0);
 }
 </style>
--- a/frontend/src/components/Auth/AuthFooter.vue
+++ b/frontend/src/components/Auth/AuthFooter.vue
@ -0,0 +1,61 @@
+<template>
+  <footer class="footer">
+    <b-row class="mt-lg-7 mt-md-6 mt-4">
+      <b-col class="col-12 col-md-12 col-lg-6">
+        <div
+          class="d-flex justify-content-center justify-content-md-center justify-content-lg-start ml-3"
+        >
+          <b-nav class="nav-footer">
+            <b-nav-item :href="`https://gradido.net/${$i18n.locale}/impressum/`" target="_blank">
+              {{ $t('footer.imprint') }}
+            </b-nav-item>
+            <b-nav-item :href="`https://gradido.net/${$i18n.locale}/datenschutz/`" target="_blank">
+              {{ $t('footer.privacy_policy') }}
+            </b-nav-item>
+          </b-nav>
+        </div>
+      </b-col>
+      <b-col class="col-12 col-md-12 col-lg-6 mt-4 mb-4 mt-lg-0 mb-lg-0">
+        <div class="text-center ml-3 ml-lg-0 text-lg-right pt-1">
+          {{ $t('followUs') }}
+          <b-link href="https://www.facebook.com/groups/Gradido/" target="_blank">
+            <b-icon-facebook class="ml-3 mr-3" font-scale="1"></b-icon-facebook>
+          </b-link>
+          <b-link href="https://twitter.com/gradido" target="_blank">
+            <b-icon-twitter class="mr-3" font-scale="1"></b-icon-twitter>
+          </b-link>
+          <b-link href="https://www.youtube.com/c/GradidoNet" target="_blank">
+            <b-icon-youtube class="mr-3" font-scale="1"></b-icon-youtube>
+          </b-link>
+
+          <b-link href="https://t.me/Gradido" target="_blank">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              width="16"
+              height="16"
+              fill="currentColor"
+              class="bi bi-telegram"
+              viewBox="0 0 16 16"
+            >
+              <path
+                d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8.287 5.906c-.778.324-2.334.994-4.666 2.01-.378.15-.577.298-.595.442-.03.243.275.339.69.47l.175.055c.408.133.958.288 1.243.294.26.006.549-.1.868-.32 2.179-1.471 3.304-2.214 3.374-2.23.05-.012.12-.026.166.016.047.041.042.12.037.141-.03.129-1.227 1.241-1.846 1.817-.193.18-.33.307-.358.336a8.154 8.154 0 0 1-.188.186c-.38.366-.664.64.015 1.088.327.216.589.393.85.571.284.194.568.387.936.629.093.06.183.125.27.187.331.236.63.448.997.414.214-.02.435-.22.547-.82.265-1.417.786-4.486.906-5.751a1.426 1.426 0 0 0-.013-.315.337.337 0 0 0-.114-.217.526.526 0 0 0-.31-.093c-.3.005-.763.166-2.984 1.09z"
+              />
+            </svg>
+          </b-link>
+        </div>
+      </b-col>
+    </b-row>
+  </footer>
+</template>
+
+<script>
+export default {
+  name: 'AuthFooter',
+}
+</script>
+
+<style>
+.bi-telegram {
+  margin-top: -5px;
+}
+</style>
--- a/frontend/src/components/Auth/AuthMobileStart.vue
+++ b/frontend/src/components/Auth/AuthMobileStart.vue
--- a/frontend/src/components/Auth/AuthNavbar.vue
+++ b/frontend/src/components/Auth/AuthNavbar.vue
--- a/frontend/src/components/Auth/AuthNavbarSmall.vue
+++ b/frontend/src/components/Auth/AuthNavbarSmall.vue
@ -12,6 +12,6 @@

 <script>
 export default {
-  name: 'NavbarSmall',
+  name: 'AuthNavbarSmall',
 }
 </script>
--- a/frontend/src/components/Auth/Footer.vue
+++ b/frontend/src/components/Auth/Footer.vue
@ -1,53 +0,0 @@
-<template>
-  <footer class="footer bg-transparent">
-    <b-row class="mt-lg-7 mt-md-6 mt-4">
-      <b-col class="col-12 col-md-12 col-lg-6">
-        <div
-          class="d-flex justify-content-center justify-content-md-center justify-content-lg-start ml-3"
-        >
-          <b-nav class="nav-footer">
-            <b-nav-item :href="`https://gradido.net/${$i18n.locale}/impressum/`" target="_blank">
-              {{ $t('footer.imprint') }}
-            </b-nav-item>
-            <b-nav-item :href="`https://gradido.net/${$i18n.locale}/datenschutz/`" target="_blank">
-              {{ $t('footer.privacy_policy') }}
-            </b-nav-item>
-          </b-nav>
-        </div>
-      </b-col>
-      <b-col class="col-12 col-md-12 col-lg-6 mt-4 mb-4 mt-lg-0 mb-lg-0">
-        <div class="text-center ml-3 ml-lg-0 text-lg-right">
-          {{ $t('followUs') }}
-          <b-icon-facebook class="ml-3 mr-3" font-scale="1"></b-icon-facebook>
-          <b-icon-twitter class="mr-3" font-scale="1"></b-icon-twitter>
-          <b-icon-youtube class="mr-3" font-scale="1"></b-icon-youtube>
-
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            width="16"
-            height="16"
-            fill="currentColor"
-            class="bi bi-telegram"
-            viewBox="0 0 16 16"
-          >
-            <path
-              d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8.287 5.906c-.778.324-2.334.994-4.666 2.01-.378.15-.577.298-.595.442-.03.243.275.339.69.47l.175.055c.408.133.958.288 1.243.294.26.006.549-.1.868-.32 2.179-1.471 3.304-2.214 3.374-2.23.05-.012.12-.026.166.016.047.041.042.12.037.141-.03.129-1.227 1.241-1.846 1.817-.193.18-.33.307-.358.336a8.154 8.154 0 0 1-.188.186c-.38.366-.664.64.015 1.088.327.216.589.393.85.571.284.194.568.387.936.629.093.06.183.125.27.187.331.236.63.448.997.414.214-.02.435-.22.547-.82.265-1.417.786-4.486.906-5.751a1.426 1.426 0 0 0-.013-.315.337.337 0 0 0-.114-.217.526.526 0 0 0-.31-.093c-.3.005-.763.166-2.984 1.09z"
-            />
-          </svg>
-        </div>
-      </b-col>
-    </b-row>
-  </footer>
-</template>
-
-<script>
-export default {
-  name: 'AuthFooter',
-}
-</script>
-
-<style>
-.bi-telegram {
-  margin-top: -5px;
-}
-</style>
--- a/frontend/src/components/UserSettings/UserCoinAnimation.spec.js
+++ b/frontend/src/components/UserSettings/UserCoinAnimation.spec.js
@ -1,127 +0,0 @@
-import { mount } from '@vue/test-utils'
-import UserCoinAnimation from './UserCoinAnimation'
-import { updateUserInfos } from '@/graphql/mutations'
-
-import { toastErrorSpy, toastSuccessSpy } from '@test/testSetup'
-
-const localVue = global.localVue
-
-const mockAPIcall = jest.fn()
-
-const storeCommitMock = jest.fn()
-
-describe('UserCard_CoinAnimation', () => {
-  let wrapper
-
-  const mocks = {
-    $t: jest.fn((t) => t),
-    $store: {
-      state: {
-        language: 'de',
-        coinanimation: true,
-      },
-      commit: storeCommitMock,
-    },
-    $apollo: {
-      mutate: mockAPIcall,
-    },
-  }
-
-  const Wrapper = () => {
-    return mount(UserCoinAnimation, { localVue, mocks })
-  }
-
-  describe('mount', () => {
-    beforeEach(() => {
-      jest.clearAllMocks()
-      wrapper = Wrapper()
-    })
-
-    it('renders the component', () => {
-      expect(wrapper.find('div#formusercoinanimation').exists()).toBeTruthy()
-    })
-
-    it('has an edit BFormCheckbox switch', () => {
-      expect(wrapper.find('.Test-BFormCheckbox').exists()).toBeTruthy()
-    })
-
-    describe('enable with success', () => {
-      beforeEach(async () => {
-        await wrapper.setData({ CoinAnimationStatus: false })
-        mockAPIcall.mockResolvedValue({
-          data: {
-            updateUserInfos: {
-              validValues: 1,
-            },
-          },
-        })
-        await wrapper.find('input').setChecked()
-      })
-
-      it('calls the updateUserInfos mutation', () => {
-        expect(mockAPIcall).toBeCalledWith({
-          mutation: updateUserInfos,
-          variables: {
-            coinanimation: true,
-          },
-        })
-      })
-
-      it('updates the store', () => {
-        expect(storeCommitMock).toBeCalledWith('coinanimation', true)
-      })
-
-      it('toasts a success message', () => {
-        expect(toastSuccessSpy).toBeCalledWith('settings.coinanimation.True')
-      })
-    })
-
-    describe('disable with success', () => {
-      beforeEach(async () => {
-        await wrapper.setData({ CoinAnimationStatus: true })
-        mockAPIcall.mockResolvedValue({
-          data: {
-            updateUserInfos: {
-              validValues: 1,
-            },
-          },
-        })
-        await wrapper.find('input').setChecked(false)
-      })
-
-      it('calls the subscribe mutation', () => {
-        expect(mockAPIcall).toBeCalledWith({
-          mutation: updateUserInfos,
-          variables: {
-            coinanimation: false,
-          },
-        })
-      })
-
-      it('updates the store', () => {
-        expect(storeCommitMock).toBeCalledWith('coinanimation', false)
-      })
-
-      it('toasts a success message', () => {
-        expect(toastSuccessSpy).toBeCalledWith('settings.coinanimation.False')
-      })
-    })
-
-    describe('disable with server error', () => {
-      beforeEach(() => {
-        mockAPIcall.mockRejectedValue({
-          message: 'Ouch',
-        })
-        wrapper.find('input').trigger('change')
-      })
-
-      it('resets the CoinAnimationStatus', () => {
-        expect(wrapper.vm.CoinAnimationStatus).toBeTruthy()
-      })
-
-      it('toasts an error message', () => {
-        expect(toastErrorSpy).toBeCalledWith('Ouch')
-      })
-    })
-  })
-})
--- a/frontend/src/components/UserSettings/UserCoinAnimation.vue
+++ b/frontend/src/components/UserSettings/UserCoinAnimation.vue
@ -1,65 +0,0 @@
-<template>
-  <b-card
-    id="formusercoinanimation"
-    class="bg-transparent gradido-custom-background gradido-no-border-radius"
-  >
-    <div>
-      <b-row class="mb-3">
-        <b-col class="mb-2 col-12">
-          <small>
-            <b>{{ $t('settings.coinanimation.coinanimation') }}</b>
-          </small>
-        </b-col>
-        <b-col class="col-12">
-          <b-form-checkbox
-            class="Test-BFormCheckbox"
-            v-model="CoinAnimationStatus"
-            name="check-button"
-            switch
-            @change="onSubmit"
-          >
-            {{
-              CoinAnimationStatus
-                ? $t('settings.coinanimation.True')
-                : $t('settings.coinanimation.False')
-            }}
-          </b-form-checkbox>
-        </b-col>
-      </b-row>
-    </div>
-  </b-card>
-</template>
-<script>
-import { updateUserInfos } from '@/graphql/mutations'
-export default {
-  name: 'UserCoinAnimation',
-  data() {
-    return {
-      CoinAnimationStatus: this.$store.state.coinanimation,
-    }
-  },
-  methods: {
-    async onSubmit() {
-      this.$apollo
-        .mutate({
-          mutation: updateUserInfos,
-          variables: {
-            coinanimation: this.CoinAnimationStatus,
-          },
-        })
-        .then(() => {
-          this.$store.commit('coinanimation', this.CoinAnimationStatus)
-          this.toastSuccess(
-            this.CoinAnimationStatus
-              ? this.$t('settings.coinanimation.True')
-              : this.$t('settings.coinanimation.False'),
-          )
-        })
-        .catch((error) => {
-          this.CoinAnimationStatus = this.$store.state.coinanimation
-          this.toastError(error.message)
-        })
-    },
-  },
-}
-</script>
--- a/frontend/src/graphql/mutations.js
+++ b/frontend/src/graphql/mutations.js
@ -31,7 +31,6 @@ export const updateUserInfos = gql`
    $password: String
    $passwordNew: String
    $locale: String
-    $coinanimation: Boolean
  ) {
    updateUserInfos(
      firstName: $firstName
@ -39,7 +38,6 @@ export const updateUserInfos = gql`
      password: $password
      passwordNew: $passwordNew
      language: $locale
-      coinanimation: $coinanimation
    )
  }
 `
--- a/frontend/src/graphql/queries.js
+++ b/frontend/src/graphql/queries.js
@ -7,7 +7,6 @@ export const login = gql`
      firstName
      lastName
      language
-      coinanimation
      klickTipp {
        newsletterState
      }
@ -25,7 +24,6 @@ export const verifyLogin = gql`
      firstName
      lastName
      language
-      coinanimation
      klickTipp {
        newsletterState
      }
--- a/frontend/src/layouts/AuthLayout.spec.js
+++ b/frontend/src/layouts/AuthLayout.spec.js
@ -43,6 +43,10 @@ describe('AuthLayout', () => {
      it('has Component AuthMobileStart', () => {
        expect(wrapper.findComponent({ name: 'AuthMobileStart' }).exists()).toBe(true)
      })
+
+      it('has Component AuthNavbarSmall', () => {
+        expect(wrapper.findComponent({ name: 'AuthNavbarSmall' }).exists()).toBe(true)
+      })
    })

    describe('Desktop Version Start', () => {
--- a/frontend/src/layouts/AuthLayout.vue
+++ b/frontend/src/layouts/AuthLayout.vue
@ -1,16 +1,16 @@
 <template>
  <div class="auth-template">
-    <mobile-start
+    <auth-mobile-start
      v-if="mobileStart"
      class="d-inline d-lg-none zindex10000"
      @set-mobile-start="setMobileStart"
    />
    <div class="h-100 align-middle">
-      <navbar class="zindex10" />
+      <auth-navbar class="zindex10" />

      <div class="left-content-box position-fixed d-none d-lg-block">
        <div class="bg-img-box position-absolute w-100">
-          <carousel class="carousel" />
+          <auth-carousel class="carousel" />
        </div>
        <div class="bg-txt-box position-relative d-none d-lg-block text-center align-self-center">
          <div class="h0 text-white">{{ $t('auth.left.gratitude') }}</div>
@ -24,7 +24,7 @@
          <div class="right-content-box ml-3 ml-sm-4 mr-3 mr-sm-4">
            <b-row class="d-none d-md-block d-lg-none">
              <b-col class="mb--4 d-flex justify-content-end">
-                <navbar-small />
+                <auth-navbar-small />
              </b-col>
            </b-row>
            <b-row class="mt-5 pl-2 pl-md-0 pl-lg-0">
@ -67,7 +67,7 @@
                  <b-avatar src="/img/brand/gradido_coin●.png" size="6rem"></b-avatar>
                  <b-row>
                    <b-col class="zindex1000 d-flex justify-content-center">
-                      <navbar-small />
+                      <auth-navbar-small />
                    </b-col>
                  </b-row>
                </b-col>
@ -77,7 +77,7 @@
              </b-card-body>
            </b-card>
          </div>
-          <auth-footer v-if="!$route.meta.hideFooter" class="pr-5"></auth-footer>
+          <auth-footer v-if="!$route.meta.hideFooter" class="pr-5 mb-5"></auth-footer>
        </b-col>
      </b-row>
      <!-- <auth-layout-gdd />-->
@ -86,21 +86,21 @@
 </template>

 <script>
-import MobileStart from '@/components/Auth/MobileStart.vue'
-import Navbar from '@/components/Auth/Navbar.vue'
-import NavbarSmall from '@/components/Auth/NavbarSmall.vue'
-import Carousel from '@/components/Auth/Carousel.vue'
+import AuthMobileStart from '@/components/Auth/AuthMobileStart.vue'
+import AuthNavbar from '@/components/Auth/AuthNavbar.vue'
+import AuthNavbarSmall from '@/components/Auth/AuthNavbarSmall.vue'
+import AuthCarousel from '@/components/Auth/AuthCarousel.vue'
 import LanguageSwitch from '@/components/LanguageSwitch2'
-import AuthFooter from '@/components/Auth/Footer.vue'
+import AuthFooter from '@/components/Auth/AuthFooter.vue'
 import CONFIG from '@/config'

 export default {
  name: 'AuthLayout',
  components: {
-    MobileStart,
-    Navbar,
-    NavbarSmall,
-    Carousel,
+    AuthMobileStart,
+    AuthNavbar,
+    AuthNavbarSmall,
+    AuthCarousel,
    LanguageSwitch,
    AuthFooter,
  },
--- a/frontend/src/locales/de.json
+++ b/frontend/src/locales/de.json
@ -186,11 +186,6 @@
  "send_gdd": "GDD versenden",
  "send_per_link": "GDD versenden per Link",
  "settings": {
-    "coinanimation": {
-      "coinanimation": "Münzanimation",
-      "False": "Münzanimation ausgeschaltet",
-      "True": "Münzanimation eingeschaltet"
-    },
    "language": {
      "changeLanguage": "Sprache ändern",
      "de": "Deutsch",
--- a/frontend/src/locales/en.json
+++ b/frontend/src/locales/en.json
@ -186,11 +186,6 @@
  "send_gdd": "GDD send",
  "send_per_link": "GDD send via link",
  "settings": {
-    "coinanimation": {
-      "coinanimation": "Coin animation",
-      "False": "Coin animation disabled",
-      "True": "Coin animation enabled"
-    },
    "language": {
      "changeLanguage": "Change language",
      "de": "Deutsch",
--- a/frontend/src/pages/Profile.spec.js
+++ b/frontend/src/pages/Profile.spec.js
@ -38,9 +38,5 @@ describe('Profile', () => {
    it('has a user change newsletter form', () => {
      expect(wrapper.findComponent({ name: 'UserNewsletter' }).exists()).toBeTruthy()
    })
-
-    it('has a user change coin animation form', () => {
-      expect(wrapper.findComponent({ name: 'UserCoinAnimation' }).exists()).toBeTruthy()
-    })
  })
 })
--- a/frontend/src/pages/Profile.vue
+++ b/frontend/src/pages/Profile.vue
@ -8,8 +8,6 @@
    <user-language />
    <hr />
    <user-newsletter />
-    <hr />
-    <user-coin-animation />
  </div>
 </template>
 <script>
@ -18,7 +16,6 @@ import UserData from '@/components/UserSettings/UserData.vue'
 import UserPassword from '@/components/UserSettings/UserPassword.vue'
 import UserLanguage from '@/components/UserSettings/UserLanguage.vue'
 import UserNewsletter from '@/components/UserSettings/UserNewsletter.vue'
-import UserCoinAnimation from '@/components/UserSettings/UserCoinAnimation.vue'

 export default {
  name: 'Profile',
@ -28,7 +25,6 @@ export default {
    UserPassword,
    UserLanguage,
    UserNewsletter,
-    UserCoinAnimation,
  },
  props: {
    balance: { type: Number, default: 0 },
--- a/frontend/src/pages/Register.spec.js
+++ b/frontend/src/pages/Register.spec.js
@ -68,15 +68,6 @@ describe('Register', () => {
        expect(wrapper.find('#Email-input-field').exists()).toBe(true)
      })

-      it('has Language selected field', () => {
-        expect(wrapper.find('.selectedLanguage').exists()).toBe(true)
-      })
-
-      it('selects Language value en', async () => {
-        wrapper.find('.selectedLanguage').findAll('option').at(1).setSelected()
-        expect(wrapper.find('.selectedLanguage').element.value).toBe('en')
-      })
-
      it('has 1 checkbox input fields', () => {
        expect(wrapper.find('#registerCheckbox').exists()).toBe(true)
      })
@ -114,7 +105,6 @@ describe('Register', () => {
      beforeEach(() => {
        wrapper.find('#registerFirstname').setValue('Max')
        wrapper.find('#registerLastname').setValue('Mustermann')
-        wrapper.find('.language-switch-select').findAll('option').at(1).setSelected()
      })
      it('has disabled submit button when missing input checked box', () => {
        wrapper.find('#Email-input-field').setValue('max.mustermann@gradido.net')
@ -132,7 +122,6 @@ describe('Register', () => {
        wrapper.find('#registerFirstname').setValue('Max')
        wrapper.find('#registerLastname').setValue('Mustermann')
        wrapper.find('#Email-input-field').setValue('max.mustermann@gradido.net')
-        wrapper.find('.language-switch-select').findAll('option').at(1).setSelected()
        wrapper.find('#registerCheckbox').setChecked()
      })

@ -241,7 +230,6 @@ describe('Register', () => {
        wrapper.find('#registerFirstname').setValue('Max')
        wrapper.find('#registerLastname').setValue('Mustermann')
        wrapper.find('#Email-input-field').setValue('max.mustermann@gradido.net')
-        wrapper.find('.language-switch-select').findAll('option').at(1).setSelected()
        wrapper.find('#registerCheckbox').setChecked()
        await wrapper.find('form').trigger('submit')
        await flushPromises()
--- a/frontend/src/pages/Register.vue
+++ b/frontend/src/pages/Register.vue
@ -61,11 +61,7 @@
            </b-col>
          </b-row>
          <b-row>
-            <b-col sm="12" md="6"><input-email v-model="form.email"></input-email></b-col>
-            <b-col sm="12" md="6">
-              <label>{{ $t('language') }}</label>
-              <language-switch-select @update-language="updateLanguage" />
-            </b-col>
+            <b-col><input-email v-model="form.email"></input-email></b-col>
          </b-row>

          <b-row class="mt-4 mb-4">
@ -84,7 +80,7 @@
              <b-button
                type="submit"
                :disabled="disabled"
-                :variant="disabled ? 'outline-gradido' : 'gradido'"
+                :variant="disabled ? 'gradido-disable' : 'gradido'"
              >
                {{ $t('signup') }}
              </b-button>
@ -103,13 +99,11 @@
 import { createUser } from '@/graphql/mutations'
 import CONFIG from '@/config'
 import InputEmail from '@/components/Inputs/InputEmail.vue'
-import LanguageSwitchSelect from '@/components/LanguageSwitchSelect.vue'
 import Message from '@/components/Message/Message'

 export default {
  components: {
    InputEmail,
-    LanguageSwitchSelect,
    Message,
  },
  name: 'Register',
@ -121,7 +115,6 @@ export default {
        email: '',
        agree: false,
      },
-      language: '',
      showPageMessage: false,
      submitted: false,
      publisherId: this.$store.state.publisherId,
@ -130,10 +123,6 @@ export default {
    }
  },
  methods: {
-    updateLanguage(e) {
-      this.language = e
-      this.$store.commit('language', this.language)
-    },
    getValidationState({ dirty, validated, valid = null }) {
      return dirty || validated ? valid : null
    },
@ -148,7 +137,7 @@ export default {
            email: this.form.email,
            firstName: this.form.firstname,
            lastName: this.form.lastname,
-            language: this.language,
+            language: this.$store.state.language,
            publisherId: this.$store.state.publisherId,
            redeemCode: this.redeemCode,
          },
@ -183,7 +172,7 @@ export default {
      return this.form.email !== ''
    },
    disabled() {
-      return !(this.namesFilled && this.emailFilled && this.form.agree && !!this.language)
+      return !(this.namesFilled && this.emailFilled && this.form.agree)
    },
    enterData() {
      return !this.showPageMessage
--- a/frontend/src/pages/ResetPassword.vue
+++ b/frontend/src/pages/ResetPassword.vue
@ -6,7 +6,7 @@
      <b-form role="form" @submit.prevent="handleSubmit(onSubmit)">
        <input-password-confirmation v-model="form" />
        <div class="text-center">
-          <b-button type="submit" variant="primary" class="mt-4">
+          <b-button type="submit" variant="gradido" class="mt-4">
            <!-- eslint-disable-next-line @intlify/vue-i18n/no-dynamic-keys-->
            {{ $t(displaySetup.button) }}
          </b-button>
--- a/frontend/src/store/store.js
+++ b/frontend/src/store/store.js
@ -38,9 +38,6 @@ export const mutations = {
  isAdmin: (state, isAdmin) => {
    state.isAdmin = !!isAdmin
  },
-  coinanimation: (state, coinanimation) => {
-    state.coinanimation = coinanimation
-  },
  hasElopage: (state, hasElopage) => {
    state.hasElopage = hasElopage
  },
@ -53,7 +50,6 @@ export const actions = {
    // commit('username', data.username)
    commit('firstName', data.firstName)
    commit('lastName', data.lastName)
-    commit('coinanimation', data.coinanimation)
    commit('newsletterState', data.klickTipp.newsletterState)
    commit('hasElopage', data.hasElopage)
    commit('publisherId', data.publisherId)
@ -65,7 +61,6 @@ export const actions = {
    // commit('username', '')
    commit('firstName', '')
    commit('lastName', '')
-    commit('coinanimation', true)
    commit('newsletterState', null)
    commit('hasElopage', false)
    commit('publisherId', null)
@ -91,7 +86,6 @@ try {
      // username: '',
      token: null,
      isAdmin: false,
-      coinanimation: true,
      newsletterState: null,
      hasElopage: false,
      publisherId: null,
--- a/frontend/src/store/store.test.js
+++ b/frontend/src/store/store.test.js
@ -20,7 +20,6 @@ const {
  token,
  firstName,
  lastName,
-  coinanimation,
  newsletterState,
  publisherId,
  isAdmin,
@ -78,14 +77,6 @@ describe('Vuex store', () => {
      })
    })

-    describe('coinanimation', () => {
-      it('sets the state of coinanimation', () => {
-        const state = { coinanimation: true }
-        coinanimation(state, false)
-        expect(state.coinanimation).toEqual(false)
-      })
-    })
-
    describe('newsletterState', () => {
      it('sets the state of newsletterState', () => {
        const state = { newsletterState: null }
@ -134,7 +125,6 @@ describe('Vuex store', () => {
        language: 'de',
        firstName: 'Peter',
        lastName: 'Lustig',
-        coinanimation: false,
        klickTipp: {
          newsletterState: true,
        },
@ -145,7 +135,7 @@ describe('Vuex store', () => {

      it('calls nine commits', () => {
        login({ commit, state }, commitedData)
-        expect(commit).toHaveBeenCalledTimes(9)
+        expect(commit).toHaveBeenCalledTimes(8)
      })

      it('commits email', () => {
@ -168,29 +158,24 @@ describe('Vuex store', () => {
        expect(commit).toHaveBeenNthCalledWith(4, 'lastName', 'Lustig')
      })

-      it('commits coinanimation', () => {
-        login({ commit, state }, commitedData)
-        expect(commit).toHaveBeenNthCalledWith(5, 'coinanimation', false)
-      })
-
      it('commits newsletterState', () => {
        login({ commit, state }, commitedData)
-        expect(commit).toHaveBeenNthCalledWith(6, 'newsletterState', true)
+        expect(commit).toHaveBeenNthCalledWith(5, 'newsletterState', true)
      })

      it('commits hasElopage', () => {
        login({ commit, state }, commitedData)
-        expect(commit).toHaveBeenNthCalledWith(7, 'hasElopage', false)
+        expect(commit).toHaveBeenNthCalledWith(6, 'hasElopage', false)
      })

      it('commits publisherId', () => {
        login({ commit, state }, commitedData)
-        expect(commit).toHaveBeenNthCalledWith(8, 'publisherId', 1234)
+        expect(commit).toHaveBeenNthCalledWith(7, 'publisherId', 1234)
      })

      it('commits isAdmin', () => {
        login({ commit, state }, commitedData)
-        expect(commit).toHaveBeenNthCalledWith(9, 'isAdmin', true)
+        expect(commit).toHaveBeenNthCalledWith(8, 'isAdmin', true)
      })
    })

@ -200,7 +185,7 @@ describe('Vuex store', () => {

      it('calls nine commits', () => {
        logout({ commit, state })
-        expect(commit).toHaveBeenCalledTimes(9)
+        expect(commit).toHaveBeenCalledTimes(8)
      })

      it('commits token', () => {
@ -223,29 +208,24 @@ describe('Vuex store', () => {
        expect(commit).toHaveBeenNthCalledWith(4, 'lastName', '')
      })

-      it('commits coinanimation', () => {
-        logout({ commit, state })
-        expect(commit).toHaveBeenNthCalledWith(5, 'coinanimation', true)
-      })
-
      it('commits newsletterState', () => {
        logout({ commit, state })
-        expect(commit).toHaveBeenNthCalledWith(6, 'newsletterState', null)
+        expect(commit).toHaveBeenNthCalledWith(5, 'newsletterState', null)
      })

      it('commits hasElopage', () => {
        logout({ commit, state })
-        expect(commit).toHaveBeenNthCalledWith(7, 'hasElopage', false)
+        expect(commit).toHaveBeenNthCalledWith(6, 'hasElopage', false)
      })

      it('commits publisherId', () => {
        logout({ commit, state })
-        expect(commit).toHaveBeenNthCalledWith(8, 'publisherId', null)
+        expect(commit).toHaveBeenNthCalledWith(7, 'publisherId', null)
      })

      it('commits isAdmin', () => {
        logout({ commit, state })
-        expect(commit).toHaveBeenNthCalledWith(9, 'isAdmin', false)
+        expect(commit).toHaveBeenNthCalledWith(8, 'isAdmin', false)
      })

      // how to get this working?