Commit 3e8c4e16 authored by Nicolas Frandeboeuf's avatar Nicolas Frandeboeuf Committed by Benjamin Bouvier
Browse files

Improve settings layout on mobile

parent 65d3f2ec
......@@ -8,7 +8,7 @@ import ExportModule from './export';
const BackupSection = () => {
return (
<form className="settings-form">
<div>
<div className="wrap-on-mobile">
<label htmlFor="exportInstance">{$t('client.settings.export_instance')}</label>
<div>
<p className="button-desc">{$t('client.settings.export_instance_help')}</p>
......@@ -16,7 +16,7 @@ const BackupSection = () => {
</div>
</div>
<div>
<div className="wrap-on-mobile">
<label htmlFor="importInstance">{$t('client.settings.import_instance')}</label>
<div>
<p className="button-desc">{$t('client.settings.import_instance_help')}</p>
......
......@@ -81,6 +81,8 @@ class WeboobParameters extends React.PureComponent {
/>
</p>
<hr />
<p>
<label htmlFor="autoWeboobUpdate">
{$t('client.settings.weboob_auto_update')}
......@@ -94,7 +96,7 @@ class WeboobParameters extends React.PureComponent {
/>
</p>
<div>
<div className="wrap-on-mobile">
<label htmlFor="updateWeboob">{$t('client.settings.update_weboob')}</label>
<div>
......
......@@ -22,6 +22,16 @@
.settings-form > *:not(.alerts) > :first-child {
width: 40%;
}
.settings-form > .wrap-on-mobile {
flex-wrap: wrap;
}
.settings-form > .wrap-on-mobile > :first-child {
width: 100%;
margin-bottom: 1em;
font-weight: bold;
}
}
.settings-form p.button-desc {
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment