🎨 (Color) add contrast color

This commit is contained in:
Julien Calixte
2019-10-25 19:37:28 +02:00
parent 20a02ce294
commit e38637020d
10 changed files with 95 additions and 30 deletions

View File

@@ -6,7 +6,7 @@
>
<router-link
:class="{ 'is-primary': !account.color, 'is-white': account.color }"
:style="`color: ${findDarkValue(account.color)}`"
:style="`color: ${findContrastColor(account.color)}`"
:to="{ name: 'account', params: { id: account._id } }"
>{{ account.name }}</router-link
>
@@ -22,7 +22,7 @@
<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator'
import { findDarkValue } from '@/utils'
import { findContrastColor, findDarkValue } from '@/utils'
import bus, { SYNC } from '@/utils/bus-event'
import accountService from '@/services/AccountService'
import IAccount from '@/models/IAccount'
@@ -45,8 +45,8 @@ export default class AccountCard extends Vue {
)
}
public findDarkValue(color: string): string | null {
return findDarkValue(color)
public findContrastColor(color: string): string | null {
return findContrastColor(color)
}
public goToAccount(id: string): void {
@@ -59,7 +59,7 @@ export default class AccountCard extends Vue {
}
return {
backgroundColor: color,
color: this.findDarkValue(color)
color: this.findContrastColor(color)
}
}