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

ra ui css cleanup/theme styling fixes

Browse Source
This commit is contained in:
Omsi 2022-01-31 00:51:02 -08:00 committed by cyip92
parent 824a96ac70
commit c9c8c0eaf7
5 changed files with 77 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
javascripts/components/celestials/subtabs/laitela/laitela-center-pane.js
View File

@ -28,10 +28,7 @@ Vue.component("annihilation-button", {
},
computed: {
annihilationInputStyle() {
return {
width: "6rem",
"background-color": this.isEnabled ? "" : "var(--color-disabled)",
};
return { "background-color": this.isEnabled ? "" : "var(--color-bad)" };
}
},
methods: {
@ -85,6 +82,7 @@ Vue.component("annihilation-button", {
v-model="autoAnnihilationInput"
@change="handleAutoAnnihilationInputChange()"
:style="annihilationInputStyle"
class="c-laitela-annihilation-input"
/>
to the multiplier.
</span>

2
javascripts/components/celestials/subtabs/laitela/singularity-milestone.js
View File

@ -93,10 +93,12 @@ Vue.component("singularity-milestone", {
this.currentCondenseTime = Singularity.timeUntilCap;
this.autoCondenseDelay = Singularity.timeDelayFromAuto;
this.lastCheckedMilestones = player.celestials.laitela.lastCheckedMilestones;
this.isMetro = Theme.current().isMetro;
},
},
template: `
<div :class="containerClass">
<div v-if="!isMetro && !isMaxed" class="c-laitela-milestone--bar-border-fix"></div>
<div
:class="barClass"
:style="barStyle"

16
public/images/laitela-icon-dark.svg
View File

@ -1 +1,15 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 13 21"><defs><style>.cls-1{fill:#231f20;}</style></defs><title>Asset 1 out</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><g id="Layer_1-2-2" data-name="Layer 1-2"><g id="Layer_1-2-2-2" data-name="Layer 1-2-2"><path class="cls-1" d="M0,21l4.83-5.12L0,10.85v-.67L4.89,5.06,0,0H3.25L6.49,3.39,9.74,0H13L8.11,5.06,13,10.18v.67L8.11,15.91,13,21H9.74L6.49,17.61,3.25,21ZM6,6.24,2.47,9.91,6,13.68,9.5,9.91Z"/></g></g></g></g></svg>
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 24.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 13 21" style="enable-background:new 0 0 13 21;" xml:space="preserve">
<g id="Layer_2_1_">
<g id="Layer_1-2">
<g id="Layer_1-2-2">
<g id="Layer_1-2-2-2">
<path d="M0,21l4.8-5.1l-4.8-5v-0.7l4.9-5.1L0,0h3.3l3.2,3.4L9.7,0H13L8.1,5.1l4.9,5.1v0.7l-4.9,5.1L13,21H9.7l-3.3-3.4L3.3,21H0
z M6,6.2L2.5,9.9L6,13.7l3.5-3.8L6,6.2z"/>
</g>
</g>
</g>
</g>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 512 B

After

Width:  |  Height:  |  Size: 643 B

65
public/stylesheets/styles.css
View File

@ -7790,21 +7790,16 @@ kbd {
padding: 0.6rem;
margin: 1rem 0 0;
border-radius: 0.5rem;
border: 0.2rem solid;
border: 0.1rem solid;
position: relative;
z-index: 0;
color: var(--color-laitela--accent);
}
.s-base--metro .c-laitela-milestone {
border-width: 0.1rem;
border-radius: 0;
}
.l-singularity-milestone-modal-container-inner .c-laitela-milestone {
box-shadow: 0.1rem 0.1rem 0.3rem black;
}
.c-laitela-milestone__progress {
position: absolute;
top: 0;
@ -7813,19 +7808,29 @@ kbd {
z-index: -1;
}
.c-laitela-milestone--bar-border-fix {
position: absolute;
height: calc(100% + 0.2rem);
width: calc(100% + 0.2rem);
border-radius: 0.5rem;
border: 0.2rem solid;
z-index: 1;
color: var(--color-laitela--accent);
margin: -0.7rem;
}
.l-singularity-milestone-modal-container {
box-shadow: none;
}
.c-laitela-milestone-mask {
background: inherit;
filter: invert(100%);
background-color: white;
mix-blend-mode: difference;
z-index: 1
z-index: 0;
}
.c-laitela-milestone--completed {
filter: brightness(90%) invert(100%);
filter: brightness(10%);
left: 1.5rem;
top: -1.5rem;
height: 21.8rem;
@ -7834,6 +7839,7 @@ kbd {
background-image: url(../images/laitela-icon.svg);
background-position: center;
background-repeat: repeat-y;
background-color: transparent;
}
.c-laitela-singularity-container {
@ -7913,6 +7919,10 @@ kbd {
background: var(--color-laitela--accent);
}
.l-singularity-milestone-modal {
height: 60rem;
}
.l-singularity-milestone-modal-container-outer {
height: 50rem;
overflow-y: scroll;
@ -7937,7 +7947,11 @@ kbd {
padding-bottom: 2rem;
}
.l-singularity-milestone-modal-sort-button {
.l-singularity-milestone-modal-container-inner .c-laitela-milestone {
height: 19rem;
}
.c-singularity-milestone-modal-sort-button {
height: 6rem;
width: 22.5rem;
font-family: Typewriter, serif;
@ -7946,8 +7960,20 @@ kbd {
color: var(--color-laitela--accent);
background-color: var(--color-laitela--base);
border: 0.1rem solid var(--color-laitela--accent);
border-radius: 0.5rem;
cursor: pointer;
margin: 0.5rem;
transition-duration: 0.15s;
}
.s-base--metro .c-singularity-milestone-modal-sort-button {
border-width: 0.1rem;
border-radius: 0;
}
.c-singularity-milestone-modal-sort-button:hover {
color: var(--color-laitela--base);
background-color: var(--color-laitela--accent);
}
.o-laitela-singularity-modal-button {
@ -8047,6 +8073,11 @@ kbd {
font-size: 1.2rem;
}
.s-base--metro .l-laitela-annihilation-container {
border-width: 0.1rem;
border-radius: 0;
}
.l-laitela-annihilation-button {
color: var(--color-laitela--accent);
background: var(--color-laitela--base);
@ -8054,6 +8085,7 @@ kbd {
width: 35rem;
height: 3rem;
border: 0.2rem solid var(--color-laitela--accent);
border-radius: 0.5rem;
font-family: Typewriter, serif;
}
@ -8080,6 +8112,17 @@ kbd {
color: var(--color-laitela--base) !important; /* h2 color overrides this */
}
.c-laitela-annihilation-input {
width: 6rem;
border-color: var(--color-laitela--accent);
border-radius: 0.5rem;
}
.s-base--metro .c-laitela-annihilation-input {
border-width: 0.1rem;
border-radius: 0;
}
.c-laitela-automation-toggle {
color: var(--color-laitela--accent);
background: var(--color-laitela--base);

8
src/components/modals/SingularityMilestonesModal.vue
View File

@ -107,7 +107,7 @@ export default {
</div>
</div>
<button
class="l-singularity-milestone-modal-sort-button"
class="c-singularity-milestone-modal-sort-button"
@click="cycleButton(0)"
>
To Milestone:
@ -115,7 +115,7 @@ export default {
{{ resourceStr }}
</button>
<button
class="l-singularity-milestone-modal-sort-button"
class="c-singularity-milestone-modal-sort-button"
@click="cycleButton(1)"
>
Sort by:
@ -123,7 +123,7 @@ export default {
{{ sortStr }}
</button>
<button
class="l-singularity-milestone-modal-sort-button"
class="c-singularity-milestone-modal-sort-button"
@click="cycleButton(2)"
>
Completed Milestones:
@ -131,7 +131,7 @@ export default {
{{ completedStr }}
</button>
<button
class="l-singularity-milestone-modal-sort-button"
class="c-singularity-milestone-modal-sort-button"
@click="cycleButton(3)"
>
Sort Order: