purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2025-01-10 04:25:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' into skeleton

Browse Source
This commit is contained in:
Sercan Yemen 2018-03-31 13:22:27 +03:00
commit 47ee65a980
5 changed files with 69 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
package-lock.json generated
View File

@ -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": {
@ -11275,7 +11275,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": {
@ -11291,9 +11291,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"

2
package.json
View File

@ -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",

10
src/@fuse/components/search-bar/search-bar.component.html
View File

@ -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>

80
src/@fuse/components/search-bar/search-bar.component.scss
View File

@ -3,6 +3,8 @@
:host {
.fuse-search-bar {
display: flex;
flex: 0 1 auto;
min-width: 64px;
height: 64px;
font-size: 13px;
@ -11,40 +13,49 @@
height: 56px;
}
.fuse-search-bar-expander,
.fuse-search-bar-collapser {
cursor: pointer;
padding: 0 20px;
margin: 0;
width: 64px !important;
height: 64px !important;
line-height: 64px !important;
.fuse-search-bar-content {
display: flex;
flex: 1 1 auto;
align-items: center;
justify-content: flex-start;
@include media-breakpoint-down('sm') {
height: 56px !important;
line-height: 56px !important;
.fuse-search-bar-expander,
.fuse-search-bar-collapser {
cursor: pointer;
padding: 0 20px;
margin: 0;
width: 64px !important;
height: 64px !important;
line-height: 64px !important;
@include media-breakpoint-down('sm') {
height: 56px !important;
line-height: 56px !important;
}
}
}
.fuse-search-bar-loader {
width: 64px !important;
height: 64px !important;
line-height: 64px !important;
@include media-breakpoint-down('sm') {
height: 56px !important;
line-height: 56px !important;
.fuse-search-bar-loader {
width: 64px !important;
height: 64px !important;
line-height: 64px !important;
@include media-breakpoint-down('sm') {
height: 56px !important;
line-height: 56px !important;
}
}
}
.fuse-search-bar-collapser {
display: none;
}
.fuse-search-bar-collapser {
display: none;
}
#fuse-search-bar-input {
display: none;
min-height: 64px;
background-color: transparent;
font-size: 16px;
#fuse-search-bar-input {
display: none;
flex: 1 0 auto;
min-height: 64px;
background-color: transparent;
font-size: 16px;
}
}
&.expanded {
@ -55,12 +66,15 @@
left: 0;
z-index: 10;
#fuse-search-bar-input {
display: block;
}
.fuse-search-bar-content {
.fuse-search-bar-collapser {
display: block;
#fuse-search-bar-input {
display: flex;
}
.fuse-search-bar-collapser {
display: flex;
}
}
}
}

3
src/@fuse/components/sidebar/sidebar.component.scss
View File

@ -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;