diff --git a/client/less/main.less b/client/less/main.less
index 124b5c6fa9..ed1c05c103 100644
--- a/client/less/main.less
+++ b/client/less/main.less
@@ -337,6 +337,9 @@ p.stats {
max-width: 400px;
margin: auto;
margin-bottom: 10px;
+ @media (max-width: 450px) {
+ max-width: 90vw;
+ }
}
a {
diff --git a/common/app/routes/Settings/Settings.jsx b/common/app/routes/Settings/Settings.jsx
index e03af489ee..513ae584e1 100644
--- a/common/app/routes/Settings/Settings.jsx
+++ b/common/app/routes/Settings/Settings.jsx
@@ -98,6 +98,7 @@ export class Settings extends React.Component {
{ `Account Settings for ${username}` }
+
@@ -113,6 +114,7 @@ export class Settings extends React.Component {
+
);
}
diff --git a/common/app/routes/Settings/Toggle-Button/toggle.less b/common/app/routes/Settings/Toggle-Button/toggle.less
index c08d8d970f..4ff123406d 100644
--- a/common/app/routes/Settings/Toggle-Button/toggle.less
+++ b/common/app/routes/Settings/Toggle-Button/toggle.less
@@ -1,6 +1,7 @@
@ns: toggle;
.@{ns}-container > .btn-group {
+ min-width: 180px;
float: right;
.btn {
margin-top: 20px;
diff --git a/common/app/routes/Settings/settings.less b/common/app/routes/Settings/settings.less
index fe86003be7..bd75adc77a 100644
--- a/common/app/routes/Settings/settings.less
+++ b/common/app/routes/Settings/settings.less
@@ -28,6 +28,11 @@
}
}
+.offset-negative-row{
+ margin-right: 15px;
+ margin-left: 15px;
+}
+
.@{ns}-container {
.center(@value: @container-xl, @padding: @grid-gutter-width);
@@ -81,6 +86,10 @@
.btn-group > label {
margin: 10px 0;
}
+ @media (max-width: 450px){
+ flex-wrap: wrap;
+ border-bottom: 1px solid #e0e0e0;
+ }
}
label {
@@ -104,6 +113,10 @@
input, textarea {
background-color: #fff;
+ margin: 5px 0;
+ }
+ @media (max-width: 450px) {
+ flex-wrap: wrap;
}
}
.edit-preview-tabs {