make layout easier

This commit is contained in:
ThatOneCalculator 2022-11-09 00:43:27 -08:00
parent 27d6172de5
commit f9d3a73fc3
2 changed files with 25 additions and 24 deletions

View file

@ -1,6 +1,6 @@
{ {
"name": "calckey", "name": "calckey",
"version": "12.119.0-calc.10-b.2", "version": "12.119.0-calc.10-b.3",
"codename": "aqua", "codename": "aqua",
"repository": { "repository": {
"type": "git", "type": "git",

View file

@ -2,8 +2,8 @@
<XModalWindow <XModalWindow
ref="dialog" ref="dialog"
:width="800" :width="800"
:height="1000" :height="600"
:scroll="false" :scroll="true"
@close="dialog.close()" @close="dialog.close()"
@closed="$emit('closed')" @closed="$emit('closed')"
> >
@ -12,33 +12,47 @@
<div class="_monolithic_"> <div class="_monolithic_">
<div class="_section"> <div class="_section">
<div class="tbkwesmv"> <div class="tbkwesmv">
<div class="_title title"><i class="ph-info-bold ph-lg"></i> {{ i18n.ts._tutorial.title }}</div> <div class="_footer navigation">
<div class="step">
<button class="arrow _button" :disabled="tutorial === 0" @click="tutorial--">
<i class="ph-caret-left-bold ph-lg"></i>
</button>
<span>{{ tutorial + 1 }} / 6</span>
<button class="arrow _button" :disabled="tutorial === 5" @click="tutorial++">
<i class="ph-caret-right-bold ph-lg"></i>
</button>
</div>
<MkButton v-if="tutorial === 5" class="ok" primary @click="close"><i class="ph-check-bold ph-lg"></i> {{ i18n.ts.gotIt }}</MkButton>
<MkButton v-else class="ok" primary @click="tutorial++"><i class="ph-check-bold ph-lg"></i> {{ i18n.ts.next }}</MkButton>
</div>
<h2 class="_title title"><i class="ph-info-bold ph-lg"></i> {{ i18n.ts._tutorial.title }}</h2>
<br/> <br/>
<div v-if="tutorial === 0" class="_content"> <div v-if="tutorial === 0" class="_content">
<div>{{ i18n.ts._tutorial.step1_1 }}</div> <h3>{{ i18n.ts._tutorial.step1_1 }}</h3>
<div>{{ i18n.ts._tutorial.step1_2 }}</div> <div>{{ i18n.ts._tutorial.step1_2 }}</div>
</div> </div>
<div v-else-if="tutorial === 1" class="_content"> <div v-else-if="tutorial === 1" class="_content">
<div>{{ i18n.ts._tutorial.step2_1 }}</div> <h3>{{ i18n.ts._tutorial.step2_1 }}</h3>
<div>{{ i18n.ts._tutorial.step2_2 }}</div> <div>{{ i18n.ts._tutorial.step2_2 }}</div>
<XSettings/> <XSettings/>
</div> </div>
<div v-else-if="tutorial === 2" class="_content"> <div v-else-if="tutorial === 2" class="_content">
<div>{{ i18n.ts._tutorial.step3_1 }}</div> <h3>{{ i18n.ts._tutorial.step3_1 }}</h3>
<div>{{ i18n.ts._tutorial.step3_2 }}</div> <div>{{ i18n.ts._tutorial.step3_2 }}</div>
<XFeaturedUsers/> <XFeaturedUsers/>
</div> </div>
<div v-else-if="tutorial === 3" class="_content"> <div v-else-if="tutorial === 3" class="_content">
<div>{{ i18n.ts._tutorial.step4_1 }}</div> <h3>{{ i18n.ts._tutorial.step4_1 }}</h3>
<I18n :src="i18n.ts._tutorial.step5_2" tag="div"> <I18n :src="i18n.ts._tutorial.step4_2" tag="div">
<template #introduction> <template #introduction>
<MkA class="_link" to="/tags/introduction">#introduction</MkA> <MkA class="_link" to="/tags/introduction">#introduction</MkA>
</template> </template>
</I18n> </I18n>
<br/>
<XPostForm class="post-form _block"/> <XPostForm class="post-form _block"/>
</div> </div>
<div v-else-if="tutorial === 4" class="_content"> <div v-else-if="tutorial === 4" class="_content">
<div>{{ i18n.ts._tutorial.step5_1 }}</div> <h3>{{ i18n.ts._tutorial.step5_1 }}</h3>
<I18n :src="i18n.ts._tutorial.step5_2" tag="div"> <I18n :src="i18n.ts._tutorial.step5_2" tag="div">
<template #timelines> <template #timelines>
<span>{{ timelines.length }}</span> <span>{{ timelines.length }}</span>
@ -71,24 +85,11 @@
</I18n> </I18n>
</div> </div>
<div v-else-if="tutorial === 5" class="_content"> <div v-else-if="tutorial === 5" class="_content">
<div>{{ i18n.ts._tutorial.step6_1 }}</div> <h3>{{ i18n.ts._tutorial.step6_1 }}</h3>
<div>{{ i18n.ts._tutorial.step6_2 }}</div> <div>{{ i18n.ts._tutorial.step6_2 }}</div>
<div>{{ i18n.ts._tutorial.step6_3 }}</div> <div>{{ i18n.ts._tutorial.step6_3 }}</div>
<div>{{ i18n.ts._tutorial.step6_4 }}</div> <div>{{ i18n.ts._tutorial.step6_4 }}</div>
</div> </div>
<div class="_footer navigation">
<div class="step">
<button class="arrow _button" :disabled="tutorial === 0" @click="tutorial--">
<i class="ph-caret-left-bold ph-lg"></i>
</button>
<span>{{ tutorial + 1 }} / 6</span>
<button class="arrow _button" :disabled="tutorial === 5" @click="tutorial++">
<i class="ph-caret-right-bold ph-lg"></i>
</button>
</div>
<MkButton v-if="tutorial === 5" class="ok" primary @click="close"><i class="ph-check-bold ph-lg"></i> {{ i18n.ts.gotIt }}</MkButton>
<MkButton v-else class="ok" primary @click="tutorial++"><i class="ph-check-bold ph-lg"></i> {{ i18n.ts.next }}</MkButton>
</div>
</div> </div>
</div> </div>
</div> </div>