profectus/Profectus
Template
1
0
Fork 4
Code Issues 38 Pull requests 6 Projects 2 Releases Packages Wiki Activity Actions

Made MainDisplay sticky

Browse source
This commit is contained in:
thepaperpilot 2022-07-03 12:27:44 -05:00
parent 64d6aae1c0
commit 62d23ec699
1 changed files with 18 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
src/features/resources/MainDisplay.vue
View file

@ -1,15 +1,17 @@
<template> <template>
<div> <Sticky>
<span v-if="showPrefix">You have </span> <div class="main-display">
<ResourceVue :resource="resource" :color="color || 'white'" /> <span v-if="showPrefix">You have </span>
{{ resource.displayName <ResourceVue :resource="resource" :color="color || 'white'" />
}}<!-- remove whitespace --> {{ resource.displayName
<span v-if="effectComponent">, <component :is="effectComponent" /></span> }}<!-- remove whitespace -->
<br /><br /> <span v-if="effectComponent">, <component :is="effectComponent" /></span>
</div> </div>
</Sticky>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import Sticky from "components/layout/Sticky.vue";
import type { CoercableComponent } from "features/feature"; import type { CoercableComponent } from "features/feature";
import type { Resource } from "features/resources/resource"; import type { Resource } from "features/resources/resource";
import ResourceVue from "features/resources/Resource.vue"; import ResourceVue from "features/resources/Resource.vue";
@ -35,3 +37,11 @@ const showPrefix = computed(() => {
return Decimal.lt(props.resource.value, "1e1000"); return Decimal.lt(props.resource.value, "1e1000");
}); });
</script> </script>
<style>
.main-display {
height: 50px;
line-height: 50px;
margin-bottom: 20px;
}
</style>