Made MainDisplay sticky

This commit is contained in:
thepaperpilot 2022-07-03 12:27:44 -05:00
parent 64d6aae1c0
commit 62d23ec699

View file

@ -1,15 +1,17 @@
<template> <template>
<div> <Sticky>
<div class="main-display">
<span v-if="showPrefix">You have </span> <span v-if="showPrefix">You have </span>
<ResourceVue :resource="resource" :color="color || 'white'" /> <ResourceVue :resource="resource" :color="color || 'white'" />
{{ resource.displayName {{ resource.displayName
}}<!-- remove whitespace --> }}<!-- remove whitespace -->
<span v-if="effectComponent">, <component :is="effectComponent" /></span> <span v-if="effectComponent">, <component :is="effectComponent" /></span>
<br /><br />
</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>