":I.tabReplace?n.replace(/\t/g,I.tabReplace):""}):e}function h(e,n,t){var r=n?L[n]:t,a=[e.trim()];return e.match(/\bhljs\b/)||a.push("hljs"),-1===e.indexOf(r)&&a.push(r),a.join(" ").trim()}function d(e){var n,t,r,o,l,s=i(e);a(s)||(I.useBR?(n=document.createElementNS("http://www.w3.org/1999/xhtml","div"),n.innerHTML=e.innerHTML.replace(/\n/g,"").replace(/
82 |
90 |
83 | 
85 |
86 |
89 |
85 |
31 |
33 | Resize the window to see the expected behavior
2 |
3 |
5 |
--------------------------------------------------------------------------------
/src/app/autoresize/autoresize.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: flex;
3 | flex-direction: column;
4 | height: 100%;
5 | }
6 |
7 | h2 {
8 | margin-left: 20px;
9 | white-space: nowrap;
10 | }
11 |
12 | $sidebarWidth: 200px;
13 | $contentPadding: 20px;
14 | $wDiff: $sidebarWidth + $contentPadding * 2;
15 |
16 | $headerHeight: 64px;
17 | $subHeaderHeight: 32px + 16px;
18 | $hDiff: $headerHeight + $subHeaderHeight + $contentPadding * 2;
19 |
20 | .imagewrapper {
21 | flex: 1;
22 | box-sizing: border-box;
23 | overflow: hidden;
24 | max-width: calc(100vw - #{$wDiff});
25 | min-width: calc(100vw - #{$wDiff});
26 | width: calc(100vw - #{$wDiff});
27 | max-height: calc(100vh - #{$hDiff});
28 | min-height: calc(100vh - #{$hDiff});
29 | height: calc(100vh - #{$hDiff});
30 |
31 | @media only screen and (max-width: 600px) {
32 | max-width: calc(100vw - #{$contentPadding * 2});
33 | min-width: calc(100vw - #{$contentPadding * 2});
34 | width: calc(100vw - #{$contentPadding * 2});
35 | }
36 | }
37 |
--------------------------------------------------------------------------------
/src/app/autoresize/autoresize.component.spec.ts:
--------------------------------------------------------------------------------
1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2 | import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
3 | import { SharedModule } from '../shared/shared.module';
4 |
5 | import { AutoResizeComponent } from './autoresize.component';
6 |
7 | describe('AutoResizeComponent', () => {
8 | let component: AutoResizeComponent;
9 | let fixture: ComponentFixtureTest conditional display
2 | 3 |
4 |
13 |
14 |
5 |
6 | {{ condition ? 'Visible' : 'Hidden'}}
7 |
8 |
9 |
12 | Nothing here
17 |
--------------------------------------------------------------------------------
/src/app/conditionaldisplay/conditionaldisplay.component.spec.ts:
--------------------------------------------------------------------------------
1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2 | import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
3 | import { SharedModule } from '../shared/shared.module';
4 |
5 | import { ConditionalDisplayComponent } from './conditionaldisplay.component';
6 |
7 | describe('ConditionalDisplayComponent', () => {
8 | let component: ConditionalDisplayComponent;
9 | let fixture: ComponentFixture
4 |
6 |
--------------------------------------------------------------------------------
/src/app/gettingstarted/gettingstarted.component.scss:
--------------------------------------------------------------------------------
1 | .loading-set {
2 | margin-top: 50px;
3 | }
4 |
--------------------------------------------------------------------------------
/src/app/gettingstarted/gettingstarted.component.spec.ts:
--------------------------------------------------------------------------------
1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2 | import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
3 | import { SharedModule } from '../shared/shared.module';
4 |
5 | import { GettingStartedComponent } from './gettingstarted.component';
6 |
7 | describe('GettingStartedComponent', () => {
8 | let component: GettingStartedComponent;
9 | let fixture: ComponentFixturePreview file from Upload field
2 |
3 |
4 |
5 |
6 |
7 | Select any of your local files to preview it here
10 | -------------------------------------------------------------------------------- /src/app/uploadpreview/uploadpreview.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; 3 | import { SharedModule } from '../shared/shared.module'; 4 | 5 | import { UploadPreviewComponent } from './uploadpreview.component'; 6 | 7 | describe('UploadpreviewComponent', () => { 8 | let component: UploadPreviewComponent; 9 | let fixture: ComponentFixture":I.tabReplace?n.replace(/\t/g,I.tabReplace):""}):e}function h(e,n,t){var r=n?L[n]:t,a=[e.trim()];return e.match(/\bhljs\b/)||a.push("hljs"),-1===e.indexOf(r)&&a.push(r),a.join(" ").trim()}function d(e){var n,t,r,o,l,s=i(e);a(s)||(I.useBR?(n=document.createElementNS("http://www.w3.org/1999/xhtml","div"),n.innerHTML=e.innerHTML.replace(/\n/g,"").replace(/
82 |
90 |
83 |
85 |
86 |
89 |
85 |