Large achievement styling changes
This commit is contained in:
parent
2b1250fb38
commit
61bc53f954
1 changed files with 6 additions and 3 deletions
|
@ -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;
|
||||||
|
|
Loading…
Reference in a new issue