heartles/egirlskey
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

client: tweak style

Browse source
This commit is contained in:
syuilo 2021-12-10 11:56:23 +09:00
parent 43f2ac56ee
commit 640fc337af
1 changed files with 64 additions and 66 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

58
packages/client/src/pages/settings/index.vue
View file

@ -1,23 +1,25 @@
<template> <template>
<MkSpacer :content-max="900" :margin-min="20" :margin-max="32">
<div ref="el" class="vvcocwet" :class="{ wide: !narrow }"> <div ref="el" class="vvcocwet" :class="{ wide: !narrow }">
<div v-if="!narrow || page == null" class="nav"> <div class="header">
<MkSpacer :content-max="700" :margin-min="20">
<div class="baaadecd">
<div class="title">{{ $ts.settings }}</div> <div class="title">{{ $ts.settings }}</div>
<div v-if="childInfo" class="subtitle">{{ childInfo.title }}</div>
</div>
<div class="body">
<div v-if="!narrow || page == null" class="nav">
<div class="baaadecd">
<MkInfo v-if="emailNotConfigured" warn class="info">{{ $ts.emailNotConfiguredWarning }} <MkA to="/settings/email" class="_link">{{ $ts.configure }}</MkA></MkInfo> <MkInfo v-if="emailNotConfigured" warn class="info">{{ $ts.emailNotConfiguredWarning }} <MkA to="/settings/email" class="_link">{{ $ts.configure }}</MkA></MkInfo>
<MkSuperMenu :def="menuDef" :grid="page == null"></MkSuperMenu> <MkSuperMenu :def="menuDef" :grid="page == null"></MkSuperMenu>
</div> </div>
</MkSpacer>
</div> </div>
<div class="main"> <div class="main">
<MkSpacer :content-max="600" :margin-min="20">
<div class="bkzroven"> <div class="bkzroven">
<div v-if="childInfo" class="title">{{ childInfo.title }}</div>
<component :is="component" :key="page" v-bind="pageProps" @info="onInfo"/> <component :is="component" :key="page" v-bind="pageProps" @info="onInfo"/>
</div> </div>
</div>
</div>
</div>
</MkSpacer> </MkSpacer>
</div>
</div>
</template> </template>
<script lang="ts"> <script lang="ts">
@ -292,14 +294,25 @@ export default defineComponent({
<style lang="scss" scoped> <style lang="scss" scoped>
.vvcocwet { .vvcocwet {
> .nav { > .header {
.baaadecd { display: flex;
> .title { margin-bottom: 24px;
margin: 16px;
font-size: 1.5em; font-size: 1.5em;
font-weight: bold; font-weight: bold;
> .title {
width: 34%;
} }
> .subtitle {
flex: 1;
min-width: 0;
}
}
> .body {
> .nav {
.baaadecd {
> .info { > .info {
margin: 16px 0; margin: 16px 0;
} }
@ -317,41 +330,26 @@ export default defineComponent({
> .main { > .main {
.bkzroven { .bkzroven {
> .title {
margin: 4px 0 20px 0;
font-size: 1.5em;
font-weight: bold;
} }
} }
} }
&.wide { &.wide {
> .body {
display: flex; display: flex;
max-width: 1000px;
margin: 0 auto;
height: 100%; height: 100%;
> .nav { > .nav {
width: 32%; width: 34%;
padding-right: 32px;
box-sizing: border-box; box-sizing: border-box;
overflow: auto; overflow: auto;
.baaadecd {
> .title {
margin: 24px 0;
}
}
} }
> .main { > .main {
flex: 1; flex: 1;
min-width: 0; min-width: 0;
overflow: auto; overflow: auto;
.bkzroven {
> .title {
margin: 6px 0 24px 0;
}
} }
} }
} }