33 lines
835 B
Vue
33 lines
835 B
Vue
<template>
|
||
<span class="logo" v-bind:class="{ invert }">M<span class="accent">o</span>b<span class="accent">ı</span>l<span class="accent">ı</span>z<span class="accent">o</span>n</span>
|
||
</template>
|
||
|
||
<script lang="ts">
|
||
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||
|
||
@Component
|
||
export default class Logo extends Vue {
|
||
@Prop({ type: Boolean, required: false, default: false }) invert!: boolean;
|
||
}
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
@import "../variables.scss";
|
||
@import "~typeface-signika/index.css";
|
||
|
||
.logo {
|
||
font-size: 3.5em;
|
||
color: $primary;
|
||
font-weight: 400;
|
||
font-family: Signika,serif;
|
||
|
||
&.invert {
|
||
color: $secondary;
|
||
}
|
||
|
||
span.accent::after {
|
||
content: "̇"; // U+0307
|
||
color: #fff;
|
||
}
|
||
}
|
||
</style>
|