profectus/TMT-Demo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Large achievement styling changes

Browse source
This commit is contained in:
thepaperpilot 2023-04-03 08:15:16 -05:00
parent 3012590da7
commit e349258103
1 changed files with 6 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/features/achievements/Achievement.vue
View file

@ -12,7 +12,7 @@
feature: true, feature: true,
achievement: true, achievement: true,
locked: !unref(earned), locked: !unref(earned),
bought: unref(earned), done: unref(earned),
small: unref(small), small: unref(small),
...unref(classes) ...unref(classes)
}" }"
@ -60,7 +60,7 @@ export default defineComponent({
MarkNode MarkNode
}, },
setup(props) { setup(props) {
const { display, requirements } = toRefs(props); const { display, requirements, earned } = toRefs(props);
const comp = shallowRef<Component | string>(""); const comp = shallowRef<Component | string>("");
@ -76,7 +76,9 @@ export default defineComponent({
} }
const Requirement = coerceComponent(currDisplay.requirement ? currDisplay.requirement : jsx(() => displayRequirements(unwrapRef(requirements) ?? [])), "h3"); const Requirement = coerceComponent(currDisplay.requirement ? currDisplay.requirement : jsx(() => displayRequirements(unwrapRef(requirements) ?? [])), "h3");
const EffectDisplay = coerceComponent(currDisplay.effectDisplay || "", "b"); const EffectDisplay = coerceComponent(currDisplay.effectDisplay || "", "b");
const OptionsDisplay = coerceComponent(currDisplay.optionsDisplay || "", "span"); const OptionsDisplay = unwrapRef(earned) ?
coerceComponent(currDisplay.optionsDisplay || "", "span") :
"";
comp.value = coerceComponent( comp.value = coerceComponent(
jsx(() => ( jsx(() => (
<span> <span>
@ -117,6 +119,7 @@ export default defineComponent({
} }
.achievement:not(.small) { .achievement:not(.small) {
height: unset;
width: calc(100% - 10px); width: calc(100% - 10px);
min-width: 120px; min-width: 120px;
padding-left: 5px; padding-left: 5px;