generated from cms/tibi-docs
This commit is contained in:
parent
4e283573bd
commit
8d626450f6
@ -61,3 +61,15 @@
|
|||||||
id: 8
|
id: 8
|
||||||
- name: Immobilienbestand
|
- name: Immobilienbestand
|
||||||
id: 9
|
id: 9
|
||||||
|
|
||||||
|
- name: verticalShift
|
||||||
|
type: number
|
||||||
|
meta:
|
||||||
|
label: Vertikale Verschiebung
|
||||||
|
helperText: "Die Karte wird um die angegebene Anzahl in Prozent nach oben verschoben."
|
||||||
|
|
||||||
|
- name: horizontalShift
|
||||||
|
type: number
|
||||||
|
meta:
|
||||||
|
label: Horizontale Verschiebung
|
||||||
|
helperText: "Die Karte wird um die angegebene Anzahl in Prozent nach rechts verschoben."
|
||||||
|
@ -7,7 +7,7 @@
|
|||||||
export let selected: boolean[]
|
export let selected: boolean[]
|
||||||
let props
|
let props
|
||||||
$: {
|
$: {
|
||||||
props = chunkArray([...card.properties], 5)
|
props = chunkArray([...card.properties], card.properties.length > 8 ? 5 : 4)
|
||||||
}
|
}
|
||||||
|
|
||||||
function chunkArray(myArray, chunk_size): number[][] {
|
function chunkArray(myArray, chunk_size): number[][] {
|
||||||
@ -31,11 +31,15 @@
|
|||||||
'center'};"
|
'center'};"
|
||||||
>
|
>
|
||||||
<div class="inner-container">
|
<div class="inner-container">
|
||||||
<div class="title" class:active="{card.properties.some((v, i) => selected[v])}">
|
<div
|
||||||
|
class="title"
|
||||||
|
class:active="{card.properties.some((v, i) => selected[v])}"
|
||||||
|
style="top: {card.verticalShift || 0}%; left: {card.horizontalShift || 0}%;"
|
||||||
|
>
|
||||||
{card.title}
|
{card.title}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="properties">
|
<div class="properties" style="top: {card.verticalShift || 0}%; left: {card.horizontalShift || 0}%;">
|
||||||
{#each props as propertyRow, i (i)}
|
{#each props as propertyRow, i (i)}
|
||||||
<div class="property-row">
|
<div class="property-row">
|
||||||
{#each propertyRow as property, j (j)}
|
{#each propertyRow as property, j (j)}
|
||||||
@ -95,6 +99,8 @@
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
.title {
|
.title {
|
||||||
font-size: min(1.6vw, 14px);
|
font-size: min(1.6vw, 14px);
|
||||||
|
position: relative;
|
||||||
|
z-index: 200;
|
||||||
padding: 2px 5px;
|
padding: 2px 5px;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
@media @tablet {
|
@media @tablet {
|
||||||
@ -112,9 +118,11 @@
|
|||||||
|
|
||||||
.properties {
|
.properties {
|
||||||
display: none;
|
display: none;
|
||||||
|
position: relative;
|
||||||
@media @desktop {
|
@media @desktop {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
z-index: 200;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 5px;
|
gap: 5px;
|
||||||
.property-row {
|
.property-row {
|
||||||
|
@ -11,7 +11,6 @@
|
|||||||
["IN", "Infrastruktur"],
|
["IN", "Infrastruktur"],
|
||||||
["W", "Waldwirtschaft"],
|
["W", "Waldwirtschaft"],
|
||||||
["IE", "Immobilien-Entwicklung"],
|
["IE", "Immobilien-Entwicklung"],
|
||||||
|
|
||||||
["R", "Renten"],
|
["R", "Renten"],
|
||||||
["VC", "Venture Capital"],
|
["VC", "Venture Capital"],
|
||||||
["PD", "Private Debt"],
|
["PD", "Private Debt"],
|
||||||
|
Loading…
Reference in New Issue
Block a user