diff --git a/app/assets/javascripts/select-kit/components/notifications-button/notifications-button-row.js.es6 b/app/assets/javascripts/select-kit/components/notifications-button/notifications-button-row.js.es6 index 91fd32ebac0..d41133b9b62 100644 --- a/app/assets/javascripts/select-kit/components/notifications-button/notifications-button-row.js.es6 +++ b/app/assets/javascripts/select-kit/components/notifications-button/notifications-button-row.js.es6 @@ -22,6 +22,10 @@ export default DropdownSelectBoxRoxComponent.extend({ @computed("_start") description(_start) { + if (this.site && this.site.mobileView) { + return null; + } + return Handlebars.escapeExpression(I18n.t(`${_start}.description`)); }, diff --git a/app/assets/stylesheets/common/select-kit/pinned-button.scss b/app/assets/stylesheets/common/select-kit/pinned-button.scss index c0d444169b5..e1b31d2d82b 100644 --- a/app/assets/stylesheets/common/select-kit/pinned-button.scss +++ b/app/assets/stylesheets/common/select-kit/pinned-button.scss @@ -1,7 +1,7 @@ #topic-footer-buttons { .pinned-button { min-width: auto; - margin: 10px 0 5px 0; + margin: 1em 0; &.is-hidden { display: none; @@ -12,32 +12,19 @@ } .reason { + display: inline; line-height: $line-height-medium; - margin: 0 0 0 10px; } } } .pinned-button { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; margin: 0; min-width: auto; .pinned-options { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - } + display: inline; - .pinned-options { .select-kit-body { min-width: unset; max-width: unset; diff --git a/app/assets/stylesheets/common/select-kit/topic-notifications-button.scss b/app/assets/stylesheets/common/select-kit/topic-notifications-button.scss index fc10cafa2ac..1e7c7972054 100644 --- a/app/assets/stylesheets/common/select-kit/topic-notifications-button.scss +++ b/app/assets/stylesheets/common/select-kit/topic-notifications-button.scss @@ -1,15 +1,15 @@ #topic-footer-buttons { .topic-notifications-button { min-width: auto; - margin: 10px 0 15px 0; + margin: 1em 0; .btn { margin: 0; } .reason { + display: inline; line-height: $line-height-medium; - margin: 0 0 0 10px; } } } @@ -19,20 +19,9 @@ } .topic-notifications-button { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; margin: 0; .topic-notifications-options { - display: -webkit-inline-box; - display: -ms-inline-flexbox; display: inline-flex; } } diff --git a/app/assets/stylesheets/mobile/topic-post.scss b/app/assets/stylesheets/mobile/topic-post.scss index d4b13511aee..a812fe578a0 100644 --- a/app/assets/stylesheets/mobile/topic-post.scss +++ b/app/assets/stylesheets/mobile/topic-post.scss @@ -245,8 +245,7 @@ a.reply-to-tab { } } -#topic-footer-buttons p { - clear: both; +#topic-footer-buttons .reason { /* this is to force the drop-down notification state description para below the button */ margin: 0; color: dark-light-choose($primary-medium, $secondary-medium); diff --git a/app/assets/stylesheets/mobile/topic.scss b/app/assets/stylesheets/mobile/topic.scss index 409c291a310..05945ceac1f 100644 --- a/app/assets/stylesheets/mobile/topic.scss +++ b/app/assets/stylesheets/mobile/topic.scss @@ -36,15 +36,6 @@ display: inline; } -/* both blocks that appear under the standard post control buttons */ -.notification-options, -.pinned-options { - float: left; - margin-top: 0; - padding-top: 1px; - clear: both; -} - .topic-status-info { padding-left: 10px; border-top: 1px solid $primary-low;