Template section of Identichip

identichip-template.vue

<template>
    <div>
        <div class="identicard">
            <div class="identicard-shine">
                <div class="innerBorder-left">
                    <div class="identity">
                        <div class="name">{{identified.name}}</div>
                        <div class="birth-year">{{identified.birth_year}}</div>
                        <div class="eye-color">{{identified.eye_color}}</div>
                        <div class="gender">{{identified.gender}}</div>
                        <div class="species">{{species}}</div>
                        <div class="homeworld">{{homeworld}}</div>
                    </div>
                </div>
                <div class="halfMoons">
                    <div class="halfMoons-wrap">
                        <div class="halfMoon top"></div>
                        <div class="halfMoon middle"></div>
                        <div class="halfMoon bottom"></div>
                    </div>
                </div>
                <div class="innerBorder-right">
                    <div class="chip-wrap">
                        <svg class="chip-svg" width="194" height="392" viewBox="0 0 194 392" fill="none">
                            <path d="M148 382H12V306H44V234H180" stroke="#444D4D" stroke-width="11" />
                            <path d="M140 10H6V88H90M174 88H90M90 88V232" stroke="#444D4D" stroke-width="11" />
                            <path d="M182 156H120V308H182" stroke="#444D4D" stroke-width="11" />
                            <circle cx="141" cy="10" r="10" fill="#444D4D" />
                            <circle cx="174" cy="86" r="10" fill="#444D4D" />
                            <circle cx="180" cy="156" r="10" fill="#444D4D" />
                            <circle cx="180" cy="232" r="10" fill="#444D4D" />
                            <circle cx="184" cy="308" r="10" fill="#444D4D" />
                            <circle cx="146" cy="382" r="10" fill="#444D4D" />
                        </svg>
                    </div>
                    <div class="clip-wrap">
                        <div class="clip-each border-style-thin">
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <svg class="clip-svg">
            <defs>
                <clipPath id="octagon-clip" clipPathUnits="objectBoundingBox">
                    <polygon points="0.0 0, 0.8 0, 1 0.2, 1 0.8, 0.8 1, 0.2 1, 0 1" />
                </clipPath>
            </defs>
        </svg>
    </div>
</template>