<template>
    <div class="icon-container">
        <svg xmlns="http://www.w3.org/2000/svg" width="192" height="192" viewBox="0 0 24 24" class="camera-online-icon">
            <path fill="currentColor"
                d="M4 20q-.825 0-1.412-.587T2 18V6q0-.825.588-1.412T4 4h12q.825 0 1.413.588T18 6v4.5l4-4v11l-4-4V18q0 .825-.587 1.413T16 20z" />
        </svg>
    </div>
</template>

<style scoped>
.icon-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.camera-online-icon {
    width: 2rem;
    /* 控制图标的宽度 */
    height: 2rem;
    /* 控制图标的高度 */
    fill: #29099c;
    opacity: 0.8;
    color: rgb(40, 222, 235);
    background-color: transparent;
    border-radius: 4px;
}
</style>