Template:TypeIcon/style.css

.type-icon {
    position: relative;
    display:inline-block;
    border: 1px solid #0000002b;
    border-radius: 2px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 75%;
}

.type-icon {
    width: 16px;
    height: 16px;
    margin: -4px 0px;
}

.type-icon.size-32,
.type-list .type-icon {
    width:32px;
    height:32px;
    margin: 0 1px;
}

.type-icon.attack {
    /* background-image: url('https://static.miraheze.org/bluearchivewiki/0/00/Attack.png'); */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54.25 59.82'%3E%3Cg%3E%3Cg fill='%23ffffffb3'%3E%3Crect width='43.01' height='6.03' x='-3.14' y='39.6' rx='1.03' transform='rotate(38.13 18.36 42.62)'/%3E%3Cpath d='M13.71 41.16 3 50.2a1.18 1.18 0 0 0 .2 1.65l9.8 7.72a1.18 1.18 0 0 0 1.65-.2L21 47.11Zm14.02-.46-9-7.09c-.56-.44-1.37-1.34-.93-1.9L33.59 2a1.29 1.29 0 0 1 .86-.49L51.81 0l2.43 17a1.32 1.32 0 0 1-.24 1L29.45 40.88c-.45.56-1.16.26-1.72-.18Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.type-icon.armor {
    /* background-image: url('https://static.miraheze.org/bluearchivewiki/0/06/Armor.png'); */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 49.17 59.31'%3E%3Cpath fill='%23ffffffb3' d='M48.83 11.88C33.9 12.38 25.27 0 24.58 0S15.27 12.38.33 11.88c0 0-1 22.42.5 26.87C6.77 56.19 21.26 58 24.58 59.31 27.9 58 42.4 56.19 48.33 38.75c1.52-4.45.5-26.87.5-26.87ZM37 35.31c-3.1 9.11-10.67 10.06-12.41 10.74-1.73-.68-9.3-1.63-12.41-10.74-.79-2.33-.26-14-.26-14 7.81.26 12.31-6.22 12.67-6.21s4.87 6.47 12.67 6.21c-.01-.04.52 11.69-.26 14Z'/%3E%3C/svg%3E");
}

.type-icon.enemy {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 53 54.73'%3E%3Cpath fill='%23ffffffb3' d='M53 26.5A26.5 26.5 0 1 0 6.31 43.66a9.28 9.28 0 0 0-1.1 5.3A9.39 9.39 0 0 0 8 54.73a11.77 11.77 0 0 1 2.53-3.46 11.35 11.35 0 0 1 2.64-1.86 26.51 26.51 0 0 0 26.66 0 11.31 11.31 0 0 1 2.62 1.85A11.77 11.77 0 0 1 45 54.73a9.39 9.39 0 0 0 2.81-5.79 9.29 9.29 0 0 0-1.09-5.27A26.33 26.33 0 0 0 53 26.5Zm-31.06 6.81a5.41 5.41 0 0 1-3.69 1.07 8.35 8.35 0 0 1-5.17-2.1 10.73 10.73 0 0 1-3.64-6.34 11.58 11.58 0 0 1-.35-2.1 11 11 0 0 1 .09-2.3 87.98 87.98 0 0 0 14.49 8.77 5 5 0 0 1-1.73 3ZM44 23.84a11.58 11.58 0 0 1-.35 2.1A10.68 10.68 0 0 1 40 32.28a8.35 8.35 0 0 1-5.17 2.1 5.41 5.41 0 0 1-3.69-1.07 5 5 0 0 1-1.73-3 85.5 85.5 0 0 0 14.49-8.77 11 11 0 0 1 .1 2.3Z'/%3E%3C/svg%3E");
}

.type-icon.enemy.boss {
    background-size: 100%;
    background-position: center 33%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 73.68 56.23'%3E%3Cpath fill='%23ffffffb3' d='M71.66 0a10.48 10.48 0 0 1-2.86 6.56c-1.35 1.32-2.8 1.85-5.3 2.75a32.67 32.67 0 0 1-6.38 1.63 26.49 26.49 0 0 0-40.6 0 32.43 32.43 0 0 1-6.37-1.63c-2.45-.9-3.91-1.43-5.27-2.75A10.41 10.41 0 0 1 2 0c-.31.57-3.59 6.29-1 11.56 1.73 3.58 5.37 5.34 6.87 6.06A17.35 17.35 0 0 0 11.91 19a26.48 26.48 0 0 0 4.74 26.18 9.34 9.34 0 0 0-1.11 5.3 9.44 9.44 0 0 0 2.81 5.79 11.77 11.77 0 0 1 2.53-3.46 11.35 11.35 0 0 1 2.64-1.86 26.49 26.49 0 0 0 26.65 0 11.6 11.6 0 0 1 5.15 5.31A9.16 9.16 0 0 0 57 45.17 26.55 26.55 0 0 0 61.77 19a17.2 17.2 0 0 0 4.07-1.38c1.51-.72 5.14-2.48 6.88-6.06C75.27 6.29 72 .57 71.66 0ZM32.28 34.81a5.41 5.41 0 0 1-3.69 1.07 8.38 8.38 0 0 1-5.17-2.1 10.79 10.79 0 0 1-3.64-6.34 10.83 10.83 0 0 1-.34-2.1 11 11 0 0 1 .08-2.3 89.75 89.75 0 0 0 14.49 8.77 5 5 0 0 1-1.73 3Zm22.06-9.47a11.66 11.66 0 0 1-.34 2.1 10.79 10.79 0 0 1-3.64 6.34 8.42 8.42 0 0 1-5.18 2.1 5.38 5.38 0 0 1-3.68-1.07 5.13 5.13 0 0 1-1.74-3 87.4 87.4 0 0 0 14.5-8.77 11.77 11.77 0 0 1 .08 2.3Z'/%3E%3C/svg%3E");
}


.type-icon.inactive {
    /* filter: grayscale(0.8); */
    opacity: 0.35;
}


/* .type-icon.boss {
    border-color: #97362c;
} */

.type-icon.boss::after {
    content: "BOSS";
    position: absolute;
    bottom: -4px;
    left: -3px;
    right: -3px;
    /* background: red; */
    border-radius: 5px;
    text-shadow: 1px 1px black, -1px 1px black, 1px -1px black, -1px -1px black, 1px 0px black, -1px 0px black;
    color: #ff5544;
    font-size: 9px;
    text-align: center;
    line-height: 9px;
    font-style: italic;
    font-stretch: ultra-condensed;
}