Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2025-02-17 02:10:39 +03:00
Code Issues Packages Projects Releases Wiki Activity

Minor redoc-search ui-fixes

Browse Source
This commit is contained in:
Roman Hotsiy 2017-01-29 20:59:21 +02:00
parent 072ab15cae
commit 71edfafae2
No known key found for this signature in database
GPG Key ID: 5CB7B3ACABA57CB0
4 changed files with 24 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
lib/components/Search/redoc-search.html
View File

@ -1,4 +1,7 @@
<div class="search-input-wrap"> <div class="search-input-wrap">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1000 1000" enable-background="new 0 0 1000 1000" xml:space="preserve">
<path d="M968.2,849.4L667.3,549c83.9-136.5,66.7-317.4-51.7-435.6C477.1-25,252.5-25,113.9,113.4c-138.5,138.3-138.5,362.6,0,501C219.2,730.1,413.2,743,547.6,666.5l301.9,301.4c43.6,43.6,76.9,14.9,104.2-12.4C981,928.3,1011.8,893,968.2,849.4z M524.5,522c-88.9,88.7-233,88.7-321.8,0c-88.9-88.7-88.9-232.6,0-321.3c88.9-88.7,233-88.7,321.8,0C613.4,289.4,613.4,433.3,524.5,522z"/>
</svg>
<input #search (keyup)="update(search.value)" placeholder="Search"> <input #search (keyup)="update(search.value)" placeholder="Search">
</div> </div>
<ul class="search-results" [hidden]="!items.length"> <ul class="search-results" [hidden]="!items.length">
@ -6,5 +9,5 @@
ngClass="menu-item-depth-{{item.menuItem.depth}} {{item.menuItem.ready ? '' : 'disabled'}}" ngClass="menu-item-depth-{{item.menuItem.depth}} {{item.menuItem.ready ? '' : 'disabled'}}"
(click)="clickSearch(item)"> (click)="clickSearch(item)">
{{item.menuItem.name}} {{item.menuItem.name}}
<li> </li>
</ul> </ul>

13
lib/components/Search/redoc-search.scss
View File

@ -7,12 +7,23 @@
.search-input-wrap { .search-input-wrap {
padding: 0 20px; padding: 0 20px;
> svg {
width: 13px;
height: 27px;
display: inline-block;
position: absolute;
path {
fill: lighten($text-color, 20%);
}
}
} }
input { input {
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
padding: 5px; padding: 5px 5px 5px 20px;
border: 0; border: 0;
border-bottom: 1px solid darken($side-bar-bg-color, 10%); border-bottom: 1px solid darken($side-bar-bg-color, 10%);

5
lib/components/Search/redoc-search.ts
View File

@ -19,7 +19,10 @@ export class RedocSearch implements OnInit {
private marker: Marker, private marker: Marker,
public search: SearchService, public search: SearchService,
public menu: MenuService) { public menu: MenuService) {
this._subscription = menu.changed.subscribe(() => cdr.detectChanges()); this._subscription = menu.changed.subscribe(() => {
cdr.markForCheck();
cdr.detectChanges();
});
} }
init() { init() {

4
yarn.lock
View File

@ -70,6 +70,10 @@
version "8.1.30" version "8.1.30"
resolved "https://registry.yarnpkg.com/@types/should/-/should-8.1.30.tgz#e6b4f3ca4fb0799f6ce3303f3a8c003df6585aa3" resolved "https://registry.yarnpkg.com/@types/should/-/should-8.1.30.tgz#e6b4f3ca4fb0799f6ce3303f3a8c003df6585aa3"
"@types/swagger-schema-official@^2.0.0":
version "2.0.0"
resolved "https://registry.yarnpkg.com/@types/swagger-schema-official/-/swagger-schema-official-2.0.0.tgz#cae62749be28b97c8f15ce338140fbea905acd58"
abbrev@1, abbrev@1.0.x: abbrev@1, abbrev@1.0.x:
version "1.0.9" version "1.0.9"
resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.0.9.tgz#91b4792588a7738c25f35dd6f63752a2f8776135" resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.0.9.tgz#91b4792588a7738c25f35dd6f63752a2f8776135"