sup39/firefish
1
0
Fork 0
Code Issues Pull requests Activity

style: rearrange buttons in page editor

Browse source
This commit is contained in:
sup39 2024-01-19 04:01:55 +09:00
parent 881fd5f5d8
commit 6039e15cd5
Signed by: sup39
GPG key ID: 111C00916C1641E5
1 changed files with 10 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
packages/client/src/pages/page-editor/page-editor.container.vue
View file

@ -1,12 +1,14 @@
<template>
<div class="cpjygsrt" :class="{ error: error != null, warn: warn != null }">
<header>
<div class="title"><slot name="header"></slot></div>
<div class="buttons">
<slot name="func"></slot>
<button v-if="removable" class="_button" @click="remove()">
<i :class="icon('ph-trash')"></i>
</button>
</div>
<div class="title"><slot name="header"></slot></div>
<div class="buttons">
<slot name="func"></slot>
<div v-if="draggable" class="drag-handle _button">
<i :class="icon('ph-list')"></i>
</div>
@ -115,14 +117,16 @@ export default defineComponent({
}
> header {
display: flex;
padding-top: 0.5em;
> .title {
z-index: 1;
margin: 0;
padding: 0 16px;
line-height: 42px;
font-size: 0.9em;
font-weight: bold;
box-shadow: 0 1px rgba(#000, 0.07);
flex: 1;
> i {
margin-inline-end: 6px;
@ -134,16 +138,13 @@ export default defineComponent({
}
> .buttons {
position: absolute;
z-index: 2;
top: 0;
inset-inline-end: 0;
> ._button {
> ._button,
> :slotted(._button) {
padding: 0;
width: 42px;
font-size: 0.9em;
line-height: 42px;
text-align: center;
}