The_evening_detective/evening_detective_client
1
0
Fork 0
generated from VLADIMIR/template_frontend
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add collapse icon

Browse Source
This commit is contained in:
Владимир Фёдоров 2026-03-25 12:45:23 +07:00
parent ed178d57a9
commit fdf27203a3
2 changed files with 14 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/collapse.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 85 KiB

17
src/components/MessageCloud.vue
View File

@ -30,7 +30,8 @@ async function letsgo(place: string) {
<MessagePaper> <MessagePaper>
<div class="message-header"> <div class="message-header">
{{ props.action.place }}: {{ props.action.name }} {{ props.action.place }}: {{ props.action.name }}
<span class="collapse-icon" @click="clickCollapse">{{ props.action.isOpen ? '−' : '+' }}</span> <span v-if="props.action.isOpen" class="collapse-icon collapse-icon-up" @click="clickCollapse"></span>
<span v-else class="collapse-icon" @click="clickCollapse"></span>
</div> </div>
<div v-show="props.action.isOpen"> <div v-show="props.action.isOpen">
<hr class="hr" /> <hr class="hr" />
@ -71,9 +72,19 @@ async function letsgo(place: string) {
} }
.collapse-icon { .collapse-icon {
float: right; position: absolute;
padding: 0 15px; top: 8px;
right: 10px;
width: 45px;
height: 32px;
cursor: pointer; cursor: pointer;
background-image: url("@/assets/collapse.png");
background-size: cover;
background-position: center;
}
.collapse-icon-up {
transform: rotate(-180deg);
} }
.message-content { .message-content {