Merge branch 'fix/settings-submit-button' into 'develop'

Fix settings submit button position on wide screens

See merge request pleroma/admin-fe!106
This commit is contained in:
Angelina Filippova 2020-03-24 16:22:54 +00:00
commit cdb922fa19
4 changed files with 25 additions and 5 deletions

View file

@ -15,6 +15,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
### Fixed
- Fix parsing tuples in Pleroma.Upload.Filter.Mogrify and Pleroma.Emails.Mailer settings
- Fix settings submit button position on wide screens when sidebar menu is open
## [2.0] - 2020-02-27

View file

@ -1,5 +1,5 @@
<template>
<div v-if="!loading" class="form-container">
<div v-if="!loading" :class="isSidebarOpen" class="form-container">
<el-form ref="instanceData" :model="instanceData" :label-width="labelWidth">
<setting :setting-group="instance" :data="instanceData"/>
</el-form>
@ -82,6 +82,9 @@ export default {
isMobile() {
return this.$store.state.app.device === 'mobile'
},
isSidebarOpen() {
return this.$store.state.app.sidebar.opened ? 'sidebar-opened' : 'sidebar-closed'
},
isTablet() {
return this.$store.state.app.device === 'tablet'
},

View file

@ -1,7 +1,7 @@
<template>
<div class="settings-container">
<div v-if="isDesktop">
<div class="settings-header-container">
<div :class="isSidebarOpen" class="settings-header-container">
<h1 class="settings-header">{{ $t('settings.settings') }}</h1>
<div>
<el-tooltip v-if="needReboot" :content="$t('settings.restartApp')" placement="bottom-end">
@ -47,7 +47,7 @@
</el-tabs>
</div>
<div v-if="isMobile || isTablet">
<div class="settings-header-container">
<div :class="isSidebarOpen" class="settings-header-container">
<h1 class="settings-header">{{ $t('settings.settings') }}</h1>
<el-button v-if="needReboot" class="settings-reboot-button" @click="restartApp">
<span>
@ -196,6 +196,9 @@ export default {
isMobile() {
return this.$store.state.app.device === 'mobile'
},
isSidebarOpen() {
return this.$store.state.app.sidebar.opened ? 'header-sidebar-opened' : 'header-sidebar-closed'
},
isTablet() {
return this.$store.state.app.device === 'tablet'
},

View file

@ -264,6 +264,12 @@
.settings-header {
margin: 0;
}
.header-sidebar-opened {
max-width: 1585px;
}
.header-sidebar-closed {
max-width: 1728px;
}
.settings-header-container {
display: flex;
height: 36px;
@ -330,8 +336,15 @@
}
@media only screen and (min-width: 1824px) {
.sidebar-closed {
max-width: 1586px;
}
.sidebar-opened {
max-width: 1442px;
}
.submit-button-container {
max-width: 1637px;
width: 100%;
max-width: inherit;
margin-left: auto;
margin-right: auto;
right: auto;
@ -541,7 +554,7 @@
margin-right: 8px
}
}
@media only screen and (max-width:801px) and (min-width: 481px) {
@media only screen and (max-width:818px) and (min-width: 481px) {
.delete-setting-button {
margin: 4px 0 0 10px;
height: 28px;