fixed missed renames to dark-matter-dimension

styles and matter-dimension-row
This commit is contained in:
WaitingIdly 2021-12-04 20:43:39 -08:00
parent b63dd78c3a
commit 8a2cae7aef
3 changed files with 22 additions and 22 deletions

View File

@ -1,4 +1,4 @@
Vue.component("matter-dimension-row", {
Vue.component("dark-matter-dimension-row", {
props: {
tier: Number
},
@ -35,8 +35,8 @@ Vue.component("matter-dimension-row", {
},
intervalClassObject() {
return {
"o-matter-dimension-button--available": this.canBuyInterval,
"o-matter-dimension-button--ascend": this.isIntervalCapped
"o-dark-matter-dimension-button--available": this.canBuyInterval,
"o-dark-matter-dimension-button--ascend": this.isIntervalCapped
};
},
intervalText() {
@ -91,14 +91,14 @@ Vue.component("matter-dimension-row", {
}
},
template: `
<div class="c-matter-dimension-container" v-if="isUnlocked">
<div class="o-matter-dimension-amount">
<div class="c-dark-matter-dimension-container" v-if="isUnlocked">
<div class="o-dark-matter-dimension-amount">
{{ name }}<span v-if="hasAscended"> {{ ascensionText }}</span>: {{ format(amount, 2) }}
</div>
<div class="c-matter-dimension-buttons">
<div class="c-dark-matter-dimension-buttons">
<button
@click="handleIntervalClick"
class="o-matter-dimension-button"
class="o-dark-matter-dimension-button"
:class="intervalClassObject"
>
{{ intervalText }}
@ -115,15 +115,15 @@ Vue.component("matter-dimension-row", {
</button>
<button
@click="buyPowerDM"
class="o-matter-dimension-button"
:class="{ 'o-matter-dimension-button--available': canBuyPowerDM }"
class="o-dark-matter-dimension-button"
:class="{ 'o-dark-matter-dimension-button--available': canBuyPowerDM }"
>
DM {{ formatX(powerDM, 2, 2) }}<br>Cost: {{ formatDMCost(powerDMCost) }}
</button>
<button
@click="buyPowerDE"
class="o-matter-dimension-button"
:class="{ 'o-matter-dimension-button--available': canBuyPowerDE }"
class="o-dark-matter-dimension-button"
:class="{ 'o-dark-matter-dimension-button--available': canBuyPowerDE }"
>
DE +{{ format(powerDE, 2, 4) }}
<br>

View File

@ -3,7 +3,7 @@ import "../dark-matter-dimension-row.js";
Vue.component("dark-matter-dimension-group", {
template: `
<span>
<matter-dimension-row
<dark-matter-dimension-row
v-for="tier in 4"
:key="tier"
:tier="tier"

View File

@ -7541,7 +7541,7 @@ kbd {
margin-bottom: 0.5rem;
}
.c-matter-dimension-container {
.c-dark-matter-dimension-container {
color: var(--color-laitela--accent);
border: 0.2rem solid var(--color-laitela--accent);
background: var(--color-laitela--base);
@ -7553,18 +7553,18 @@ kbd {
height: 15rem;
}
.s-base--metro .c-matter-dimension-container {
.s-base--metro .c-dark-matter-dimension-container {
border-width: 0.1rem;
border-radius: 0;
}
.o-matter-dimension-amount {
.o-dark-matter-dimension-amount {
font-size: 1.6rem;
font-weight: bold;
margin-bottom: 1rem;
}
.c-matter-dimension-buttons {
.c-dark-matter-dimension-buttons {
display: flex;
flex-direction: row;
justify-content: space-between;
@ -7572,7 +7572,7 @@ kbd {
height: 6rem;
}
.o-matter-dimension-button {
.o-dark-matter-dimension-button {
width: 15rem;
height: 5rem;
margin-bottom: 1rem;
@ -7584,12 +7584,12 @@ kbd {
transition-duration: 0.15s;
}
.s-base--metro .o-matter-dimension-button {
.s-base--metro .o-dark-matter-dimension-button {
border-width: 0.1rem;
border-radius: 0;
}
.o-matter-dimension-button--available {
.o-dark-matter-dimension-button--available {
color: var(--color-laitela--base);
background: var(--color-laitela--accent);
border-color: var(--color-laitela--accent);
@ -7598,13 +7598,13 @@ kbd {
font-weight: bold;
}
.o-matter-dimension-button--available:hover {
.o-dark-matter-dimension-button--available:hover {
color: var(--color-laitela--accent);
background: var(--color-laitela--base);
box-shadow: none;
}
.o-matter-dimension-button--ascend {
.o-dark-matter-dimension-button--ascend {
color: var(--color-laitela--base);
background: var(--color-laitela--accent);
border-color: var(--color-laitela--accent);
@ -7629,7 +7629,7 @@ kbd {
}
}
.o-matter-dimension-button--ascend:hover {
.o-dark-matter-dimension-button--ascend:hover {
color: var(--color-laitela--accent);
background: var(--color-laitela--base);
box-shadow: none;