traxxx/assets/components/actors/gender.vue

42 lines
929 B
Vue
Raw Permalink Normal View History

<template>
2020-07-05 02:27:46 +00:00
<span
v-if="gender"
class="gender"
:class="{ [gender]: true }"
><Icon :icon="gender" /></span>
</template>
<script>
export default {
2020-07-05 02:27:46 +00:00
props: {
gender: {
type: String,
default: null,
},
},
};
</script>
<style lang="scss" scoped>
@import 'theme';
.gender {
&.female .icon {
2020-07-05 02:27:46 +00:00
fill: var(--female);
2021-03-23 19:37:20 +00:00
filter: drop-shadow(0 0 1px var(--darken));
}
&.male .icon {
2020-07-05 02:27:46 +00:00
fill: var(--male);
2021-03-23 19:37:20 +00:00
filter: drop-shadow(0 0 1px var(--darken));
}
&.transsexual .icon {
2021-03-23 19:37:20 +00:00
fill: var(--text-light);
2020-07-05 02:27:46 +00:00
filter: drop-shadow(1px 0 0 var(--female)) drop-shadow(-1px 0 0 var(--female)) drop-shadow(0 1px 0 var(--female)) drop-shadow(0 -1px 0 var(--female))
drop-shadow(1px 0 0 var(--male)) drop-shadow(-1px 0 0 var(--male)) drop-shadow(0 1px 0 var(--male)) drop-shadow(0 -1px 0 var(--male))
2021-03-23 19:37:20 +00:00
drop-shadow(0 0 1px var(--darken))
}
}
</style>