mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-01-10 04:25:08 +00:00
Updated Flex Layout package
+ Fixed: Fuse sidebar doesn't scroll when the custom scrollbars disabled + Fixed: Expanded search bar style
This commit is contained in:
parent
174789930d
commit
bd67b660c8
24
package-lock.json
generated
24
package-lock.json
generated
|
@ -185,9 +185,9 @@
|
|||
}
|
||||
},
|
||||
"@angular/flex-layout": {
|
||||
"version": "5.0.0-beta.13",
|
||||
"resolved": "https://registry.npmjs.org/@angular/flex-layout/-/flex-layout-5.0.0-beta.13.tgz",
|
||||
"integrity": "sha1-ga1q1GEAOUbnxSKSCCGla6cpKoU=",
|
||||
"version": "5.0.0-beta.14",
|
||||
"resolved": "https://registry.npmjs.org/@angular/flex-layout/-/flex-layout-5.0.0-beta.14.tgz",
|
||||
"integrity": "sha512-/fsOqXFUKdCmzzZx0bZ0HCYwcV+BSbVuIgOhaCrZKHj2rqiWKKPgj1ErU3HMT68bBBGag0u0skTdLGtrBorRIA==",
|
||||
"requires": {
|
||||
"tslib": "1.9.0"
|
||||
}
|
||||
|
@ -578,7 +578,7 @@
|
|||
"requires": {
|
||||
"angular-draggable-droppable": "2.0.0",
|
||||
"angular-resizable-element": "2.0.0",
|
||||
"calendar-utils": "0.1.1",
|
||||
"calendar-utils": "0.1.2",
|
||||
"date-fns": "1.29.0",
|
||||
"positioning": "1.3.1",
|
||||
"tslib": "1.9.0"
|
||||
|
@ -1678,9 +1678,9 @@
|
|||
"dev": true
|
||||
},
|
||||
"calendar-utils": {
|
||||
"version": "0.1.1",
|
||||
"resolved": "https://registry.npmjs.org/calendar-utils/-/calendar-utils-0.1.1.tgz",
|
||||
"integrity": "sha512-75JPgUK7l7OTg4ZptJMuuIoQzLndc4tcGhBCFtEONr0AMlD7zFVZthOC6Sf29K8r81A1+BJ/tDIFlElgY4XFFw=="
|
||||
"version": "0.1.2",
|
||||
"resolved": "https://registry.npmjs.org/calendar-utils/-/calendar-utils-0.1.2.tgz",
|
||||
"integrity": "sha512-9j4Zd1itopNYTSWzFU4MqD2IDHMqznfxsGr8UWGh7hWv+lKzjRJz0LS29iAg5rHtP6+6x3ikQnhoMGqFUzoD2Q=="
|
||||
},
|
||||
"callsite": {
|
||||
"version": "1.0.0",
|
||||
|
@ -2145,7 +2145,7 @@
|
|||
},
|
||||
"compression": {
|
||||
"version": "1.7.2",
|
||||
"resolved": "https://registry.npmjs.org/compression/-/compression-1.7.2.tgz",
|
||||
"resolved": "http://registry.npmjs.org/compression/-/compression-1.7.2.tgz",
|
||||
"integrity": "sha1-qv+81qr4VLROuygDU9WtFlH1mmk=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
@ -11161,7 +11161,7 @@
|
|||
"minimist": "1.2.0",
|
||||
"mkdirp": "0.5.1",
|
||||
"source-map": "0.6.1",
|
||||
"source-map-support": "0.5.3"
|
||||
"source-map-support": "0.5.4"
|
||||
},
|
||||
"dependencies": {
|
||||
"minimist": {
|
||||
|
@ -11177,9 +11177,9 @@
|
|||
"dev": true
|
||||
},
|
||||
"source-map-support": {
|
||||
"version": "0.5.3",
|
||||
"resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.3.tgz",
|
||||
"integrity": "sha512-eKkTgWYeBOQqFGXRfKabMFdnWepo51vWqEdoeikaEPFiJC7MCU5j2h4+6Q8npkZTeLGbSyecZvRxiSoWl3rh+w==",
|
||||
"version": "0.5.4",
|
||||
"resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.4.tgz",
|
||||
"integrity": "sha512-PETSPG6BjY1AHs2t64vS2aqAgu6dMIMXJULWFBGbh2Gr8nVLbCFDo6i/RMMvviIQ2h1Z8+5gQhVKSn2je9nmdg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"source-map": "0.6.1"
|
||||
|
|
|
@ -24,7 +24,7 @@
|
|||
"@angular/common": "5.2.8",
|
||||
"@angular/compiler": "5.2.8",
|
||||
"@angular/core": "5.2.8",
|
||||
"@angular/flex-layout": "5.0.0-beta.13",
|
||||
"@angular/flex-layout": "5.0.0-beta.14",
|
||||
"@angular/forms": "5.2.8",
|
||||
"@angular/http": "5.2.8",
|
||||
"@angular/material": "5.2.4",
|
||||
|
|
|
@ -1,5 +1,7 @@
|
|||
<div class="fuse-search-bar" [ngClass]="{'expanded':!collapsed}" fxFlex="0 1 auto">
|
||||
<div [ngClass]="toolbarColor" fxLayout="row" fxLayoutAlign="start center" fxFlex>
|
||||
<div class="fuse-search-bar" [ngClass]="{'expanded':!collapsed}">
|
||||
|
||||
<div class="fuse-search-bar-content" [ngClass]="toolbarColor">
|
||||
|
||||
<label for="fuse-search-bar-input">
|
||||
<button mat-icon-button class="fuse-search-bar-expander" aria-label="Expand Search Bar" (click)="expand()"
|
||||
*ngIf="collapsed">
|
||||
|
@ -10,7 +12,8 @@
|
|||
</span>-->
|
||||
</label>
|
||||
|
||||
<input id="fuse-search-bar-input" class="ml-24" type="text" placeholder="Search" (input)="search($event)" fxFlex>
|
||||
<input id="fuse-search-bar-input" class="ml-24" type="text" placeholder="Search" (input)="search($event)"
|
||||
fxFlex>
|
||||
|
||||
<button mat-icon-button class="fuse-search-bar-collapser mat-icon-button" (click)="collapse()"
|
||||
aria-label="Collapse Search Bar">
|
||||
|
@ -18,4 +21,5 @@
|
|||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
|
@ -3,6 +3,8 @@
|
|||
:host {
|
||||
|
||||
.fuse-search-bar {
|
||||
display: flex;
|
||||
flex: 0 1 auto;
|
||||
min-width: 64px;
|
||||
height: 64px;
|
||||
font-size: 13px;
|
||||
|
@ -11,6 +13,12 @@
|
|||
height: 56px;
|
||||
}
|
||||
|
||||
.fuse-search-bar-content {
|
||||
display: flex;
|
||||
flex: 1 1 auto;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
|
||||
.fuse-search-bar-expander,
|
||||
.fuse-search-bar-collapser {
|
||||
cursor: pointer;
|
||||
|
@ -30,6 +38,7 @@
|
|||
width: 64px !important;
|
||||
height: 64px !important;
|
||||
line-height: 64px !important;
|
||||
|
||||
@include media-breakpoint-down('sm') {
|
||||
height: 56px !important;
|
||||
line-height: 56px !important;
|
||||
|
@ -42,10 +51,12 @@
|
|||
|
||||
#fuse-search-bar-input {
|
||||
display: none;
|
||||
flex: 1 0 auto;
|
||||
min-height: 64px;
|
||||
background-color: transparent;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
&.expanded {
|
||||
position: absolute;
|
||||
|
@ -55,12 +66,15 @@
|
|||
left: 0;
|
||||
z-index: 10;
|
||||
|
||||
.fuse-search-bar-content {
|
||||
|
||||
#fuse-search-bar-input {
|
||||
display: block;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.fuse-search-bar-collapser {
|
||||
display: block;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,7 +5,8 @@ fuse-sidebar {
|
|||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow: hidden;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
width: 280px;
|
||||
min-width: 280px;
|
||||
max-width: 280px;
|
||||
|
|
Loading…
Reference in New Issue
Block a user