Skip to content

Commit 81cb0ff

Browse files
committed
docs(config): update config docs to include a description for each property
also updated the demo to use quotes around the values. references ionic-team/ionic-site#585
1 parent c5c1498 commit 81cb0ff

File tree

2 files changed

+33
-31
lines changed

2 files changed

+33
-31
lines changed

demos/config/main.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -43,9 +43,9 @@
4343
<!-- this has to be formatted weird for pre -->
4444
<pre margin>@App({
4545
config: {
46-
backButtonIcon: {{initialConfig.backButtonIcon}}
47-
iconMode: {{initialConfig.iconMode}}
48-
tabbarPlacement: {{initialConfig.tabbarPlacement}}
46+
backButtonIcon: "{{initialConfig.backButtonIcon}}"
47+
iconMode: "{{initialConfig.iconMode}}"
48+
tabbarPlacement: "{{initialConfig.tabbarPlacement}}"
4949
}
5050
})</pre>
5151

ionic/config/config.ts

Lines changed: 30 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -80,36 +80,38 @@ import {isObject, isDefined, isFunction, isArray} from '../util/util';
8080
* ```
8181
*
8282
*
83-
* A config value can come from anywhere and be anything, but there are a default set of values.
83+
* A config value can come from anywhere and be anything, but there are default
84+
* values for each mode. The [theming](../../../theming/platform-specific-styles/)
85+
* documentation has a chart of the default mode configuration. The following
86+
* chart displays each property with a description of what it controls.
8487
*
8588
*
86-
* | Config property | Default `ios` Value | Default `md` Value | Default `wp` Value |
87-
* |----------------------------|--------------------------|-----------------------------|-----------------------------|
88-
* | activator | "highlight" | "ripple" | "highlight" |
89-
* | actionSheetEnter | "action-sheet-slide-in" | "action-sheet-md-slide-in" | "action-sheet-wp-slide-in" |
90-
* | actionSheetLeave | "action-sheet-slide-out" | "action-sheet-md-slide-out" | "action-sheet-wp-slide-out" |
91-
* | alertEnter | "alert-pop-in" | "alert-md-pop-in" | "alert-wp-pop-in" |
92-
* | alertLeave | "alert-pop-out" | "alert-md-pop-out" | "alert-wp-pop-out" |
93-
* | backButtonText | "Back" | "" | "" |
94-
* | backButtonIcon | "ios-arrow-back" | "md-arrow-back" | "ios-arrow-back" |
95-
* | iconMode | "ios" | "md" | "ios" |
96-
* | loadingEnter | "loading-pop-in" | "loading-md-pop-in" | "loading-wp-pop-in" |
97-
* | loadingLeave | "loading-pop-out" | "loading-md-pop-out" | "loading-wp-pop-out" |
98-
* | menuType | "reveal" | "overlay" | "overlay" |
99-
* | modalEnter | "modal-slide-in" | "modal-md-slide-in" | "modal-md-slide-in" |
100-
* | modalLeave | "modal-slide-out" | "modal-md-slide-out" | "modal-md-slide-out" |
101-
* | pageTransition | "ios-transition" | "md-transition" | "wp-transition" |
102-
* | pageTransitionDelay | 16 | 96 | 96 |
103-
* | pickerEnter | "picker-slide-in" | "picker-slide-in" | "picker-slide-in" |
104-
* | pickerLeave | "picker-slide-out" | "picker-slide-out" | "picker-slide-out" |
105-
* | pickerRotateFactor | -0.46 | | |
106-
* | spinner | "ios" | "crescent" | "circles" |
107-
* | tabbarHighlight | | true | |
108-
* | tabbarLayout | | | |
109-
* | tabbarPlacement | "bottom" | "top" | "top" |
110-
* | tabSubPages | | true | true |
111-
* | toastEnter | "toast-slide-in" | "toast-md-slide-in" | "toast-wp-slide-in" |
112-
* | toastLeave | "toast-slide-out" | "toast-md-slide-out" | "toast-wp-slide-out" |
89+
* | Config Property | Type | Details |
90+
* |--------------------------|---------------------|--------------------------------------------------------------------------------------------------------------------------------------------------|
91+
* | `activator` | `string` | Used for buttons, changes the effect of pressing on a button. Available options: `"ripple"`, `"highlight"`. |
92+
* | `actionSheetEnter` | `string` | The name of the transition to use while an action sheet is presented. |
93+
* | `actionSheetLeave` | `string` | The name of the transition to use while an action sheet is dismissed. |
94+
* | `alertEnter` | `string` | The name of the transition to use while an alert is presented. |
95+
* | `alertLeave` | `string` | The name of the transition to use while an alert is dismissed. |
96+
* | `backButtonText` | `string` | The text to display by the back button icon in the navbar. |
97+
* | `backButtonIcon` | `string` | The icon to use as the back button icon. |
98+
* | `iconMode` | `string` | The mode to use for all icons throughout the application. Available options: `"ios"`, `"md"` |
99+
* | `loadingEnter` | `string` | The name of the transition to use while a loading indicator is presented. |
100+
* | `loadingLeave` | `string` | The name of the transition to use while a loading indicator is dismissed. |
101+
* | `menuType` | `string` | Type of menu to display. Available options: `"overlay"`, `"reveal"`, `"push"`. |
102+
* | `modalEnter` | `string` | The name of the transition to use while a modal is presented. |
103+
* | `modalLeave` | `string` | The name of the transition to use while a modal is dismiss. |
104+
* | `pageTransition` | `string` | The name of the transition to use while changing pages. |
105+
* | `pageTransitionDelay` | `number` | The delay in milliseconds before the transition starts while changing pages. |
106+
* | `pickerEnter` | `string` | The name of the transition to use while a picker is presented. |
107+
* | `pickerLeave` | `string` | The name of the transition to use while a picker is dismissed. |
108+
* | `spinner` | `string` | The default spinner to use when a name is not defined. |
109+
* | `tabbarHighlight` | `boolean` | Whether to show a highlight line under the tab when it is selected. |
110+
* | `tabbarLayout` | `string` | The layout to use for all tabs. Available options: `"icon-top"`, `"icon-left"`, `"icon-right"`, `"icon-bottom"`, `"icon-hide"`, `"title-hide"`. |
111+
* | `tabbarPlacement` | `string` | The position of the tabs. Available options: `"top"`, `"bottom"` |
112+
* | `tabSubPages` | `boolean` | Whether to hide the tabs on child pages or not. If `true` it will not show the tabs on child pages. |
113+
* | `toastEnter` | `string` | The name of the transition to use while a toast is presented. |
114+
* | `toastLeave` | `string` | The name of the transition to use while a toast is dismissed. |
113115
*
114116
**/
115117
export class Config {

0 commit comments

Comments
 (0)