diff --git a/app/assets/javascripts/discourse/app/widgets/search-menu-controls.js b/app/assets/javascripts/discourse/app/widgets/search-menu-controls.js index 3230051e1f8..dd2f485467b 100644 --- a/app/assets/javascripts/discourse/app/widgets/search-menu-controls.js +++ b/app/assets/javascripts/discourse/app/widgets/search-menu-controls.js @@ -80,7 +80,6 @@ createWidget("search-context", { ); } - result.push(h("div.clearfix")); return result; }, diff --git a/app/assets/stylesheets/common/base/header.scss b/app/assets/stylesheets/common/base/header.scss index 201c250c658..213e726414a 100644 --- a/app/assets/stylesheets/common/base/header.scss +++ b/app/assets/stylesheets/common/base/header.scss @@ -213,19 +213,6 @@ background-color: var(--highlight-medium); } -.search-highlight { - font-weight: bold; -} - -#search-help table td { - padding-right: 10px; -} - -// we don't need this X to clear field -#search-term::-ms-clear { - display: none; -} - // topic info in the header .extra-info-wrapper { display: flex; diff --git a/app/assets/stylesheets/common/base/menu-panel.scss b/app/assets/stylesheets/common/base/menu-panel.scss index 1b9e2ed842f..44e65feec06 100644 --- a/app/assets/stylesheets/common/base/menu-panel.scss +++ b/app/assets/stylesheets/common/base/menu-panel.scss @@ -68,6 +68,7 @@ flex-wrap: wrap; .show-all { + display: flex; flex: 1 1 auto; button { width: 100%; @@ -115,22 +116,19 @@ } .menu-panel { - li, - li.heading { - a.widget-link, - a.categories-link { - padding: 0.25em 0.5em; - display: block; - color: var(--primary); - &:hover, - &:focus { - background-color: var(--highlight-medium); - outline: none; - } + .widget-link, + .categories-link { + padding: 0.25em 0.5em; + display: block; + color: var(--primary); + &:hover, + &:focus { + background-color: var(--highlight-medium); + outline: none; + } - .d-icon { - color: var(--primary-medium); - } + .d-icon { + color: var(--primary-medium); } .new { @@ -138,6 +136,11 @@ margin-left: 0.5em; color: var(--primary-med-or-secondary-med); } + + &.show-help, + &.filter { + color: var(--tertiary); + } } li.category-link { diff --git a/app/assets/stylesheets/common/base/search-menu.scss b/app/assets/stylesheets/common/base/search-menu.scss index 73a86ba70fd..e521e17ec03 100644 --- a/app/assets/stylesheets/common/base/search-menu.scss +++ b/app/assets/stylesheets/common/base/search-menu.scss @@ -1,15 +1,22 @@ .search-menu { + --search-padding: 0.5em; .menu-panel .panel-body-contents { overflow-y: auto; } .search-input { position: relative; - padding: 0.5em 3px; + padding: var(--search-padding); } - .search-context .show-help { - float: right; + .search-context { + label { + padding: 0.25em var(--search-padding); + } + .show-help { + margin-left: auto; + line-height: var(--line-height-medium); + } } .heading { @@ -21,12 +28,14 @@ input[type="text"] { box-sizing: border-box; - width: calc(100% - 6px); - height: 32px; + width: 100%; + min-height: 32px; + margin-bottom: 0; } .search-context { - padding: 0 5px; + display: flex; + align-items: center; label { margin-bottom: 0; @@ -34,7 +43,7 @@ } .search-context + .results { - margin-top: 5px; + margin-top: 1em; } .results { @@ -66,7 +75,6 @@ display: flex; flex-wrap: wrap; align-items: center; - margin-top: 0.15em; .discourse-tags { .discourse-tag { @@ -76,6 +84,12 @@ } } + .search-result-post { + .blurb { + font-size: var(--font-down-1); + } + } + .main-results { display: flex; flex: 1 1 auto; @@ -97,8 +111,7 @@ flex: 1 1 auto; .separator { - margin-bottom: 1em; - margin-top: 1em; + margin: 1em 0.25em; height: 1px; background: var(--primary-low); } @@ -185,7 +198,7 @@ .widget-link.search-link { flex: 1; font-size: $font-0; - padding: 5px; + padding: 0.25em; } } } @@ -233,16 +246,11 @@ } } } - - .show-more { - box-sizing: border-box; - padding: 5px; - } } .searching { position: absolute; - top: 1.15em; + top: 1.1em; right: 1em; .spinner { @@ -254,18 +262,11 @@ } .no-results { - padding: 5px; - } - - .filter { - padding: 0; - &:hover { - background: transparent; - } + padding: var(--search-padding); } .search-link { - margin-bottom: 0.25em; + padding: var(--search-padding); .badge-category-parent { line-height: $line-height-small; @@ -273,11 +274,13 @@ .topic { display: inline-block; - line-height: $line-height-medium; } .topic-title { overflow-wrap: anywhere; + font-size: var(--font-up-1); + line-height: $line-height-medium; + @supports not (overflow-wrap: anywhere) { word-break: break-word; } diff --git a/app/assets/stylesheets/common/base/search.scss b/app/assets/stylesheets/common/base/search.scss index 573756bb8fe..ad8dfe77bd1 100644 --- a/app/assets/stylesheets/common/base/search.scss +++ b/app/assets/stylesheets/common/base/search.scss @@ -1,3 +1,8 @@ +.search-highlight { + font-weight: bold; + background: var(--highlight-medium); +} + .search-container { display: flex; justify-content: space-between;