README

Twitter Bootstrap-ready前端和布局包，适用于Symfony2。

Twig 布局

该包提供了两个布局的Twig模板（你可以扩展任意一个或两个）

1. EhannFrontendBundle::base.html.twig
2. EhannFrontendBundle:layouts:bootstrap.html.twig

EhannFrontendBundle::base.html.twig 模板包含一组模板块和Modernizr库（版本在composer.json中设置）。

EhannFrontendBundle:layouts:bootstrap.html.twig 模板扩展了EhannFrontendBundle::base.html.twig模板，并添加了 jQuery、Twitter Bootstrap、Font-Awesome、Bootbox 和 Bootstrap DateTime Picker。除了Font-Awesome外，所有这些库的版本都由EhannFrontendBundle的composer.json文件控制。由于Assetic的限制，Font-Awesome不是通过composer安装的，因为没有方法使用Assetic重写字体。这意味着如果Font-Awesome不在包外部安装，它将无法找到其字体文件，除非进行文件系统/符号链接的魔术操作。

Bootstrap 表单

Twitter Bootstrap期望表单中的HTML以特定的方式结构化。当包含 EhannFrontendBundle:forms:bootstrap_form_layout.html.twig 模板时，Twig默认表单块中的HTML会被重构为Twitter Bootstrap兼容的结构。

Assetic 过滤器

此EhannFrontendBundle还包含一个经过优化的Assetic配置，其中配置了各种过滤器以供使用。与这些过滤器相关的工具在安装模块时下载。过滤器包括

1. phpcssembed
2. yui_css
3. yui_js
4. lessphp
5. scssphp

相关包

EhannNotificationBundle - 利用 Symfony2 flash message feature 向您的应用程序添加Twitter Bootstrap-ready通知。

安装

在您的composer.json中添加EhannFrontEndBundle

// composer.json
{
    "require": {
        "ehann/frontend-bundle": "0.*"
    }
}

下载包

$ php composer.phar update ehann/frontend-bundle

将EhannFrontendBundle添加到您的AppKernel.php

public function registerBundles()
{
    $bundles = array(
        ...
        new Ehann\FrontendBundle\EhannFrontendBundle(),
        ...
    );
    ...
}

将EhannFrontendBundle的assetic.yml文件添加到您的应用程序配置文件中。

# app/config/config.yml
imports:
    - { resource: "@EhannFrontendBundle/Resources/config/assetic.yml" }

Composer 仓库

Composer 仓库只能在根应用程序的composer.json文件中定义。将这些仓库添加到您的应用程序的composer.json文件中

// composer.json
"repositories": [
    {
        "type": "package",
        "package": {
            "name": "yui/yui-compressor",
            "version": "2.4.7",
            "dist": {
                "url": "https://github.com/downloads/yui/yuicompressor/yuicompressor-2.4.7.zip",
                "type": "zip"
            }
        }
    },
    {
        "type": "package",
        "package": {
            "version": "v3.2.0",
            "name": "makeusabrew/bootbox",
            "source": {
                "url": "https://github.com/makeusabrew/bootbox.git",
                "type": "git",
                "reference": "master"
            },
            "dist": {
                "url": "https://github.com/makeusabrew/bootbox/zipball/v3.2.0",
                "type": "zip"
            }
        }
    },
    {
        "type": "package",
        "package": {
            "version": "v0.0.11",
            "name": "tarruda/bootstrap-datetimepicker",
            "source": {
                "url": "https://github.com/tarruda/bootstrap-datetimepicker.git",
                "type": "git",
                "reference": "master"
            },
            "dist": {
                "url": "https://github.com/tarruda/bootstrap-datetimepicker/zipball/v0.0.11",
                "type": "zip"
            }
        }
    }
]

配置

指定全局默认布局模板，使其可供应用程序中的所有包访问。

# app/config/config.yml
ehann_frontend:
    default_layout: "EhannFrontendBundle:layouts:bootstrap.html.twig"

通过扩展默认布局来扩展自己的模板。

{% extends ehann_frontend_default_layout  %}