Skip to content

Commit

Permalink
ui improvements
Browse files Browse the repository at this point in the history 
upgraded flex-layout
  • Loading branch information
@liefersfl
liefersfl committed May 3, 2018
1 parent 546689f commit d9c78f1
Show file tree
Hide file tree
Showing 4 changed files with 24 additions and 30 deletions.
8 changes: 4 additions & 4 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"$schema": "./node_modules/ng-packagr/package.schema.json",
"name": "cocktail-configurator",
"version": "0.0.15",
"version": "0.0.16",
"license": "MIT",
"private": false,
"scripts": {
Expand Down Expand Up @@ -29,7 +29,7 @@
"@angular/common": "^5.2.0",
"@angular/compiler": "^5.2.0",
"@angular/core": "^5.2.0",
"@angular/flex-layout": "^5.0.0-beta.13",
"@angular/flex-layout": "^5.0.0-beta.14",
"@angular/forms": "^5.2.0",
"@angular/http": "^5.2.0",
"@angular/material": "^5.2.0",
Expand Down
32 changes: 13 additions & 19 deletions src/app/beaker/beaker.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,37 +1,31 @@
<div #glass class="glass" fxFlexFill>
<svg [style.height.px]="glass.offsetHeight" [style.width.px]="glass.offsetWidth" style="position: absolute;" viewBox="0 0 1 1"
vectorEffect="non-scaling-stroke" preserveAspectRatio="none">
<path d="M0.03,0.03 L0.04,0.97 L0.96,0.97 L0.97,0.03" stroke="black" stroke-width="0.02" fill="none" />
<path d="M0.02,0.00 L0.03,0.99 L0.97,0.99 L0.98,0.00" stroke="black" stroke-width="0.02" fill="none" />
</svg>
<svg height="0" fxFlex="0">
<!-- <svg width="100px" height="100px"> -->
<clipPath id="clipping-path-2" clipPathUnits="objectBoundingBox">
<path d="M0.045,0.12C0.5,0.12,0.5,0.11,0.955,0.11 L0.955,0.12L0.955,0.96L0.045,0.96z">
<path d="M0.03,0.06 C0.5,0.06, 0.85,0.06, 0.97,0.03 L0.97,0.06 L0.96,0.94L0.04,0.94z">
<animate attributeName="d" dur="7s" repeatCount="indefinite" values="
M0.045,0.13 C0.5,0.13, 0.85,0.13, 0.955,0.10 L0.955,0.13 L0.955,0.96L0.045,0.96z;
M0.045,0.13 C0.5,0.13, 0.5,0.11, 0.955,0.11 L0.955,0.13 L0.955,0.96L0.045,0.96z;
M0.045,0.13 C0.5,0.12, 0.5,0.12, 0.955,0.13 L0.955,0.13 L0.955,0.96L0.045,0.96z;
M0.03,0.06 C0.5,0.06, 0.85,0.06, 0.97,0.03 L0.97,0.06 L0.96,0.96L0.04,0.96z;
M0.03,0.06 C0.5,0.06, 0.5,0.04, 0.97,0.04 L0.97,0.06 L0.96,0.96L0.04,0.96z;
M0.03,0.06 C0.5,0.05, 0.5,0.05, 0.97,0.06 L0.97,0.06 L0.96,0.96L0.04,0.96z;
M0.045,0.12 C 0.5,0.12, 0.5,0.13, 0.955,0.13 L0.955,0.13 L0.955,0.96L0.045,0.96z;
M0.045,0.10 C0.15,0.13, 0.5,0.13, 0.955,0.13 L0.955,0.13 L0.955,0.96L0.045,0.96z;
M0.045,0.12 C 0.5,0.12, 0.5,0.13, 0.955,0.13 L0.955,0.13 L0.955,0.96L0.045,0.96z;
M0.03,0.05 C 0.5,0.05, 0.5,0.06, 0.97,0.06 L0.97,0.06 L0.96,0.96L0.04,0.96z;
M0.03,0.03 C0.15,0.06, 0.5,0.06, 0.97,0.06 L0.97,0.06 L0.96,0.96L0.04,0.96z;
M0.03,0.05 C 0.5,0.05, 0.5,0.06, 0.97,0.06 L0.97,0.06 L0.96,0.96L0.04,0.96z;
M0.045,0.13 C0.5,0.12, 0.5,0.12, 0.955,0.13 L0.955,0.13 L0.955,0.96L0.045,0.96z;
M0.045,0.13 C0.5,0.13, 0.5,0.11, 0.955,0.11 L0.955,0.13 L0.955,0.96L0.045,0.96z;
M0.045,0.13 C0.5,0.13, 0.85,0.13, 0.955,0.10 L0.955,0.13 L0.955,0.96L0.045,0.96z;" />
<!-- <animate attributeName="d" dur="5s" repeatCount="indefinite" values="
M0.045,0.15C0.5,0.15,0.5,0.11,0.955,0.11 L0.955,0.15L0.925,0.96L0.075,0.96z;
M0.045,0.15C0.5,0.11,0.5,0.11,0.955,0.15 L0.955,0.15L0.925,0.96L0.075,0.96z;
M0.045,0.11C0.5,0.11,0.5,0.15,0.955,0.15 L0.955,0.15L0.925,0.96L0.075,0.96z;
M0.045,0.15C0.5,0.11,0.5,0.11,0.955,0.15 L0.955,0.15L0.925,0.96L0.075,0.96z;
M0.045,0.15C0.5,0.15,0.5,0.11,0.955,0.11 L0.955,0.15L0.925,0.96L0.075,0.96z;" /> -->
M0.03,0.06 C0.5,0.05, 0.5,0.05, 0.97,0.06 L0.97,0.06 L0.96,0.96L0.04,0.96z;
M0.03,0.06 C0.5,0.06, 0.5,0.04, 0.97,0.04 L0.97,0.06 L0.96,0.96L0.04,0.96z;
M0.03,0.06 C0.5,0.06, 0.85,0.06, 0.97,0.03 L0.97,0.06 L0.96,0.96L0.04,0.96z;" />
</path>
</clipPath>
</svg>
<div class="glass-clip" fxLayout="column" fxFlexFill style="padding-left: 10px; padding-right: 10px;">
<div fxFlex="10">
<div fxFlex="3">
</div>
<div fxFlex="90" style="padding-bottom: 13px;">
<div fxFlex="97" style="padding-bottom: 27px;">
<div *ngIf="isEmpty()" fxLayout="column" fxFill fxLayoutGap="2px" class="empty_placeholder" fxLayoutAlign="center center"
dnd-droppable fxLayoutAlign="center center" (onDropSuccess)="onDropComponent(0, 0)" (click)="onPlaceholderClicked(0, 0)">
<ng-container *ngIf="!editMode">
Expand Down
10 changes: 5 additions & 5 deletions src/app/component-list/component-list.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
<div fxLayout="column" fxFlex="auto">
<mat-form-field style=" margin-bottom: -1.25em">
<input type="search" matInput placeholder="Suchen" value="" [(ngModel)]="queryString" (ngModelChange)="updateSearchResult()">
<div fxLayout="column" fxFlexFill>
<mat-form-field fxFlex="none" style="margin-bottom: -1.25em;">
<input matInput placeholder="Suchen" value="" [(ngModel)]="queryString" (ngModelChange)="updateSearchResult()">
</mat-form-field>
<div *ngIf="isDropTarget" fxFlexFill class="basket_placeholder" dnd-droppable fxLayoutAlign="center center" (onDropSuccess)="onDrop()">
<div *ngIf="isDropTarget" fxFlex class="basket_placeholder" dnd-droppable fxLayoutAlign="center center" (onDropSuccess)="onDrop()">
<div>
Zutat hier
<br>ablegen um diese
Expand All @@ -16,7 +16,6 @@
</svg>
</div>
</div>

<mat-list *ngIf="!isDropTarget" dnd-droppable (onDropSuccess)="onDrop()" class="component-list">
<ng-container *ngIf="queryString.length == 0">
<!-- Recommended Components -->
Expand Down Expand Up @@ -65,4 +64,5 @@ <h3 mat-subheader>Alle Komponenten</h3>
</ng-container>
<!-- Filtered Components -->
</mat-list>

</div>

0 comments on commit d9c78f1

Please sign in to comment.