60 lines
1.1 KiB
Vue
60 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
</script>
|
|
|
|
<template>
|
|
<view class="container">
|
|
<view class="uni-helper-logo">
|
|
<image class="uni-helper-logo__image" src="/static/logo.svg" />
|
|
<text class="uni-helper-logo__label green">
|
|
uni-helper
|
|
</text>
|
|
</view>
|
|
<text class="link-bar">
|
|
+
|
|
</text>
|
|
<view class="uni-helper-logo">
|
|
<image class="uni-helper-logo__image" src="/static/vite.png" />
|
|
<text class="uni-helper-logo__label purple">
|
|
Vite
|
|
</text>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
.container {
|
|
display: inline-flex;
|
|
font-size: 1.5rem;
|
|
font-weight: 300;
|
|
&:hover {
|
|
.link-bar {
|
|
transform: rotate(135deg);
|
|
}
|
|
}
|
|
}
|
|
.uni-helper-logo {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
.uni-helper-logo__image {
|
|
display: inline-block;
|
|
height: 4.5rem;
|
|
width: 4.5rem;
|
|
}
|
|
.uni-helper-logo__label {
|
|
margin-top: -0.5rem;
|
|
}
|
|
.green {
|
|
color: #22c55e;
|
|
};
|
|
.purple {
|
|
color: #a855f7;
|
|
}
|
|
}
|
|
.link-bar {
|
|
color: #9ca3af;
|
|
margin: auto 1em;
|
|
transition: all 500ms cubic-bezier(0.4, 0, 0.2, 1);
|
|
}
|
|
</style>
|