| 1 | /*
|
| 2 | Copyright 2013-2015 ASIAL CORPORATION
|
| 3 |
|
| 4 | Licensed under the Apache License, Version 2.0 (the "License");
|
| 5 | you may not use this file except in compliance with the License.
|
| 6 | You may obtain a copy of the License at
|
| 7 |
|
| 8 | http://www.apache.org/licenses/LICENSE-2.0
|
| 9 |
|
| 10 | Unless required by applicable law or agreed to in writing, software
|
| 11 | distributed under the License is distributed on an "AS IS" BASIS,
|
| 12 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
| 13 | See the License for the specific language governing permissions and
|
| 14 | limitations under the License.
|
| 15 |
|
| 16 | */
|
| 17 |
|
| 18 | import onsElements from '../ons/elements.js';
|
| 19 | import BaseElement from './base/base-element.js';
|
| 20 |
|
| 21 | /**
|
| 22 | * @element ons-row
|
| 23 | * @category grid
|
| 24 | * @description
|
| 25 | * [en]Represents a row in the grid system. Use with `<ons-col>` to layout components.[/en]
|
| 26 | * [ja]グリッドシステムにて行を定義します。ons-colとともに使用し、コンポーネントの配置に使用します。[/ja]
|
| 27 | * @codepen GgujC {wide}
|
| 28 | * @guide features.html
|
| 29 | * [en]Layouting guide[/en]
|
| 30 | * [ja]レイアウト調整[/ja]
|
| 31 | * @seealso ons-col
|
| 32 | * [en]The `<ons-col>` component is used as children of `<ons-row>`.[/en]
|
| 33 | * [ja]ons-colコンポーネント[/ja]
|
| 34 | * @note
|
| 35 | * [en]For Android 4.3 and earlier, and iOS6 and earlier, when using mixed alignment with ons-row and ons-col, they may not be displayed correctly. You can use only one vertical-align.[/en]
|
| 36 | * [ja]Android 4.3以前、もしくはiOS 6以前のOSの場合、ons-rowとons-colを組み合わせてそれぞれのons-col要素のvertical-align属性の値に別々の値を指定すると、描画が崩れる場合があります。vertical-align属性の値には一つの値だけを指定できます。[/ja]
|
| 37 | * @example
|
| 38 | * <ons-row>
|
| 39 | * <ons-col width="50px"><ons-icon icon="fa-twitter"></ons-icon></ons-col>
|
| 40 | * <ons-col>Text</ons-col>
|
| 41 | * </ons-row>
|
| 42 | */
|
| 43 |
|
| 44 | /**
|
| 45 | * @attribute vertical-align
|
| 46 | * @type {String}
|
| 47 | * @description
|
| 48 | * [en]Short hand attribute for aligning vertically. Valid values are top, bottom, and center.[/en]
|
| 49 | * [ja]縦に整列するために指定します。top、bottom、centerのいずれかを指定できます。[/ja]
|
| 50 | */
|
| 51 |
|
| 52 | export default class RowElement extends BaseElement {
|
| 53 | }
|
| 54 |
|
| 55 | onsElements.Row = RowElement;
|
| 56 | customElements.define('ons-row', RowElement);
|