OpenSource/paimon-moe
OpenSource/paimon-moe
1
0
Fork 0
mirror of https://github.com/MadeBaruna/paimon-moe.git synced 2025-03-27 16:50:41 +01:00
Code Issues Projects Releases Packages Wiki Activity

Increase parity between character and weapon edit modals

Browse source
This commit is contained in:
ehnba 2024-05-15 18:02:36 +03:00
parent 882177fb82
commit e9c83cff55
2 changed files with 112 additions and 125 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/TodoEditCharacterModal.svelte
View file

@ -1,7 +1,6 @@
<script> <script>
import { t } from 'svelte-i18n'; import { t } from 'svelte-i18n';
import { onMount } from 'svelte';
import { fade } from 'svelte/transition'; import { fade } from 'svelte/transition';
import { mdiCheckCircleOutline, mdiClose, mdiInformationOutline } from '@mdi/js'; import { mdiCheckCircleOutline, mdiClose, mdiInformationOutline } from '@mdi/js';
@ -14,7 +13,6 @@
import { characterExp } from '../data/characterExp'; import { characterExp } from '../data/characterExp';
import { characters, isTravelerId, minCharacterLevel, maxCharacterLevel } from '../data/characters'; import { characters, isTravelerId, minCharacterLevel, maxCharacterLevel } from '../data/characters';
import { talent } from '../data/talent';
import { updateTodo } from '../stores/todo'; import { updateTodo } from '../stores/todo';
import { itemList } from '../data/itemList'; import { itemList } from '../data/itemList';
import * as calculator from '../functions/resourceCalculator'; import * as calculator from '../functions/resourceCalculator';

19
src/components/TodoEditWeaponModal.svelte
View file

@ -4,10 +4,8 @@
import { fade } from 'svelte/transition'; import { fade } from 'svelte/transition';
import { mdiStar, mdiClose, mdiInformationOutline, mdiCheckCircleOutline } from '@mdi/js'; import { mdiStar, mdiClose, mdiInformationOutline, mdiCheckCircleOutline } from '@mdi/js';
import Select from './Select.svelte';
import Input from './Input.svelte'; import Input from './Input.svelte';
import AscensionSelector from './AscensionSelector.svelte'; import AscensionSelector from './AscensionSelector.svelte';
import WeaponSelect from './WeaponSelect.svelte';
import Checkbox from './Checkbox.svelte'; import Checkbox from './Checkbox.svelte';
import Check from './Check.svelte'; import Check from './Check.svelte';
import Button from './Button.svelte'; import Button from './Button.svelte';
@ -200,8 +198,7 @@
} }
</script> </script>
<div class="modal bg-item rounded-xl p-4"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-4 bg-item rounded-xl px-4 py-8">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-4">
<div> <div>
<!-- Todo item banner --> <!-- Todo item banner -->
<div class="flex items-center mb-4 p-3 rounded-md text-white bg-item"> <div class="flex items-center mb-4 p-3 rounded-md text-white bg-item">
@ -294,8 +291,10 @@
{/each} {/each}
</div> </div>
{/if} {/if}
{/if}
<div transition:fade={{ duration: 100 }} class="wrap-table bg-background rounded-xl p-4 mt-2 block md:inline-block"> <div transition:fade={{ duration: 100 }} class="wrap-table bg-background rounded-xl p-4 mt-2 block md:inline-block">
<table> <table>
{#if calculated}
<tr> <tr>
<td class="text-right border-b border-gray-700 py-1"> <td class="text-right border-b border-gray-700 py-1">
<span class="text-white mr-2 whitespace-nowrap"> <span class="text-white mr-2 whitespace-nowrap">
@ -358,12 +357,9 @@
<td class="text-red-400 py-1">{expWasted} {$t('calculator.weapon.expWasted')}</td> <td class="text-red-400 py-1">{expWasted} {$t('calculator.weapon.expWasted')}</td>
</tr> </tr>
{/if} {/if}
{/if}
</table> </table>
</div> </div>
{:else}
<!-- Placeholder for calculation results. Also fills space so confirm and cancel buttons will always be at the bottom. -->
<div class="bg-background-secondary grow mt-2 rounded-xl"></div>
{/if}
<div class="flex gap-2"> <div class="flex gap-2">
<Button className="mt-2 w-min grow" on:click={cancel}> <Button className="mt-2 w-min grow" on:click={cancel}>
{$t('todo.edit.cancel')} {$t('todo.edit.cancel')}
@ -381,16 +377,9 @@
</Button> </Button>
</div> </div>
</div> </div>
</div>
</div> </div>
<style lang="postcss"> <style lang="postcss">
.modal {
@apply bg-item;
@apply px-4;
@apply py-8;
}
.wrap-table { .wrap-table {
overflow: hidden scroll; overflow: hidden scroll;
flex-basis: 20vh; flex-basis: 20vh;