TypeScript bobril.styledDiv函数代码示例

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› TypeScript›TypeScript教程

原作者: [db:作者] 来自: [db:来源] 收藏邀请

本文整理汇总了TypeScript中bobril.styledDiv函数的典型用法代码示例。如果您正苦于以下问题：TypeScript styledDiv函数的具体用法？TypeScript styledDiv怎么用？TypeScript styledDiv使用的例子？那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。

在下文中一共展示了styledDiv函数的9个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1:

 d.leftChildren.map((button) => {
     return b.styledDiv(
         button,
         styles.button,
     );
 }),

开发者ID:LongerP，项目名称:bobril.github.io，代码行数:6，代码来源:lib.ts

示例2:

export const Subheader = (data: ISubheaderData, children?: b.IBobrilCacheChildren) => {
    if (data == null) data = {};
    return b.styledDiv(data.children || children, subheaderStyle, { paddingLeft: data.inset ? 72 : 16 });
}

开发者ID:JakubJecminek，项目名称:bobril-m，代码行数:4，代码来源:subheader.ts

示例3: render

interface IContext extends b.IBobrilCtx {
    data: IData;
}

const home = b.createComponent<IData>({
    render(ctx: IContext, me: b.IBobrilNode) {
        me.children = [
            b.styledDiv(
                LCenter.create({
                    children: Splitter.create({
                        children: [
                            FeatureListSection.create(),
                            BobrilLogoSection.create({
                                onGetStartedClick: () => {

                                }
                            }),
                            FurrySection.create(),
                        ]
                    }),
                    maxWidth: styles.maxPageWidth
                }),
                bobrilPromoStyle
            ),
            LCenter.create({
                children: [
                    CoreFeaturesPromo.create(),
                    Divider.create(),
                    GetStartedSection.create()
                ],
                maxWidth: styles.maxPageWidth,

开发者ID:LongerP，项目名称:bobril.github.io，代码行数:31，代码来源:page.ts

示例4: container

export function container(children: b.IBobrilChildren): b.IBobrilChildren {
    return b.styledDiv(children, containerStyle);
}

开发者ID:karelsteinmetz，项目名称:bobril-flexbox-grid，代码行数:3，代码来源:helpers.ts

示例5:

 return b.styledDiv(children.map((child) => {
     return b.styledDiv(child, { flex: 1 });
 }), { display: 'flex' });

开发者ID:jirgl，项目名称:bobril-m，代码行数:3，代码来源:example.ts

示例6:

        const d = ctx.data;

        me.children = b.styledDiv(
            [
                Image.create({
                    asset: assets.bobrilLogo,
                    width: 300,
                    height: 284,
                    style: {
                        margin: 'auto'
                    }
                }),
                // TODO
                // b.styledDiv(
                //     m.Button({
                //         children: 'GET STARTED',
                //         type: m.ButtonType.Raised,
                //         action: () => {
                //             d.onGetStartedClick();
                //         }
                //     }),
                //     {
                //         marginBottom: 8
                //     }
                // )
            ],
            {
                marginTop: -24
            }
        )
    }
});

开发者ID:LongerP，项目名称:bobril.github.io，代码行数:32，代码来源:bobrilLogo.ts

示例7: render

    return position >= riderSize && position <= ctx.width - riderSize;
}

export const ColorBar = b.createComponent<IColorBarData>({
    render(ctx: IColorBarCtx, me: b.IBobrilNode) {
        const rgb = graphics.hsvToRgb({ h: ctx.data.hue, s: 1, v: 1 });
        me.children = b.styledDiv([
            b.styledDiv(ColorRider({
                height: riderSize * 2,
                x: getPosition(ctx),
                y: riderSize,
                innerColor: rgb,
                outerColor: { r: rgb.r, g: rgb.g, b: rgb.b, a: 0.3 }
            }), { width: '100%', position: 'absolute', top: -12 }),
            b.styledDiv(null, {
                background: 'linear-gradient(to right, ' +
                'rgb(255, 0, 0) 0%, rgb(255, 255, 0) 17%, rgb(0, 255, 0) 33%, rgb(0, 255, 255) 50%, ' +
                'rgb(0, 0, 255) 67%, rgb(255, 0, 255) 83%, rgb(255, 0, 0) 100%)',
                height: 5,
                marginTop: 10,
                marginBottom: 10,
                marginLeft: riderSize,
                marginRight: riderSize
            })
        ], { position: 'relative' });
    },
    postInitDom(ctx: IColorBarCtx, me: b.IBobrilCacheNode, element: HTMLElement) {
        ctx.width = element.offsetWidth;
    },
    postUpdateDom(ctx: IColorBarCtx, me: b.IBobrilCacheNode, element: HTMLElement) {
        ctx.width = element.offsetWidth;

开发者ID:jirgl，项目名称:color-picker，代码行数:31，代码来源:colorBar.ts

示例8: getSuiteDetail

function getSuiteDetail(a: SuiteOrTest): b.IBobrilChildren {
    return [
        b.styledDiv(a.name, suiteDivStyle),
        b.styledDiv(getSuitesDetail(a.nested), suiteChildrenIndentStyle)
    ];
}

开发者ID:tejnora，项目名称:bobril-build，代码行数:6，代码来源:index.ts

示例9: render

    footer?: b.IBobrilChildren;
    backgroundColor?: string;
}

interface IContext extends b.IBobrilCtx {
    data: IData;
}

export const create = b.createComponent<IData>({
    render(ctx: IContext, me: b.IBobrilNode) {
        const d = ctx.data;

        me.children = [
            d.header && m.Paper({
                zDepth: zDepthHeader,
                children: b.styledDiv(d.header, styles.header)
            }),
            d.content && b.styledDiv(
                d.content,
                styles.content,
            ),
            d.footer && b.styledDiv(d.footer, styles.footer)
        ];

        b.style(
            me,
            styles.basicLayout,
            d.backgroundColor && {background: d.backgroundColor}
        );
    }
});

开发者ID:LongerP，项目名称:bobril.github.io，代码行数:31，代码来源:lib.ts

注：本文中的bobril.styledDiv函数示例由纯净天空整理自Github/MSDocs等源码及文档管理平台，相关代码片段筛选自各路编程大神贡献的开源项目，源码版权归原作者所有，传播和使用请参考对应项目的License；未经允许，请勿转载。