# All files / js/components PlaceholderPattern.vue

0% Statements 0/3
0% Branches 0/2
0% Functions 0/1
0% Lines 0/3

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34

     <script setup lang="ts">
    import { computed } from 'vue';

    const patternId = computed(
        () => `pattern-${Math.random().toString(36).substring(2, 9)}`,
    );
    </script>

    <template>
        <svg
            class="absolute inset-0 size-full stroke-neutral-900/20 dark:stroke-neutral-100/20"
            fill="none"
        >
            <defs>
                <pattern
                    :id="patternId"
                    x="0"
                    y="0"
                    width="8"
                    height="8"
                    patternUnits="userSpaceOnUse"
                >
                    <path d="M-1 5L5 -1M3 9L8.5 3.5" stroke-width="0.5"></path>
                </pattern>
            </defs>
            <rect
                stroke="none"
                :fill="`url(#${patternId})`"
                width="100%"
                height="100%"
            ></rect>
        </svg>
    </template>