fix
This commit is contained in:
parent
071929f011
commit
92e2d62bc9
80
src/App.vue
80
src/App.vue
@ -58,31 +58,33 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div class="bsky_comment" v-if="comment_open == false">
|
<div class="comment">
|
||||||
<span class="comment">
|
<div class="bsky_comment" v-if="comment_open == false">
|
||||||
<p class="comment-body" v-if="comment_first">
|
<span class="comment">
|
||||||
<img :src="'/icon/' + comment_first.did.replace('did:plc:', '') + '.jpg'" v-if="comment_first.avatar" class="comment"/> <span class="comment-time" v-if="comment_first.updated_at"><a :href="comment_first.bsky_url">{{ moment(comment_first.updated_at) }}</a></span> <span class="comment-handle" v-if="comment_first.handle"><a :href="'https://' + comment_first.bsky_url.split('/').slice(2,5).join('/')">@{{ comment_first.handle }}</a></span>
|
<p class="comment-body" v-if="comment_first">
|
||||||
<span class="comment-text" v-if="comment_first.text">{{ comment_first.text }}</span>
|
<img :src="'/icon/' + comment_first.did.replace('did:plc:', '') + '.jpg'" v-if="comment_first.avatar" class="comment"/> <span class="comment-time" v-if="comment_first.updated_at"><a :href="comment_first.bsky_url">{{ moment(comment_first.updated_at) }}</a></span> <span class="comment-handle" v-if="comment_first.handle"><a :href="'https://' + comment_first.bsky_url.split('/').slice(2,5).join('/')">@{{ comment_first.handle }}</a></span>
|
||||||
|
<span class="comment-text" v-if="comment_first.text">{{ comment_first.text }}</span>
|
||||||
|
</p>
|
||||||
|
</span>
|
||||||
|
<div class="comment_open">
|
||||||
|
<p>
|
||||||
|
<a :href="comment_first.bsky_url" target="_blank">post</a>
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
<button class="comment_open" v-on:click="comment_open = !comment_open"><i class="fa-solid fa-chevron-down"></i></button>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="bsky_comment" v-else>
|
||||||
|
<span v-for="i in api_json.data" class="comment">
|
||||||
|
<p class="comment-body" v-if="i">
|
||||||
|
{{ axios_check('/icon/' + i.did.replace('did:plc:', '') + '.jpg') }}
|
||||||
|
<img :src="'/icon/' + i.did.replace('did:plc:', '') + '.jpg'" v-if="url_check" class="comment"/><img :src="i.avatar" v-else-if="i.avatar" class="comment"/> <span class="comment-time" v-if="i.updated_at"><a :href="i.bsky_url">{{ moment(i.updated_at) }}</a></span> <span class="comment-handle" v-if="i.handle"><a :href="'https://' + i.bsky_url.split('/').slice(2,5).join('/')">@{{ i.handle }}</a></span>
|
||||||
|
<span class="comment-text" v-if="i.text">{{ i.text }}</span>
|
||||||
</p>
|
</p>
|
||||||
</span>
|
</span>
|
||||||
<div class="comment_open">
|
<div class="comment_open"><button class="comment_open" v-on:click="comment_open = !comment_open"><i class="fa-solid fa-chevron-up"></i></button></div>
|
||||||
<p>
|
|
||||||
<a :href="comment_first.bsky_url" target="_blank">post</a>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<button class="comment_open" v-on:click="comment_open = !comment_open"><i class="fa-solid fa-chevron-down"></i></button>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="bsky_comment" v-else>
|
|
||||||
<span v-for="i in api_json.data" class="comment">
|
|
||||||
<p class="comment-body" v-if="i">
|
|
||||||
{{ axios_check('/icon/' + i.did.replace('did:plc:', '') + '.jpg') }}
|
|
||||||
<img :src="'/icon/' + i.did.replace('did:plc:', '') + '.jpg'" v-if="url_check" class="comment"/><img :src="i.avatar" v-else-if="i.avatar" class="comment"/> <span class="comment-time" v-if="i.updated_at"><a :href="i.bsky_url">{{ moment(i.updated_at) }}</a></span> <span class="comment-handle" v-if="i.handle"><a :href="'https://' + i.bsky_url.split('/').slice(2,5).join('/')">@{{ i.handle }}</a></span>
|
|
||||||
<span class="comment-text" v-if="i.text">{{ i.text }}</span>
|
|
||||||
</p>
|
|
||||||
</span>
|
|
||||||
<div class="comment_open"><button class="comment_open" v-on:click="comment_open = !comment_open"><i class="fa-solid fa-chevron-up"></i></button></div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="page_title">
|
<div class="page_title">
|
||||||
@ -238,7 +240,7 @@ a span.icon-ai {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.hooper-progress-inner {
|
.hooper-progress-inner {
|
||||||
background-color: #aba700;
|
background-color: #ddd700;
|
||||||
}
|
}
|
||||||
|
|
||||||
button {
|
button {
|
||||||
@ -261,7 +263,7 @@ ul.hooper-track {
|
|||||||
|
|
||||||
.page {
|
.page {
|
||||||
text-align:center;
|
text-align:center;
|
||||||
background-color: rgba(184, 207, 224, .24);
|
background-color: #f1f1f1;
|
||||||
padding: 50px 0 50px 0;
|
padding: 50px 0 50px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -294,13 +296,14 @@ table {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
|
word-break: break-all;
|
||||||
}
|
}
|
||||||
|
|
||||||
thead, td, tr, th {
|
thead, td, tr, th {
|
||||||
padding:10px;
|
padding:10px;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
border: solid 1px #fff;
|
border: solid 1px #fff;
|
||||||
padding: 5px 25px 5px 25px;
|
padding: 15px 25px 15px 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
th.row {
|
th.row {
|
||||||
@ -341,7 +344,7 @@ span.comment-handle {
|
|||||||
}
|
}
|
||||||
|
|
||||||
span.comment-handle a {
|
span.comment-handle a {
|
||||||
color: #aba700;
|
color: #313131;
|
||||||
}
|
}
|
||||||
|
|
||||||
img.comment {
|
img.comment {
|
||||||
@ -349,7 +352,7 @@ img.comment {
|
|||||||
}
|
}
|
||||||
|
|
||||||
p.comment-body {
|
p.comment-body {
|
||||||
padding: 5px 70px 5px 70px;
|
padding: 5px 40px 15px 40px;
|
||||||
border-bottom: solid 1px #eee;
|
border-bottom: solid 1px #eee;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -357,9 +360,6 @@ span.comment-text {
|
|||||||
padding:10px;
|
padding:10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
span.comment {
|
|
||||||
}
|
|
||||||
|
|
||||||
button.comment_open {
|
button.comment_open {
|
||||||
padding:20px 40px 20px 40px;
|
padding:20px 40px 20px 40px;
|
||||||
background-color: rgba(184,207,224,.24);
|
background-color: rgba(184,207,224,.24);
|
||||||
@ -379,8 +379,24 @@ button.comment_open:hover {
|
|||||||
color: rgb(16, 131, 254);
|
color: rgb(16, 131, 254);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bsky_comment {
|
||||||
|
background-color: #fff;
|
||||||
|
width: 700px;
|
||||||
|
margin: 0px auto;
|
||||||
|
border: solid 1px #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.comment {
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
@media screen and (max-width:1000px) {
|
@media screen and (max-width:1000px) {
|
||||||
img{ width:100%; }
|
img{
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
.bsky_comment {
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
.page_title a img {
|
.page_title a img {
|
||||||
width:100%;
|
width:100%;
|
||||||
}
|
}
|
||||||
@ -398,4 +414,6 @@ button.comment_open:hover {
|
|||||||
}
|
}
|
||||||
|
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap')
|
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap')
|
||||||
|
|
||||||
|
/* color: #aba700 #fff700 #313131 rgba(184, 207, 224, .24) rgb(16, 131, 254) #ddd700 */
|
||||||
</style>
|
</style>
|
||||||
|
Loading…
Reference in New Issue
Block a user