diff --git a/src/components/media_upload/media_upload.vue b/src/components/media_upload/media_upload.vue index ac32ae83..1dda7bc1 100644 --- a/src/components/media_upload/media_upload.vue +++ b/src/components/media_upload/media_upload.vue @@ -31,12 +31,14 @@ diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue index 0e0b0e60..89e51b97 100644 --- a/src/components/post_status_form/post_status_form.vue +++ b/src/components/post_status_form/post_status_form.vue @@ -159,6 +159,7 @@
@@ -316,6 +317,8 @@ .form-bottom-left { display: flex; flex: 1; + padding-right: 7px; + margin-right: 7px; } .text-format { @@ -325,19 +328,38 @@ } } - .poll-icon, .emoji-icon { + .media-upload-icon, .poll-icon, .emoji-icon { font-size: 26px; flex: 1; - .selected { - color: $fallback--lightText; - color: var(--lightText, $fallback--lightText); + i { + display: block; + width: 100%; + } + + &.selected, &:hover { + // needs to be specific to override icon default color + i, label { + color: $fallback--lightText; + color: var(--lightText, $fallback--lightText); + } } } + // Order is not necessary but a good indicator + .media-upload-icon { + order: 1; + text-align: left; + } + .emoji-icon { - flex: 0; - min-width: 50px; + order: 2; + text-align: center; + } + + .poll-icon { + order: 3; + text-align: right; } .icon-chart-bar {