https://github.com/humanbrainproject/hbp-collaboratory-theme
A Bootstrap 3 Theme for HBP Collaboratory Extensions
https://github.com/humanbrainproject/hbp-collaboratory-theme
Last synced: 6 months ago
JSON representation
A Bootstrap 3 Theme for HBP Collaboratory Extensions
- Host: GitHub
- URL: https://github.com/humanbrainproject/hbp-collaboratory-theme
- Owner: HumanBrainProject
- License: mit
- Created: 2015-08-14T08:58:49.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2019-09-12T13:23:25.000Z (over 6 years ago)
- Last Synced: 2025-02-23T10:08:37.052Z (about 1 year ago)
- Language: HTML
- Size: 1.1 MB
- Stars: 1
- Watchers: 13
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# hbp-collaboratory-theme
A Bootstrap 3 Theme for HBP Collaboratory Extensions
[](https://bbpcode.epfl.ch/ci/job/platform.collaboratory-theme.github/1/)
# Setup Collaboratory Theme
This library package the HBP theme and Bootstrap so that you don't need to
import both libraries.
## Install with Bower
```
bower install hbp-collaboratory-theme
```
## Using Sass
Import `dist/sass/theme.scss`
```scss
// Assuming that `bower_components` is in your Sass import path
@import hbp-collaboratory-theme/dist/sass/theme.scss
```
## Using CSS
Link to `dist/css/bootstrap.min.css`
```
```
## Javascript dependencies
A few Bootstrap components requires a counterpart javascript library. The loaded
library depends of the underlying framework.
Bootstrap jQuery plugin is included in this bundle as an optional dependency.
If you are developing an angular based application, you need to rely on
`angular-bootstrap` component instead.
### Angular JS based project
Install `ui.bootstrap`
```
bower install angular-bootstrap
```
Require the module in your application.
```js
var app = angular.module('MyApp', ['ui.bootstrap']);
```
### jQuery based proejct
Include the `bootstrap.js` library in your HTML page.
```html
```
# Usage
You can discover the look and feel of the theme by opening the kitchen sink page located at `./dist/examples/kitchen-sink.html`.
This is just a theme over Bootstrap so all [Bootstrap official documentation](http://getbootstrap.com/) apply and should be considered accurate.
# Development
Run watcher and server using grunt:
```bash
grunt serve
```
You can then access a development server on http://localhost:8100.
Each time a modification is detected, the corresponding files will be
regenerated. If a Sass file is modified, the `dist` folder will be rebuilt
as well, which means that you can link this project with other Bower enable
development folder and have the change propagated.
# Credits
The project structure and build files are inspired by the [Themestrap] template.
The kitchen sink especially is a direct copy of a huge amount of work from this
project.
The main variation is that we use Bootstrap Sass instead of Less.
[Themestrap]: http://code.divshot.com/themestrap/
# Acknowledgement
This open source software code was developed in part or in whole in the Human Brain Project, funded from the European Union’s Horizon 2020 Framework Programme for Research and Innovation under the Specific Grant Agreement No. 720270 (Human Brain Project SGA1).