Skip to content

Commit

Permalink
docs: update src docs to be in line with Wiki updates
Browse files Browse the repository at this point in the history
  • Loading branch information
CaerusKaru authored and ThomasBurleson committed May 12, 2018
1 parent cca27c0 commit f1b3589
Show file tree
Hide file tree
Showing 5 changed files with 57 additions and 180 deletions.
12 changes: 12 additions & 0 deletions docs/documentation/CI-Tools.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
### Continuous Integration (CI) Tools


Due to overuse of the Angular core license and loads on the Angular BrowserStack license, Flex-Layout has switched to an independent license of BrowserStack. This was will facilitate more stable CI testing [with PRs and builds] and avoid the excessive *timeouts* occurring with the Angular core license.

> This is a temporary solution only; started on March 9, 2018.
##### Building with Bazel

As part of efforts to migrate to building with Bazel, Flex-Layout is also migrating to CircleCI as part of the library's continuous integration toolset. This will work in tandem with Travis CI to handle all of our builds during the migration period.

More updates on our build process will be posted here as they're available.
179 changes: 0 additions & 179 deletions docs/documentation/Custom-Breakpoints.md

This file was deleted.

31 changes: 31 additions & 0 deletions docs/documentation/Using-SSR-with-Flex-Layout.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
`@angular/flex-layout` now supports server-side rendering (SSR).

Developers should see the Universal Demo app source for details:

* [main.server.ts](https://github.com/angular/flex-layout/blob/95a6e83bc9ce67a218d0b14e994ad41229b3ee75/src/apps/universal-app/src/main.server.ts)
* [app.server.module.ts](https://github.com/angular/flex-layout/blob/95a6e83bc9ce67a218d0b14e994ad41229b3ee75/src/apps/universal-app/src/app/app.server.module.ts)

> The `app.server.module` uses the *FlexLayoutServerModule* (instead of the FlexLayoutModule).
The *FlexLayoutServerModule* entrypoint consolidates the logic for running Flex Layout on the server. Because SSR usings uses Node.js APIs, the FlexLayoutServerModule must be segmented into a server-only bundle.

> This also helps avoid including server code in the browser bundle.
The `FlexLayoutServerModule`, can be imported into a server modulefile, e.g. `app.server.module.ts` as follows:

```typescript
import {NgModule} from '@angular/core';
import {FlexLayoutServerModule} from '@angular/flex-layout/server';

@NgModule(({
imports: [
... other imports here
FlexLayoutServerModule,
]
}))
export class AppServerModule {}
```

This module - in addition to handling all of the style processing/rendering before the Angular app is
bootstrapped on the server - also substitutes the version of `MatchMedia` with a server-compatible
implementation called `ServerMatchMedia`.
2 changes: 1 addition & 1 deletion docs/documentation/_Sidebar.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
* [Static API](https://github.com/angular/flex-layout/wiki/Declarative-API-Overview)
* [Responsive API](https://github.com/angular/flex-layout/wiki/Responsive-API)
* [API Documentation](https://github.com/angular/flex-layout/wiki/API-Documentation)
* [Custom Breakpoints](https://github.com/angular/flex-layout/wiki/Custom-Breakpoints)
* [Custom Breakpoints](https://github.com/angular/flex-layout/wiki/Breakpoints)
* [Best Performance](https://github.com/angular/flex-layout/wiki/Best-Performance)
* Demos
* [Live Online](https://tburleson-layouts-demos.firebaseapp.com/)
Expand Down
13 changes: 13 additions & 0 deletions docs/documentation/fxLayout-API.md
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,19 @@ container:
| `column` | `flex-direction: column` |
| `column-reverse` | `flex-direction: column-reverse` |


### fxLayout + wrap

By default, flex items will not wrap in their container. Formerly published as distinct directive, `fxLayoutWrap` was deprecated in favor of simply adding the **wrap** parameter as a secondary option to the `fxLayout` directive.

```html
<div fxLayout="row wrap">
<div>1. One</div> <div>2. Two</div> <div>3. Three</div> <div>4. Four</div>
</div>
```

Note: when using `wrap`, developers must **first** specify the layout direction.

### fxLayout Side-Effects

Changes to the fxLayout value will cause the following directives to update and modify their element stylings:
Expand Down

0 comments on commit f1b3589

Please sign in to comment.