mirror of
https://github.com/woodpecker-ci/woodpecker.git
synced 2025-04-29 06:54:43 +00:00
@qwerty287 @anbraten What do you think about this approach? This way the icons fit more into the existing design. I've also moved the icon in the tab to the end as this looks IMO a bit better on mobile view, but open for discussions.  <img src="https://github.com/woodpecker-ci/woodpecker/assets/3391958/93cd4dd6-4e22-4210-9fee-f8d134d3df42" width=350> <img src="https://github.com/woodpecker-ci/woodpecker/assets/3391958/6128fec9-3dc5-4483-abde-5a911b236138" width=350> Alternative idea for errors: <img src="https://github.com/woodpecker-ci/woodpecker/assets/3391958/bee8b1ea-8d27-43cc-9fb1-2df0031d3551" width=350> Or just use one symbol and only change the color for errors/warnings?
29 lines
950 B
Vue
29 lines
950 B
Vue
<template>
|
|
<Settings :title="$t('info')">
|
|
<div class="flex flex-col items-center gap-4">
|
|
<WoodpeckerLogo class="w-32 h-32 fill-wp-text-200" />
|
|
|
|
<i18n-t keypath="running_version" tag="p" class="text-xl">
|
|
<span class="font-bold">{{ version?.current }}</span>
|
|
</i18n-t>
|
|
|
|
<i18n-t v-if="version?.needsUpdate" keypath="update_woodpecker" tag="span" class="text-int-wp-state-error-100">
|
|
<a
|
|
:href="`https://github.com/woodpecker-ci/woodpecker/releases/tag/${version.latest}`"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class="underline"
|
|
>{{ version.latest }}</a
|
|
>
|
|
</i18n-t>
|
|
</div>
|
|
</Settings>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import WoodpeckerLogo from '~/assets/logo.svg?component';
|
|
import Settings from '~/components/layout/Settings.vue';
|
|
import { useVersion } from '~/compositions/useVersion';
|
|
|
|
const version = useVersion();
|
|
</script>
|