framework/less/common/Search.less
Sami Mazouz af89b23f67
CSS Code Housekeeping (#3026)
* refactor: Avatar classes refactor
* refactor: Badge classes refactor
* chore: Remove commented dead code
* chore: Remove SignUpModal dead CSS code
Flarum seem to have had some kind of user display in the sign up modal 
on successful sign up, which no longer exists.

https://github.com/flarum/core/blob/v0.1.0-beta/js/forum/src/components/SignUpModal.js#L111
* chore: Deprecate unneeded vendor mixins
* chore: Normalize property values format
Co-authored-by: David Wheatley <hi@davwheat.dev>
* chore: Remove @-webkit-keyframes
* chore: Combine animation properties
* chore: Avoid `all` for transition
* chore: translate3d is no longer necessary for hardware acceleration
* fix: Lost cursor pointer to normalize update
* chore: Use CSS variables for more things
* chore: Remove unecessary overspecification
Co-authored-by: David Wheatley <hi@davwheat.dev>
2021-08-21 19:34:07 +01:00

92 lines
1.4 KiB
Plaintext

.Search {
position: relative;
}
@media @tablet-up {
.Search {
transition: margin-left 0.4s;
&.focused {
margin-left: -400px;
input,
.Search-results {
width: 400px;
}
}
}
}
.Search-results {
overflow: auto;
left: auto;
right: 0;
@media @phone {
left: 0;
}
> li > a {
white-space: normal;
}
mark {
background: none;
padding: 0;
font-weight: bold;
color: inherit;
box-shadow: none;
}
}
.Search-input {
overflow: hidden;
color: @muted-color;
&:before {
.fa();
content: @fa-var-search;
float: left;
margin-right: -36px;
width: 36px;
font-size: 14px;
text-align: center;
position: relative;
padding: 8px 0;
line-height: 1.5;
pointer-events: none;
}
input {
float: left;
width: 225px;
padding-left: 32px;
padding-right: 32px;
transition: var(--transition), width 0.4s;
box-sizing: inherit !important;
}
.LoadingIndicator-container {
height: 36px;
}
.Button {
float: left;
margin-left: -36px;
outline: none;
width: 36px !important;
&.LoadingIndicator {
width: var(--size) !important;
padding: 0;
}
}
}
.DiscussionSearchResult-excerpt {
margin-top: 3px;
color: @muted-color;
font-size: 11px;
}
.UserSearchResult .Avatar {
.Avatar--size(24px);
margin: -2px 10px -2px 0;
}