fix: tüm açılır bölümlere tutarlı ok işareti (Öğeler, Görsel, SEO dahil)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Fable 5
parent
1bc276147d
commit
f48f3ed7e5
@@ -17,8 +17,9 @@
|
|||||||
:open="(depth ?? 0) < 1 && field !== 'meta'"
|
:open="(depth ?? 0) < 1 && field !== 'meta'"
|
||||||
>
|
>
|
||||||
<summary
|
<summary
|
||||||
class="cursor-pointer select-none px-4 py-2.5 font-semibold text-sm text-[#3C393D] flex items-center gap-2"
|
class="cursor-pointer select-none px-4 py-2.5 font-semibold text-sm text-[#3C393D] flex items-center gap-2 list-none"
|
||||||
>
|
>
|
||||||
|
<span class="adm-chev text-gray-400 text-xs shrink-0">▶</span>
|
||||||
<span>{{ displayLabel }}</span>
|
<span>{{ displayLabel }}</span>
|
||||||
<span
|
<span
|
||||||
v-if="value.__component"
|
v-if="value.__component"
|
||||||
@@ -38,24 +39,29 @@
|
|||||||
</details>
|
</details>
|
||||||
|
|
||||||
<!-- Array: item list with add/remove/reorder -->
|
<!-- Array: item list with add/remove/reorder -->
|
||||||
<div v-else-if="kind === 'array'" class="space-y-2">
|
<details
|
||||||
<p class="text-sm font-semibold text-[#3C393D]">
|
v-else-if="kind === 'array'"
|
||||||
|
class="adm-arr"
|
||||||
|
:open="(depth ?? 0) < 1"
|
||||||
|
>
|
||||||
|
<summary
|
||||||
|
class="cursor-pointer select-none list-none flex items-center gap-1.5 text-sm font-semibold text-[#3C393D] py-1"
|
||||||
|
>
|
||||||
|
<span class="adm-chev text-gray-400 text-xs shrink-0">▶</span>
|
||||||
{{ displayLabel }}
|
{{ displayLabel }}
|
||||||
<span class="text-xs font-normal text-gray-400">({{ value.length }})</span>
|
<span class="text-xs font-normal text-gray-400">({{ value.length }})</span>
|
||||||
</p>
|
</summary>
|
||||||
|
<div class="space-y-2 mt-1">
|
||||||
<template v-for="(item, i) in value" :key="i">
|
<template v-for="(item, i) in value" :key="i">
|
||||||
<!-- Nesne öğeler: açılır-kapanır kart -->
|
<!-- Nesne öğeler: açılır-kapanır kart -->
|
||||||
<details
|
<details
|
||||||
v-if="item !== null && typeof item === 'object'"
|
v-if="item !== null && typeof item === 'object'"
|
||||||
class="border border-gray-200 rounded-xl bg-[#fafbfc] group/acc"
|
class="border border-gray-200 rounded-xl bg-[#fafbfc]"
|
||||||
>
|
>
|
||||||
<summary
|
<summary
|
||||||
class="flex items-center gap-1.5 px-3 py-2 text-xs text-gray-600 cursor-pointer select-none list-none"
|
class="flex items-center gap-1.5 px-3 py-2 text-xs text-gray-600 cursor-pointer select-none list-none"
|
||||||
>
|
>
|
||||||
<span
|
<span class="adm-chev text-gray-400 shrink-0">▶</span>
|
||||||
class="text-gray-400 transition-transform group-open/acc:rotate-90 shrink-0"
|
|
||||||
>▶</span
|
|
||||||
>
|
|
||||||
<span class="font-semibold truncate text-[13px]">{{
|
<span class="font-semibold truncate text-[13px]">{{
|
||||||
itemTitle(item, i)
|
itemTitle(item, i)
|
||||||
}}</span>
|
}}</span>
|
||||||
@@ -136,6 +142,7 @@
|
|||||||
+ Ekle
|
+ Ekle
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</details>
|
||||||
|
|
||||||
<!-- Primitive inside an array item (no label of its own) -->
|
<!-- Primitive inside an array item (no label of its own) -->
|
||||||
<div v-else-if="bare">
|
<div v-else-if="bare">
|
||||||
@@ -470,3 +477,14 @@ const renderPrimitive = () => {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
/* Ok her zaman KENDİ details'ini takip eder (iç içe yapılarda güvenli) */
|
||||||
|
.adm-chev {
|
||||||
|
display: inline-block;
|
||||||
|
transition: transform 0.15s ease;
|
||||||
|
}
|
||||||
|
details[open] > summary > .adm-chev {
|
||||||
|
transform: rotate(90deg);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user