diff --git a/app/assets/javascripts/discourse/templates/composer.hbs b/app/assets/javascripts/discourse/templates/composer.hbs
index 99e723803a1..4ae081b2124 100644
--- a/app/assets/javascripts/discourse/templates/composer.hbs
+++ b/app/assets/javascripts/discourse/templates/composer.hbs
@@ -176,7 +176,6 @@
-
diff --git a/app/assets/stylesheets/common/base/compose.scss b/app/assets/stylesheets/common/base/compose.scss
index 283bb99e02d..4c564bc178e 100644
--- a/app/assets/stylesheets/common/base/compose.scss
+++ b/app/assets/stylesheets/common/base/compose.scss
@@ -280,6 +280,7 @@
flex-basis: 50%;
display: flex;
align-items: center;
+ margin-right: auto;
button {
flex: 0 0 auto;
}
@@ -314,15 +315,6 @@
}
}
- .composer-bottom-right {
- flex-basis: 50%;
- display: flex;
- flex-direction: row-reverse;
- .toggle-preview {
- order: 2;
- }
- }
-
#draft-status,
#file-uploading {
color: $primary-high;
diff --git a/app/assets/stylesheets/desktop/compose.scss b/app/assets/stylesheets/desktop/compose.scss
index e91f93cbd08..0594ca8e51d 100644
--- a/app/assets/stylesheets/desktop/compose.scss
+++ b/app/assets/stylesheets/desktop/compose.scss
@@ -202,12 +202,10 @@
width: calc(50% - 65px);
}
-.composer-bottom-right {
- a {
- color: $primary-high;
- &:hover {
- color: $tertiary;
- }
+a.toggle-preview {
+ color: $primary-high;
+ &:hover {
+ color: $tertiary;
}
}
diff --git a/app/assets/stylesheets/mobile/compose.scss b/app/assets/stylesheets/mobile/compose.scss
index 2138c44cdcd..e73ac05898d 100644
--- a/app/assets/stylesheets/mobile/compose.scss
+++ b/app/assets/stylesheets/mobile/compose.scss
@@ -71,22 +71,21 @@
flex: 1 1 auto;
#draft-status,
#file-uploading {
- margin-left: 15px;
+ margin-left: 6px;
}
.cancel {
- font-size: 1.6em;
+ font-size: 1.4em;
color: $primary-low-mid;
margin-left: 0.6em;
- padding: 0 5px;
+ padding: 3px 6px;
}
}
- .composer-bottom-right {
- margin-left: auto;
- flex: 1 1 auto;
+ .mobile-file-upload:not(.hidden),
+ .mobile-preview {
+ // Alignment fix, remove if converted to buttons
+ display: inline-flex;
}
-
.mobile-file-upload {
- order: 2;
&.hidden + .mobile-preview {
// Hide preview button while file is uploading to make room for upload progress
display: none;