fix(aio): cheatsheet table layout fix
This commit is contained in:
parent
6748aeabb6
commit
919ff12377
|
@ -3,9 +3,8 @@ Cheat Sheet
|
|||
|
||||
@description
|
||||
|
||||
<div class="l-content-small grid-fluid docs-content cheatsheet">
|
||||
|
||||
<table>
|
||||
<div id="cheatsheet">
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>Bootstrapping</th>
|
||||
<th><p><code>import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';</code>
|
||||
|
@ -19,7 +18,7 @@ Cheat Sheet
|
|||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<table>
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>NgModules</th>
|
||||
<th><p><code>import { NgModule } from '@angular/core';</code>
|
||||
|
@ -54,7 +53,7 @@ is available to <code>declarations</code> of this module.</p>
|
|||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<table>
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>Template syntax</th>
|
||||
<th></th>
|
||||
|
@ -120,7 +119,7 @@ is available to <code>declarations</code> of this module.</p>
|
|||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<table>
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>Built-in directives</th>
|
||||
<th><p><code>import { CommonModule } from '@angular/common';</code>
|
||||
|
@ -146,7 +145,7 @@ is available to <code>declarations</code> of this module.</p>
|
|||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<table>
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>Forms</th>
|
||||
<th><p><code>import { FormsModule } from '@angular/forms';</code>
|
||||
|
@ -160,7 +159,7 @@ is available to <code>declarations</code> of this module.</p>
|
|||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<table>
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>Class decorators</th>
|
||||
<th><p><code>import { Directive, ... } from '@angular/core';</code>
|
||||
|
@ -187,7 +186,7 @@ is available to <code>declarations</code> of this module.</p>
|
|||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<table>
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>Directive configuration</th>
|
||||
<th><p><code>@Directive({ property1: value1, ... })</code>
|
||||
|
@ -207,7 +206,7 @@ is available to <code>declarations</code> of this module.</p>
|
|||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<table>
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>Component configuration</th>
|
||||
<th><p>
|
||||
|
@ -234,7 +233,7 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<table>
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>Class field decorators for directives and components</th>
|
||||
<th><p><code>import { Input, ... } from '@angular/core';</code>
|
||||
|
@ -277,7 +276,7 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<table>
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>Directive and component change detection and lifecycle hooks</th>
|
||||
<th><p>(implemented as class methods)
|
||||
|
@ -323,7 +322,7 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<table>
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>Dependency injection configuration</th>
|
||||
<th></th>
|
||||
|
@ -343,7 +342,7 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<table>
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
<tbody><tr>
|
||||
<th>Routing and navigation</th>
|
||||
<th><p><code>import { Routes, RouterModule, ... } from '@angular/router';</code>
|
||||
|
@ -388,5 +387,4 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
</td>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
</div>
|
|
@ -8,6 +8,10 @@ table {
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
&.is-fixed-layout {
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
thead {
|
||||
vertical-align: middle;
|
||||
border-color: inherit;
|
||||
|
@ -84,3 +88,7 @@ table {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
#cheatsheet table tbody td {
|
||||
overflow: auto;
|
||||
}
|
Loading…
Reference in New Issue