-
Notifications
You must be signed in to change notification settings - Fork 348
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
18 changed files
with
575 additions
and
431 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,167 @@ | ||
Installation | ||
============ | ||
|
||
Prerequisites | ||
------------- | ||
|
||
### Less (recommended) | ||
|
||
Less is not required, but is extremely helpful when using bootstrap2 variables, or mixins, | ||
If you want to have a easier life, have a look into: | ||
If you do not have less installed, currently you have several option, but please do NOT ask for help. | ||
|
||
[Less Documentation](https://github.com/phiamo/MopaBootstrapBundle/blob/master/Resources/doc/less-installation.md) | ||
|
||
Installation | ||
------------ | ||
|
||
1. Add this bundle to your project in composer.json: | ||
|
||
1.2. Plain BootstrapBundle | ||
symfony 2.1 uses composer (http://www.getcomposer.org) to organize dependencies: | ||
|
||
```json | ||
{ | ||
"require": { | ||
"mopa/bootstrap-bundle": "dev-master", | ||
} | ||
} | ||
``` | ||
1.2. BootstrapBundle and twitters bootstrap | ||
|
||
To have composer managing twitters bootstrap too, you can either run it with | ||
--install-suggests or add the following to your composer.json: | ||
|
||
```json | ||
{ | ||
"require": { | ||
"mopa/bootstrap-bundle": "dev-master", | ||
"twitter/bootstrap": "master" | ||
}, | ||
"repositories": [ | ||
{ | ||
"type": "package", | ||
"package": { | ||
"version": "master", /* whatever version you want */ | ||
"name": "twitter/bootstrap", | ||
"source": { | ||
"url": "https://github.com/twitter/bootstrap.git", | ||
"type": "git", | ||
"reference": "master" | ||
}, | ||
"dist": { | ||
"url": "https://github.com/twitter/bootstrap/zipball/master", | ||
"type": "zip" | ||
} | ||
} | ||
} | ||
] | ||
} | ||
``` | ||
|
||
1.3. BootstrapBundle, twitters bootstrap and further suggests | ||
|
||
```json | ||
{ | ||
"require": { | ||
"mopa/bootstrap-bundle": "dev-master", | ||
"twitter/bootstrap": "master", | ||
"knplabs/knp-paginator-bundle": "dev-master", | ||
"knplabs/knp-menu-bundle": "dev-master", | ||
"craue/formflow-bundle": "dev-master" | ||
}, | ||
"repositories": [ | ||
{ | ||
"type": "package", | ||
"package": { | ||
"version": "master", /* whatever version you want */ | ||
"name": "twitter/bootstrap", | ||
"source": { | ||
"url": "https://github.com/twitter/bootstrap.git", | ||
"type": "git", | ||
"reference": "master" | ||
}, | ||
"dist": { | ||
"url": "https://github.com/twitter/bootstrap/zipball/master", | ||
"type": "zip" | ||
} | ||
} | ||
} | ||
] | ||
} | ||
``` | ||
|
||
1.4. BootstrapBundle, twitters bootstrap and automatic symlinking | ||
|
||
If you decided to let composer install twitters bootstrap, you might want to activate auto symlinking and checking, after composer update/install. | ||
So add this to your existing scripts section in your composer json: | ||
(recommended!) | ||
|
||
```json | ||
{ | ||
"scripts": { | ||
"post-install-cmd": [ | ||
"Mopa\\Bundle\\BootstrapBundle\\Composer\\ScriptHandler::postInstallSymlinkTwitterBootstrap" | ||
], | ||
"post-update-cmd": [ | ||
"Mopa\\Bundle\\BootstrapBundle\\Composer\\ScriptHandler::postInstallSymlinkTwitterBootstrap" | ||
] | ||
} | ||
} | ||
``` | ||
|
||
There is also a console command to check and / or install this symlink: | ||
|
||
```bash | ||
php app/console mopa:bootstrap:install | ||
``` | ||
|
||
With these steps taken, bootstrap should be install into vendor/twitter/bootstrap/ and a symlink | ||
been created into vendor/mopa/bootstrap-bundle/Mopa/BootstrapBundle/Resources/bootstrap. | ||
|
||
1.5. Include bootstrap manually or in another way: | ||
|
||
For including bootstrap there are different solutions, why using this one? | ||
have a look into [Including Bootstrap](https://github.com/phiamo/MopaBootstrapBundle/blob/master/Resources/doc/including-bootstrap.md) | ||
|
||
2. Add this bundle to your app/AppKernel.php: | ||
|
||
``` php | ||
// application/ApplicationKernel.php | ||
public function registerBundles() | ||
{ | ||
return array( | ||
// ... | ||
new Mopa\Bundle\BootstrapBundle\MopaBootstrapBundle(), | ||
// ... | ||
); | ||
} | ||
``` | ||
|
||
2.1. If you decided to add knp-menu-bundle, knp-paginator-bundle, or craue-formflow-bundle add them too: | ||
|
||
``` php | ||
// application/ApplicationKernel.php | ||
public function registerBundles() | ||
{ | ||
return array( | ||
// ... | ||
new Mopa\Bundle\BootstrapBundle\MopaBootstrapBundle(), | ||
new Knp\Bundle\MenuBundle\KnpMenuBundle(), | ||
new Knp\Bundle\PaginatorBundle\KnpPaginatorBundle(), | ||
new Craue\FormFlowBundle\CraueFormFlowBundle(), | ||
// ... | ||
); | ||
} | ||
``` | ||
|
||
3. If you like configure your config.yml (not mandatory) | ||
|
||
``` yaml | ||
mopa_bootstrap: | ||
form: | ||
show_legend: false # default is true | ||
show_child_legend: false # default is true | ||
error_type: block # or inline which is default | ||
``` | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,75 @@ | ||
Using bootstrap in the layout | ||
============================= | ||
|
||
Prerequisites | ||
------------- | ||
|
||
### Less (recommended) | ||
|
||
Less is not required, but is extremely helpful when using bootstrap2 variables, or mixins, | ||
If you want to have a easier life, have a look into: | ||
|
||
[Less Documentation](https://github.com/phiamo/MopaBootstrapBundle/blob/master/Resources/doc/less-installation.md) | ||
|
||
Templates | ||
--------- | ||
|
||
Have a look at the provided [base.html.twig](https://github.com/phiamo/MopaBootstrapBundle/blob/master/Resources/views/layout.html.twig) its a fully working bootstrap layout and might explain howto use it by itself. | ||
|
||
There is also a [base_lessjs.html.twig](https://github.com/phiamo/MopaBootstrapBundle/blob/master/Resources/views/base_lessjs.html.twig) with clientside less.js. This is currently not recommended, because you need to setup bootstrap and the less files to use it yourself. | ||
|
||
There is also a [base_css.html.twig](https://github.com/phiamo/MopaBootstrapBundle/blob/master/Resources/views/base_css.html.twig) for usage without less. | ||
Have a look into https://github.com/phiamo/MopaBootstrapBundle/blob/master/Resources/doc/css-vs-less.md | ||
|
||
|
||
Usage | ||
----- | ||
|
||
To make use of the supplied base.html.twig template just use it, or | ||
defining a new template: | ||
|
||
app/Resources/MopaBootstrapBundle/views/layout.html.twig | ||
|
||
```jinja | ||
{% extends 'MopaBootstrapBundle::base.html.twig' %} | ||
{% block title %}Yourapp{% endblock %} | ||
{# and define more blocks ... #} | ||
``` | ||
|
||
You are free to overwrite any defined blocks. | ||
Have a look into the sandbox too: | ||
|
||
* http://bootstrap.mohrenweiserpartner.de/mopa/bootstrap/layout | ||
* https://github.com/phiamo/symfony-bootstrap-sandbox/blob/master/app/Resources/MopaBootstrapBundle/views/layout.html.twig | ||
|
||
If you are using less just include the mopabootstrap.less as described in layout.html.twig | ||
|
||
``` jinja | ||
{% stylesheets filter='less,cssrewrite,?yui_css' | ||
'@MopaBootstrapBundle/Resources/public/less/mopabootstrapbundle.less' | ||
'@YourNiceBundle/Resources/public/less/*' | ||
%} | ||
<link href="{{ asset_url }}" type="text/css" rel="stylesheet" /> | ||
{% endstylesheets %} | ||
``` | ||
|
||
If you would like to use the css try this: | ||
|
||
```bash | ||
cd vendor/mopa/bootstrap-bundle/Mopa/BootstrapBundle/Resources/bootstrap | ||
make | ||
``` | ||
if it doesnt work, why not use the less way? | ||
|
||
``` jinja | ||
{% block head_style %} | ||
{% stylesheets filter='cssrewrite,?yui_css' | ||
'@MopaBootstrapBundle/Resources/bootstrap/bootstrap.css' | ||
'@YourNiceBundle/Resources/public/css/*' | ||
%} | ||
<link href="{{ asset_url }}" type="text/css" rel="stylesheet" | ||
media="screen" /> | ||
{% endstylesheets %} |
Oops, something went wrong.