bnilsen/custom_ui
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

build

Browse source
This commit is contained in:
Casey Wittrock 2025-10-22 02:21:19 -05:00
parent 3ecf24c3ea
commit cdb1bb30b1
18 changed files with 337 additions and 128 deletions
Download patch file Download diff file Expand all files Collapse all files

49
frontend/src/App.vue
View file

@ -1,30 +1,37 @@
<script setup>
import HelloWorld from './components/HelloWorld.vue'
import { IconoirProvider } from "@iconoir/vue";
import SideBar from "./components/SideBar.vue";
</script>
<template>
<div>
<a href="https://vite.dev" target="_blank">
<img src="/vite.svg" class="logo" alt="Vite logo" />
</a>
<a href="https://vuejs.org/" target="_blank">
<img src="./assets/vue.svg" class="logo vue" alt="Vue logo" />
</a>
</div>
<HelloWorld msg="Vite + Vue" />
<IconoirProvider
:icon-props="{
color: 'white',
'stroke-width': 2,
width: '1.2em',
height: '1.2em',
}"
>
<div id="snw-ui">
<SideBar />
<div id="display-content">
<RouterView />
</div>
</div>
</IconoirProvider>
</template>
<style scoped>
.logo {
height: 6em;
padding: 1.5em;
will-change: filter;
transition: filter 300ms;
<style lang="css">
#snw-ui {
display: flex;
flex-direction: row;
width: 100vw;
}
.logo:hover {
filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
filter: drop-shadow(0 0 2em #42b883aa);
#display-content {
flex-grow: 1;
margin-left: auto;
margin-right: auto;
max-width: 75vw;
}
</style>