Damillora
/
miracle
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add more varied page header images

This commit is contained in:
Damillora 2021-01-10 03:21:26 +07:00
parent e3df7a6556
commit 646e50673e
34 changed files with 39 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/images/bg/765-yuriko/bg-lg.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 269 KiB

BIN
assets/images/bg/765-yuriko/bg-md.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 168 KiB

BIN
assets/images/bg/765-yuriko/bg-sm.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 123 KiB

BIN
assets/images/bg/765-yuriko/bg-xl.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 377 KiB

BIN
assets/images/bg/765-yuriko/bg-xxl.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 383 KiB

BIN
assets/images/bg/cue-mei2/bg-lg.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 116 KiB

BIN
assets/images/bg/cue-mei2/bg-md.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 73 KiB

BIN
assets/images/bg/cue-mei2/bg-sm.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 55 KiB

BIN
assets/images/bg/cue-mei2/bg-xl.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 164 KiB

BIN
assets/images/bg/cue-mei2/bg-xxl.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 174 KiB

18
components/PageHeader.vue
View File

@ -2,7 +2,7 @@
<div class="relative group page-header">
<component is="style">
:root {
--bg: url('{{ require('@/assets/images/bg/'+normalImageType+'/bg.jpg') }}');
--bg-ps: {{ positioning }};
--bg-sm: url('{{ require('@/assets/images/bg/'+normalImageType+'/bg-sm.jpg') }}');
--bg-md: url('{{ require('@/assets/images/bg/'+normalImageType+'/bg-md.jpg') }}');
--bg-lg: url('{{ require('@/assets/images/bg/'+normalImageType+'/bg-lg.jpg') }}');
@ -30,6 +30,20 @@ export default {
computed: {
normalImageType() {
return this.imageType ?? '283-yuika';
},
positioning() {
switch(this.normalImageType) {
case '283-yuika':
return 'right 25% top 20%';
case 'cue-mei':
return 'center top';
case 'cue-mei2':
return 'center top';
case '765-yuriko':
return 'right 15% top 10%';
default:
return 'center';
}
}
},
@ -56,7 +70,7 @@ export default {
.page-header-background {
background-image: var(--bg-sm);
background-size: cover;
background-position: right 25% top 20%;
background-position: var(--bg-ps);
}
@screen sm {
.page-header-background {

2
pages/games/arcaea.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Arcaea</h1>
<p><a href="https://arcaea.lowiro.com">Game Website</a></p>
</PageHeader>

2
pages/games/arknights.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Arknights</h1>
<p><a href="https://www.arknights.global">Game Website</a></p>
</PageHeader>

2
pages/games/azurlane.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Azur Lane (EN)</h1>
<p><a href="">Game Website</a></p>
</PageHeader>

2
pages/games/bandori.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: BanG Dream! Girls Band Party (JP)</h1>
<p><a href="https://bang-dream.bushimo.jp/">Game Website</a></p>
</PageHeader>

2
pages/games/cue.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: CUE!</h1>
<p><a href="https://www.cue-liber.jp/">Game Website</a></p>
</PageHeader>

2
pages/games/fgo.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Fate/Grand Order (JP)</h1>
<p><a href="https://www.fate-go.jp">Game Website</a></p>
</PageHeader>

2
pages/games/genshin.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Genshin Impact</h1>
<p><a href="https://genshin.mihoyo.com">Game Website</a></p>
</PageHeader>

2
pages/games/honkai.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Honkai Impact 3rd</h1>
<p><a href="https://honkaiimpact3.mihoyo.com">Game Website</a></p>
</PageHeader>

2
pages/games/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile</h1>
</PageHeader>
<main class="container mx-auto main">

2
pages/games/llsif.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Love Live! School Idol Festival (JP)</h1>
<p><a href="https://lovelive-sif.bushimo.jp/">Game Website</a></p>
</PageHeader>

2
pages/games/llsifas.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Love Live! School idol festival ALL STARS</h1>
<p><a href="https://lovelive-as.bushimo.jp/">Game Website</a></p>
</PageHeader>

2
pages/games/maimai.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: maimai DX</h1>
<p><a href="https://maimai.sega.com/">Game Website</a></p>
</PageHeader>

2
pages/games/mirishita.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: The IDOLM@STER Million Live: Theater Days</h1>
<p><a href="https://millionlive.idolmaster.jp/theaterdays/">Game Website</a></p>
</PageHeader>

2
pages/games/nogikoi.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Nogikoi</h1>
<p><a href="https://nogikoi.jp">Game Website</a></p>
</PageHeader>

2
pages/games/puroseka.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Project SEKAI COLORFUL STAGE!</h1>
<p><a href="https://pjsekai.sega.jp/">Game Website</a></p>
</PageHeader>

2
pages/games/sdvx.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: SOUND VOLTEX VIVID WAVE</h1>
<p><a href="https://p.eagate.573.jp/game/sdvx/v/p/index.html">Game Website</a></p>
</PageHeader>

2
pages/games/shadowverse.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Shadowverse</h1>
<p><a href="https://shadowverse.com/">Game Website</a></p>
</PageHeader>

2
pages/games/shinymas.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: THE IDOLM@STER: Shiny Colors</h1>
<p><a href="https://shinycolors.idolmaster.jp">Game Website</a></p>
</PageHeader>

2
pages/games/starira.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Revue Starlight Re LIVE (EN)</h1>
<p><a href="https://www.en.revuestarlight-relive.com/">Game Website</a></p>
</PageHeader>

2
pages/games/t7s.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: Tokyo 7th Sisters</h1>
<p><a href="https://t7s.jp">Game Website</a></p>
</PageHeader>

2
pages/games/template.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: </h1>
<p><a href="">Game Website</a></p>
</PageHeader>

2
pages/games/unison.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="cue-mei2">
<h1 class="title">Game Profile: 欅坂46・日向坂46 UNI'S ON AIR</h1>
<p><a href="https://keyahina-unisonair.com/">Game Website</a></p>
</PageHeader>

2
pages/links.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page">
<PageHeader>
<PageHeader imageType="765-yuriko">
<h1>Links</h1>
</PageHeader>
<main class="container mx-auto main">