Nixyri/AntimatterDimensionsSourceCode
1
0
Fork 0
mirror of https://github.com/IvarK/AntimatterDimensionsSourceCode.git synced 2024-11-22 20:22:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

laitela UI changes for momsi

Browse Source
This commit is contained in:
IvarK 2019-08-31 22:43:24 +03:00
parent f205858aa1
commit c76f6c76f6
2 changed files with 68 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
javascripts/components/celestials/subtabs/laitela-tab.js
View File

@ -61,22 +61,6 @@ Vue.component("laitela-tab", {
},
template:
`<div class="l-laitela-celestial-tab">
<button class="o-laitela-run-button" @click="startRun">
<b>Start Lai'tela's Reality</b>
<div class="o-laitela-run-button__icon">ᛝ</div>
Tickspeed is disabled and all dimension multipliers are decreased based on matter,
currently <b>x^{{ shorten(dimMultNerf, 3, 4) }}</b>
<br>
Multiply all dark matter dimensions based on highest AM reached,
Currently: <b>{{ shorten(realityReward, 2, 3)}}x</b>
</button>
<button class="c-laitela-annihilation-button" @click="annihilate()" v-if="showReset">
<h2>Annihilation</h2>
<p>
Resets your dark matter dimensions and Dark Matter, but gain <b>{{ shorten(higgsGain, 2, 0) }}</b>
Higgs {{"Boson" | pluralize(higgsGain)}}
</p>
</button>
<div class="o-laitela-matter-amount">You have {{ shorten(matter, 2, 0) }} Dark Matter</div>
<div v-if="annihilated">You have {{ shorten(higgs, 2, 0)}} Higgs {{"Boson" | pluralize(higgs)}}</div>
<div v-if="higgs.gt(0)">Which cause you to have a {{ (darkEnergyChance * 100).toFixed(2) }}% chance of generating dark energy each dimension interval</div>
@ -102,5 +86,36 @@ Vue.component("laitela-tab", {
</button>
</div>
</div>
<div class="l-laitela-mechanics-lower">
<div class="l-laitela-buttons-container">
<button class="o-laitela-run-button" @click="startRun">
<b>Start Lai'tela's Reality</b>
<div class="o-laitela-run-button__icon">ᛝ</div>
Tickspeed is disabled and all dimension multipliers are decreased based on matter,
currently <b>x^{{ shorten(dimMultNerf, 3, 4) }}</b>
<br>
Multiply all dark matter dimensions based on highest AM reached,
Currently: <b>{{ shorten(realityReward, 2, 3)}}x</b>
</button>
<button class="c-laitela-annihilation-button" @click="annihilate()" v-if="showReset">
<h2>Annihilation</h2>
<p>
Resets your dark matter dimensions and Dark Matter, but gain <b>{{ shorten(higgsGain, 2, 0) }}</b>
Higgs {{"Boson" | pluralize(higgsGain)}}
</p>
</button>
</div>
<div class="l-laitela-dark-energy-upgrades">
<button
v-for="upgrade in upgrades"
:key="upgrade.id"
class="o-laitela-shop-button--dark-energy"
:class="{'o-laitela-shop-button--available': upgrade.canBeBought }"
@click="upgrade.purchase()">
{{ upgrade.description }} <br/> Costs: <b>{{ shorten(upgrade.cost, 2, 0) }}</b> Higgs Bosons
<br/>Currently: {{ upgrade.formattedEffect }}, Next: {{ upgrade.formattedNextEffect }}
</button>
</div>
</div>
</div>`
});

42
stylesheets/styles.css
View File

@ -6274,7 +6274,7 @@ kbd {
/* #startregion laitela tab*/
.o-laitela-run-button {
width: 25rem;
width: 50%;
padding: 2rem;
border-radius: .5rem;
border: .2rem solid black;
@ -6282,7 +6282,6 @@ kbd {
font-family: Typewriter;
font-size: 1.2rem;
cursor: pointer;
margin-bottom: 2rem;
}
.o-laitela-matter-amount {
@ -6334,6 +6333,22 @@ kbd {
justify-content: center;
}
.l-laitela-mechanics-lower {
display: flex;
justify-content: center;
}
.l-laitela-buttons-container {
display: flex;
width: 52rem;
}
.l-laitela-dark-energy-upgrades {
width: 52rem;
display: flex;
flex-wrap: wrap;
}
.o-laitela-shop-button {
width: 22rem;
padding: 1rem;
@ -6343,7 +6358,25 @@ kbd {
margin-left: 1rem;
margin-bottom: 2rem;
font-family: Typewriter;
min-height: 15rem;
min-height: 17.8rem;
}
@keyframes darkEnergyGlow {
0% { box-shadow: 0px 0px 0px rgb(53, 10, 53); }
50% { box-shadow: 0px 0px 5px rgb(53, 10, 53); }
100% { box-shadow: 0px 0px 0px rgb(53, 10, 53); }
}
.o-laitela-shop-button--dark-energy {
width: 22rem;
padding: 1rem;
background: white;
border: .2rem solid black;
border-radius: .5rem;
margin-left: 1rem;
margin-bottom: 2rem;
font-family: Typewriter;
animation: 5s darkEnergyGlow infinite;
}
.o-laitela-shop-button--available {
@ -6393,12 +6426,11 @@ kbd {
.c-laitela-annihilation-button {
padding: 2rem;
width: 30rem;
width: 50%;
background: white;
border: .2rem solid black;
border-radius: .5rem;
font-family: Typewriter, serif;
margin: 2rem auto;
cursor: pointer;
transition-duration: 0.3s;
display: block