fix
This commit is contained in:
parent
0cc42fe96f
commit
78fa570f7f
GPG Key ID:
5417CFEBAD92DF56
@ -12,7 +12,6 @@
|
||||
"core-js": "^3.6.4",
|
||||
"hooper": "^0.3.4",
|
||||
"vue": "^2.6.11",
|
||||
"vue-loading-template": "^1.3.2",
|
||||
"vue-meta": "^2.4.0",
|
||||
"vue-template-compiler": "^2.6.14"
|
||||
},
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>yui | manga</title><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link href="app.css" rel="preload" as="style"><link href="app.js" rel="preload" as="script"><link href="chunk-vendors.js" rel="preload" as="script"><link href="app.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://yui.syui.ai/bower_components/icomoon/css/icomoon.css" />
|
||||
<link rel="stylesheet" href="https://yui.syui.ai/bower_components/font-awesome/css/all.min.css" />
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta property="og:url" content="https://manga.syui.ai">
|
||||
<meta property="og:title" content="yui">
|
||||
|
||||
141
src/App.vue
141
src/App.vue
@ -1,16 +1,21 @@
|
||||
<template>
|
||||
|
||||
<div id="app">
|
||||
{{ loc }}
|
||||
|
||||
<hooper :settings="hooperSettings">
|
||||
<slide v-for="(n,index) of products" :key="n">
|
||||
<img :src="url + 'manga/'+ (index) +'.webp'" />
|
||||
<div v-if="loading" class="loading">
|
||||
<i class="fa-solid fa-spinner fa-spin-pulse"></i>
|
||||
</div>
|
||||
<img :src="url + 'manga/'+ (index) +'.webp'" @load="load" />
|
||||
<div class="page_n">{{ n }}</div>
|
||||
</slide>
|
||||
<hooper-navigation slot="hooper-addons"></hooper-navigation>
|
||||
<hooper-pagination slot="hooper-addons"></hooper-pagination>
|
||||
<hooper-progress slot="hooper-addons"></hooper-progress>
|
||||
</hooper>
|
||||
|
||||
<!--
|
||||
<div class="page">
|
||||
<a :href="this.url + this.s_a"><img :src="url + 'manga/' + this.s_a + '.webp'" v-on:click="page_run(s_a)"></a>
|
||||
<a :href="this.url + this.s_b"><button v-on:click="page_run(s_b)">2</button></a>
|
||||
@ -18,6 +23,65 @@
|
||||
<a :href="this.url + this.s_d"><button v-on:click="page_run(s_d)">4</button></a>
|
||||
<a :href="this.url + this.s_e"><button v-on:click="page_run(s_e)">5</button></a>
|
||||
</div>
|
||||
-->
|
||||
|
||||
<div class="page">
|
||||
<div class="page_data">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col"></th>
|
||||
<th scope="col">n</th>
|
||||
<th scope="col">body</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<a :href="this.url + this.s_a"><img :src="url + 'manga/' + this.s_a + '.webp'" v-on:click="page_run(s_a)"></a>
|
||||
</th>
|
||||
<td>0</td>
|
||||
<td>アイがガララ星に移り住んでからのお話</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<a :href="this.url + this.s_b"><img :src="url + 'manga/' + this.s_b + '.webp'" v-on:click="page_run(s_a)"></a>
|
||||
</th>
|
||||
<td>1</td>
|
||||
<td>テスト</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page_title">
|
||||
<div class="page_data">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col"><span class="icon-ai"></span></th>
|
||||
<th scope="col">title</th>
|
||||
<th scope="col">body</th>
|
||||
<th scope="col">author</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<a href="https://yui.syui.ai"><img src="https://syui.ai/ai.png" v-on:click="page_run(s_a)"></a>
|
||||
</th>
|
||||
<td>yui</td>
|
||||
<td>不思議な力を持った女の子の物語</td>
|
||||
<td>syui</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -31,6 +95,7 @@ import {
|
||||
} from 'hooper';
|
||||
|
||||
import 'hooper/dist/hooper.css';
|
||||
|
||||
var page = 107;
|
||||
var loc = window.location.pathname.split('/').slice(-1)[0];
|
||||
//let loc = window.location.pathname.split('/').slice(0)[3];
|
||||
@ -46,6 +111,7 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: true,
|
||||
url: "/",
|
||||
s_a: 0,
|
||||
s_b: 17,
|
||||
@ -64,12 +130,19 @@ export default {
|
||||
page_run(s) {
|
||||
this.loc = s;
|
||||
this.hooperSettings.initialSlide = s;
|
||||
},
|
||||
load() {
|
||||
this.loading = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.page_n{text-align:center;height:50px}
|
||||
.hooper-pagination{position:fixed}
|
||||
.hooper-next,.hooper-prev{background-color:rgba(184,207,224,.24)}
|
||||
@ -83,6 +156,14 @@ export default {
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.hooper-progress {
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
.hooper-progress-inner {
|
||||
background-color: #dcd500;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 10px;
|
||||
margin: 5px;
|
||||
@ -95,15 +176,16 @@ ul.hooper-track {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
img{
|
||||
.hooper-list img {
|
||||
width:500px;
|
||||
border: solid 3px #313131;
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
.page {
|
||||
text-align:center;
|
||||
margin:50px 20px 50px 20px;
|
||||
background-color: rgba(184, 207, 224, .24);
|
||||
padding: 20px;
|
||||
padding: 50px 0 50px 0;
|
||||
}
|
||||
|
||||
.page a img {
|
||||
@ -113,14 +195,61 @@ img{
|
||||
display: block;
|
||||
}
|
||||
|
||||
.page a button {
|
||||
.page_title {
|
||||
text-align:center;
|
||||
background-color: #313131;
|
||||
padding: 100px 0 50px 0;
|
||||
}
|
||||
|
||||
.page_title a img {
|
||||
width:100px;
|
||||
margin: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.page_title head, td, tr, th {
|
||||
padding:10px;
|
||||
background: #fff;
|
||||
border: solid 1px #fff;
|
||||
}
|
||||
|
||||
table {
|
||||
text-align: center;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
thead, td, tr, th {
|
||||
padding:10px;
|
||||
background: #fff;
|
||||
border: solid 1px #fff;
|
||||
}
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
background: #313131;
|
||||
color: #fff;
|
||||
padding:50px 0 30px 0;
|
||||
}
|
||||
|
||||
.loading {
|
||||
text-align: center;
|
||||
font-size: 30px;
|
||||
margin-top:100px;
|
||||
}
|
||||
|
||||
@media screen and (max-width:1000px) {
|
||||
img{ width:100%; }
|
||||
.page_title a img {
|
||||
width:100%;
|
||||
}
|
||||
.page a img {
|
||||
width:100%;
|
||||
}
|
||||
.hooper-list img {
|
||||
border: solid 0px #fff;
|
||||
margin:20px 0 0 0;
|
||||
width:100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -7,4 +7,3 @@ new Vue({
|
||||
render: h => h(App)
|
||||
}).$mount('#app')
|
||||
|
||||
|
||||
|
||||
53
yarn.lock
53
yarn.lock
@ -37,6 +37,30 @@
|
||||
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.22.4.tgz#a770e98fd785c231af9d93f6459d36770993fb32"
|
||||
integrity sha512-VLLsx06XkEYqBtE5YGPwfSGwfrjnyPP5oiGty3S8pQLFDFLaS8VwWSIxkTXpcvr5zeYLE6+MBNl2npl/YnfofA==
|
||||
|
||||
"@fortawesome/fontawesome-common-types@6.5.1":
|
||||
version "6.5.1"
|
||||
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.1.tgz#fdb1ec4952b689f5f7aa0bffe46180bb35490032"
|
||||
integrity sha512-GkWzv+L6d2bI5f/Vk6ikJ9xtl7dfXtoRu3YGE6nq0p/FFqA1ebMOAWg3XgRyb0I6LYyYkiAo+3/KrwuBp8xG7A==
|
||||
|
||||
"@fortawesome/fontawesome-svg-core@^6.5.1":
|
||||
version "6.5.1"
|
||||
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.1.tgz#9d56d46bddad78a7ebb2043a97957039fcebcf0a"
|
||||
integrity sha512-MfRCYlQPXoLlpem+egxjfkEuP9UQswTrlCOsknus/NcMoblTH2g0jPrapbcIb04KGA7E2GZxbAccGZfWoYgsrQ==
|
||||
dependencies:
|
||||
"@fortawesome/fontawesome-common-types" "6.5.1"
|
||||
|
||||
"@fortawesome/free-solid-svg-icons@^6.5.1":
|
||||
version "6.5.1"
|
||||
resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.1.tgz#737b8d787debe88b400ab7528f47be333031274a"
|
||||
integrity sha512-S1PPfU3mIJa59biTtXJz1oI0+KAXW6bkAb31XKhxdxtuXDiUIFsih4JR1v5BbxY7hVHsD1RKq+jRkVRaf773NQ==
|
||||
dependencies:
|
||||
"@fortawesome/fontawesome-common-types" "6.5.1"
|
||||
|
||||
"@fortawesome/vue-fontawesome@^3.0.6":
|
||||
version "3.0.6"
|
||||
resolved "https://registry.yarnpkg.com/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.0.6.tgz#c5e627475c10869a091280610c96411d18206f3a"
|
||||
integrity sha512-akrL7lTroyNpPkoHtvK2UpsMzJr6jXdHaQ0YdcwqDsB8jdwlpNHZYijpOUd9KJsARr+VB3WXY4EyObepqJ4ytQ==
|
||||
|
||||
"@hapi/address@2.x.x":
|
||||
version "2.1.4"
|
||||
resolved "https://registry.yarnpkg.com/@hapi/address/-/address-2.1.4.tgz#5d67ed43f3fd41a69d4b9ff7b56e7c0d1d0a81e5"
|
||||
@ -5436,11 +5460,6 @@ readdirp@~3.6.0:
|
||||
dependencies:
|
||||
picomatch "^2.2.1"
|
||||
|
||||
reflect-metadata@^0.1.10:
|
||||
version "0.1.13"
|
||||
resolved "https://registry.yarnpkg.com/reflect-metadata/-/reflect-metadata-0.1.13.tgz#67ae3ca57c972a2aa1642b10fe363fe32d49dc08"
|
||||
integrity sha512-Ts1Y/anZELhSsjMcU605fU9RE4Oi3p5ORujwbIKXfWa+0Zxs510Qrmrce5/Jowq3cHSZSJqBjypxmHarc+vEWg==
|
||||
|
||||
regex-not@^1.0.0, regex-not@^1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/regex-not/-/regex-not-1.0.2.tgz#1f4ece27e00b0b65e0247a6810e6a85d83a5752c"
|
||||
@ -6654,11 +6673,6 @@ vm-browserify@^1.0.1:
|
||||
resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
|
||||
integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==
|
||||
|
||||
vue-class-component@^6.0.0, vue-class-component@^6.1.0:
|
||||
version "6.3.2"
|
||||
resolved "https://registry.yarnpkg.com/vue-class-component/-/vue-class-component-6.3.2.tgz#e6037e84d1df2af3bde4f455e50ca1b9eec02be6"
|
||||
integrity sha512-cH208IoM+jgZyEf/g7mnFyofwPDJTM/QvBNhYMjqGB8fCsRyTf68rH2ISw/G20tJv+5mIThQ3upKwoL4jLTr1A==
|
||||
|
||||
vue-hot-reload-api@^2.3.0:
|
||||
version "2.3.4"
|
||||
resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz#532955cc1eb208a3d990b3a9f9a70574657e08f2"
|
||||
@ -6684,15 +6698,6 @@ vue-loader@^15.9.2:
|
||||
vue-hot-reload-api "^2.3.0"
|
||||
vue-style-loader "^4.1.0"
|
||||
|
||||
vue-loading-template@^1.3.2:
|
||||
version "1.3.2"
|
||||
resolved "https://registry.yarnpkg.com/vue-loading-template/-/vue-loading-template-1.3.2.tgz#2f7bd7ae5735c47029e8f1ed774ed45970897775"
|
||||
integrity sha512-p02Q0cIkGlYSd2B++9JkRnSi4vzbIy3Pd7HOPncFCT5sgXin0clJFCvO8+KqF3JYP+coR8BjMqFEjOJY20jKYA==
|
||||
dependencies:
|
||||
vue "^2.5.16"
|
||||
vue-class-component "^6.0.0"
|
||||
vue-property-decorator "^6.0.0"
|
||||
|
||||
vue-meta@^2.4.0:
|
||||
version "2.4.0"
|
||||
resolved "https://registry.yarnpkg.com/vue-meta/-/vue-meta-2.4.0.tgz#a419fb4b4135ce965dab32ec641d1989c2ee4845"
|
||||
@ -6700,14 +6705,6 @@ vue-meta@^2.4.0:
|
||||
dependencies:
|
||||
deepmerge "^4.2.2"
|
||||
|
||||
vue-property-decorator@^6.0.0:
|
||||
version "6.1.0"
|
||||
resolved "https://registry.yarnpkg.com/vue-property-decorator/-/vue-property-decorator-6.1.0.tgz#ef97bcc1bfe794ec060133ca04a5aca02e808828"
|
||||
integrity sha512-NM4PYPOkOIO7SFtWiQqVrbp+ORzd7CJXcIz0X710PNW9pxGfbil0/x/ULFympzIUoHXBKN2dqoOQzh6oeMzpTQ==
|
||||
dependencies:
|
||||
reflect-metadata "^0.1.10"
|
||||
vue-class-component "^6.1.0"
|
||||
|
||||
vue-style-loader@^4.1.0, vue-style-loader@^4.1.2:
|
||||
version "4.1.3"
|
||||
resolved "https://registry.yarnpkg.com/vue-style-loader/-/vue-style-loader-4.1.3.tgz#6d55863a51fa757ab24e89d9371465072aa7bc35"
|
||||
@ -6729,7 +6726,7 @@ vue-template-es2015-compiler@^1.9.0:
|
||||
resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
|
||||
integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==
|
||||
|
||||
vue@^2.5.16, vue@^2.6.11:
|
||||
vue@^2.6.11:
|
||||
version "2.7.14"
|
||||
resolved "https://registry.yarnpkg.com/vue/-/vue-2.7.14.tgz#3743dcd248fd3a34d421ae456b864a0246bafb17"
|
||||
integrity sha512-b2qkFyOM0kwqWFuQmgd4o+uHGU7T+2z3T+WQp8UBjADfEv2n4FEMffzBmCKNP0IGzOEEfYjvtcC62xaSKeQDrQ==
|
||||
|
||||
Loading…
Reference in New Issue
Block a user