diff options
| -rw-r--r-- | src/components/TimeLine.vue | 4 | ||||
| -rw-r--r-- | src/store.ts | 3 |
2 files changed, 5 insertions, 2 deletions
diff --git a/src/components/TimeLine.vue b/src/components/TimeLine.vue index 1e78a87..b50141a 100644 --- a/src/components/TimeLine.vue +++ b/src/components/TimeLine.vue @@ -48,7 +48,7 @@ <!-- Events --> <div v-for="id in idToPos.keys()" :key="id" class="absolute animate-fadein z-20" :style="eventStyles(id)"> <!-- Image --> - <div class="rounded-full border border-yellow-500" :style="eventImgStyles(id)"></div> + <div class="rounded-full" :style="eventImgStyles(id)"></div> <!-- Label --> <div class="text-center text-stone-100 text-sm whitespace-nowrap text-ellipsis overflow-hidden"> {{idToEvent.get(id)!.title}} @@ -1172,6 +1172,8 @@ function eventImgStyles(eventId: number){ height: store.eventImgSz + 'px', backgroundImage: `url(${getImagePath(event.imgId)})`, backgroundSize: 'cover', + borderColor: event.ctg == 'discovery' ? store.color.alt2 : store.color.altDark, + borderWidth: '1px', }; } function eventLineStyles(eventId: number){ diff --git a/src/store.ts b/src/store.ts index 8b92c6f..bb29dba 100644 --- a/src/store.ts +++ b/src/store.ts @@ -18,7 +18,8 @@ export const useStore = defineStore('store', { alt: '#fde047', // yellow-300 altDark: '#eab308', // yellow-500 altDark2: '#ca8a04', // yellow-600 - altBg: '#6a5e2e' + altBg: '#6a5e2e', + alt2: '#2563eb', // sky-600 }; return { tickLen: 16, |