PHPackages                             todc/todc-bootstrap - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. todc/todc-bootstrap

ActiveLibrary

todc/todc-bootstrap
===================

Google-styled theme for Bootstrap.

v3.0.2(12y ago)2.1k873223[4 issues](https://github.com/todc/todc-bootstrap/issues)MITHTMLCI passing

Since Oct 2Pushed 2mo ago75 watchersCompare

[ Source](https://github.com/todc/todc-bootstrap)[ Packagist](https://packagist.org/packages/todc/todc-bootstrap)[ Docs](http://todc.github.io/todc-bootstrap/)[ RSS](/packages/todc-todc-bootstrap/feed)WikiDiscussions main Synced 2mo ago

READMEChangelog (10)DependenciesVersions (4)Used By (0)

 [ ![TODC Bootstrap logo](https://camo.githubusercontent.com/b7cdbe53d106e5c92450d8b77e354c162cc0071168dbbbd566bf038d657ae6dd/68747470733a2f2f746f64632e6769746875622e696f2f746f64632d626f6f7473747261702f646f63732f352e302f6173736574732f6272616e642f746f64632d626f6f7473747261702d6c6f676f2d736861646f772e706e67) ](https://todc.github.io/todc-bootstrap/)

### TODC Bootstrap

[](#todc-bootstrap)

 A Google-styled theme for [Bootstrap](https://v5.getbootstrap.com/).
 [**Explore TODC Bootstrap docs »**](https://todc.github.io/todc-bootstrap/docs/5.0/)

 [Report bug](https://github.com/todc/todc-bootstrap/issues/new?template=bug_report.md) · [Request feature](https://github.com/todc/todc-bootstrap/issues/new?template=feature_request.md)

Table of contents
-----------------

[](#table-of-contents)

- [Overview](#overview)
- [Quick start](#quick-start)
- [Status](#status)
- [Compatibility](#compatibility)
- [Requirements](#requirements)
- [Bugs and feature requests](#bugs-and-feature-requests)
- [Documentation](#documentation)
- [Contributing](#contributing)
- [Versioning](#versioning)
- [Creators](#creators)
- [Thanks](#thanks)
- [Copyright and license](#copyright-and-license)
- [Acknowledgements](#acknowledgements)

Overview
--------

[](#overview)

This is a Google-styled theme for Bootstrap. Because I'm a fan of the new Google UI seen in Gmail, Docs, Calendar, etc, I decided to reproduce the look of these new UI elements for my own personal use. The project's goal isn't UI parity with Google Apps -- it's feature parity with Bootstrap, themed with Google's UI in mind.

TODC Bootstrap was created by [Tim O'Donnell](https://github.com/todc), and maintained with the support and involvement of the community.

Quick start
-----------

[](#quick-start)

Several quick start options are available:

- [Download the latest release](https://github.com/todc/todc-bootstrap/archive/v5.0.0-5.0.0-alpha2.zip).
- Clone the repo: `git clone https://github.com/todc/todc-bootstrap.git`.
- Install with [npm](https://www.npmjs.com/): `npm install todc-bootstrap@next`
- Install with [yarn](https://yarnpkg.com/): `yarn add todc-bootstrap@next`
- Install with [Composer](https://getcomposer.org/): `composer require todc/todc-bootstrap:5.0.0-5.0.0-alpha2`.

**NOTE** - After cloning/installing todc-bootstrap you must run `grunt checkout-bootstrap` from the todc-bootstrap directory. This will download the correct version of the [Bootstrap](https://github.com/twbs/bootstrap/) source.

Read the [Getting started page](https://todc.github.io/todc-bootstrap/docs/5.0/getting-started/introduction/) for information on the framework contents, templates and examples, and more.

Status
------

[](#status)

[![devDependency Status](https://camo.githubusercontent.com/8e44df3469ef14a4268060187cb5efec47e455ac90b9a1744ad6cd158430ccf2/68747470733a2f2f696d672e736869656c64732e696f2f64617669642f6465762f747762732f626f6f747374726170)](https://david-dm.org/todc/todc-bootstrap?type=dev)[![CSS gzip size](https://camo.githubusercontent.com/8ad759ce2f7573766484c7d05856117494d7cef21bc01dc430f0bdb0a1587823/68747470733a2f2f696d672e626164676573697a652e696f2f747762732f626f6f7473747261702f6d61696e2f646973742f6373732f626f6f7473747261702e6d696e2e6373733f636f6d7072657373696f6e3d677a6970266c6162656c3d435353253230677a697025323073697a65)](https://github.com/twbs/bootstrap/blob/main/dist/css/bootstrap.min.css)[![JS gzip size](https://camo.githubusercontent.com/c04c1fbf653574b8073b3944609686920c0419838aab3ed0de18c3f48a6f8e74/68747470733a2f2f696d672e626164676573697a652e696f2f747762732f626f6f7473747261702f6d61696e2f646973742f6a732f626f6f7473747261702e6d696e2e6a733f636f6d7072657373696f6e3d677a6970266c6162656c3d4a532b677a69702b73697a65)](https://github.com/twbs/bootstrap/blob/main/dist/js/bootstrap.min.js)[![JS gzip size](https://camo.githubusercontent.com/4a4a440c2a5da82fc8450bc54ed0bdea60935c31decead5f093724fecc4e4117/68747470733a2f2f696d672e626164676573697a652e696f2f747762732f626f6f7473747261702f6d61696e2f646973742f6a732f626f6f7473747261702e6d696e2e6a733f636f6d7072657373696f6e3d677a6970266c6162656c3d4a53253230677a697025323073697a65)](https://github.com/twbs/bootstrap/blob/main/dist/js/bootstrap.min.js)

**TODO - Configure BrowserStack**

### What's included

[](#whats-included)

Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations. You'll see something like this:

```
todc-bootstrap/
└── dist/
    ├── css/
    │   ├── bootstrap-grid.css
    │   ├── bootstrap-grid.css.map
    │   ├── bootstrap-grid.min.css
    │   ├── bootstrap-grid.min.css.map
    │   ├── bootstrap-reboot.css
    │   ├── bootstrap-reboot.css.map
    │   ├── bootstrap-reboot.min.css
    │   ├── bootstrap-reboot.min.css.map
    │   ├── bootstrap-utilities.css
    │   ├── bootstrap-utilities.css.map
    │   ├── bootstrap-utilities.min.css
    │   ├── bootstrap-utilities.min.css.map
    │   ├── bootstrap.css
    │   ├── bootstrap.css.map
    │   ├── bootstrap.min.css
    │   ├── bootstrap.min.css.map
    │   ├── todc-bootstrap-utilities.css
    │   ├── todc-bootstrap-utilities.css.map
    │   ├── todc-bootstrap-utilities.min.css
    │   ├── todc-bootstrap-utilities.min.css.map
    │   ├── todc-bootstrap.css
    │   ├── todc-bootstrap.css.map
    │   ├── todc-bootstrap.min.css
    │   └── todc-bootstrap.min.css.map
    └── js/
        ├── bootstrap.bundle.js
        ├── bootstrap.bundle.js.map
        ├── bootstrap.bundle.min.js
        ├── bootstrap.bundle.min.js.map
        ├── bootstrap.esm.js
        ├── bootstrap.esm.js.map
        ├── bootstrap.esm.min.js
        ├── bootstrap.esm.min.js.map
        ├── bootstrap.js
        ├── bootstrap.js.map
        ├── bootstrap.min.js
        └── bootstrap.min.js.map

```

We provide compiled CSS and JS (`bootstrap.*, todc-bootstrap.*`), as well as compiled and minified CSS and JS (`bootstrap.min.*, todc-bootstrap.min.*`). [source maps](https://developers.google.com/web/tools/chrome-devtools/javascript/source-maps) (`bootstrap.*.map, todc-bootstrap.*.map`) are available for use with certain browsers' developer tools. Bundled JS files (`bootstrap.bundle.js` and minified `bootstrap.bundle.min.js`) include [Popper](https://popper.js.org/).

Compatibility
-------------

[](#compatibility)

This is being tested in the latest versions of Chrome, Firefox, and IE8+.

The following projects are specifically designed for use with todc-bootstrap:

- [todc-select2](https://github.com/todc/todc-select2/) - Google-themed select menus
- [todc-datepicker](https://github.com/todc/todc-datepicker/) - Google-themed datepicker component

Requirements
------------

[](#requirements)

- [SASS](https://sass-lang.com/) - for compiling `.scss` files into CSS
- [Bootstrap](https://github.com/twbs/bootstrap/) - this will be automatically checked out, if necessary, during the build process

Bugs and feature requests
-------------------------

[](#bugs-and-feature-requests)

Have a bug or a feature request? Please first read the [issue guidelines](https://github.com/todc/todc-bootstrap/blob/main/.github/CONTRIBUTING.md#using-the-issue-tracker) and search for existing and closed issues. If your problem or idea is not addressed yet, [please open a new issue](https://github.com/todc/todc-bootstrap/issues/new).

Documentation
-------------

[](#documentation)

TODC Bootstrap's documentation, included in this repo in the root directory, is built with [Hugo](https://gohugo.io/) and publicly hosted on GitHub Pages at . The docs may also be run locally.

Documentation search is powered by [Algolia's DocSearch](https://community.algolia.com/docsearch/). Working on our search? Be sure to set `debug: true` in `site/assets/js/src/search.js` file.

### Running documentation locally

[](#running-documentation-locally)

1. Run `npm install` to install the Node.js dependencies, including Hugo (the site builder).
2. Run `npm run test` (or a specific npm script) to rebuild distributed CSS and JavaScript files, as well as our docs assets.
3. From the root `/todc-bootstrap` directory, run `npm run docs-serve` in the command line.
4. Open `http://localhost:9002/` in your browser, and voilà.

Learn more about using Hugo by reading its [documentation](https://gohugo.io/documentation/).

### Documentation for previous releases

[](#documentation-for-previous-releases)

You can find all our previous releases docs on .

[Previous releases](https://github.com/todc/todc-bootstrap/releases) and their documentation are also available for download.

Contributing
------------

[](#contributing)

Please read through our [contributing guidelines](https://github.com/todc/todc-bootstrap/blob/main/.github/CONTRIBUTING.md). Included are directions for opening issues, coding standards, and notes on development.

Editor preferences are available in the [editor config](https://github.com/todc/todc-bootstrap/blob/main/.editorconfig) for easy use in common text editors. Read more and download plugins at .

Versioning
----------

[](#versioning)

For transparency into our release cycle and in striving to maintain backward compatibility, Bootstrap is maintained under [the Semantic Versioning guidelines](https://semver.org/). Sometimes we screw up, but we adhere to those rules whenever possible.

See [the Releases section of our GitHub project](https://github.com/todc/todc-bootstrap/releases) for changelogs for each release version of TODC Bootstrap.

Releases will be numbered with the following format:

`..-..`

The first set of `..` is the Bootstrap version while the second set is the todc-bootstrap version.

Given a version number MAJOR.MINOR.PATCH, increment the:

- MAJOR version when you make incompatible API changes,
- MINOR version when you add functionality in a backwards-compatible manner, and
- PATCH version when you make backwards-compatible bug fixes.

Additional labels for pre-release and build metadata are available as extensions to the MAJOR.MINOR.PATCH format.

Creators
--------

[](#creators)

**Tim O'Donnell**

-

Thanks
------

[](#thanks)

[ ![BrowserStack Logo](https://camo.githubusercontent.com/941d167418955d863ee5cb7b8e030514ab8bf23b2ffed99c298ce156741b7ca9/68747470733a2f2f6c6976652e62726f77736572737461636b2e636f6d2f696d616765732f6f70656e736f757263652f62726f77736572737461636b2d6c6f676f2e737667)](https://www.browserstack.com/)Thanks to [BrowserStack](https://www.browserstack.com/) for providing the infrastructure that allows us to test in real browsers!

Copyright and license
---------------------

[](#copyright-and-license)

Copyright 2011-2020 Tim O'Donnell. Code released under [the MIT license](https://github.com/todc/todc-bootstrap/blob/main/LICENSE). Docs released under [Creative Commons](https://creativecommons.org/licenses/by/3.0/).

**NOTE** This project was previously and incorrectly licensed under the Public Domain. It has now been changed to be compatible with Bootstrap's current license.

Acknowledgements
----------------

[](#acknowledgements)

Inspired by [Bootstrap](https://v5.getbootstrap.com/) and, of course, Google.

###  Health Score

51

—

FairBetter than 96% of packages

Maintenance58

Moderate activity, may be stable

Popularity42

Moderate usage in the ecosystem

Community32

Small or concentrated contributor base

Maturity65

Established project with proven stability

 Bus Factor1

Top contributor holds 81.7% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~18 days

Total

3

Last Release

4568d ago

Major Versions

v2.3.2 → v3.0.12013-10-30

### Community

Maintainers

![](https://www.gravatar.com/avatar/8d234927e9bac3d08c3c781a4b28f4bb99e8a4ab25fd2c24dcd9c7672f559298?d=identicon)[todc](/maintainers/todc)

---

Top Contributors

[![acmetech](https://avatars.githubusercontent.com/u/134294?v=4)](https://github.com/acmetech "acmetech (8054 commits)")[![dependabot[bot]](https://avatars.githubusercontent.com/in/29110?v=4)](https://github.com/dependabot[bot] "dependabot[bot] (1434 commits)")[![dependabot-preview[bot]](https://avatars.githubusercontent.com/in/2141?v=4)](https://github.com/dependabot-preview[bot] "dependabot-preview[bot] (224 commits)")[![todc](https://avatars.githubusercontent.com/u/368074?v=4)](https://github.com/todc "todc (128 commits)")[![malgirl](https://avatars.githubusercontent.com/u/49366316?v=4)](https://github.com/malgirl "malgirl (6 commits)")[![reecefowell](https://avatars.githubusercontent.com/u/525575?v=4)](https://github.com/reecefowell "reecefowell (2 commits)")[![icode](https://avatars.githubusercontent.com/u/972959?v=4)](https://github.com/icode "icode (2 commits)")[![wudi](https://avatars.githubusercontent.com/u/3753615?v=4)](https://github.com/wudi "wudi (1 commits)")[![Calinou](https://avatars.githubusercontent.com/u/180032?v=4)](https://github.com/Calinou "Calinou (1 commits)")[![narusemotoki](https://avatars.githubusercontent.com/u/1593495?v=4)](https://github.com/narusemotoki "narusemotoki (1 commits)")[![Progi1984](https://avatars.githubusercontent.com/u/1533248?v=4)](https://github.com/Progi1984 "Progi1984 (1 commits)")[![radum](https://avatars.githubusercontent.com/u/46779?v=4)](https://github.com/radum "radum (1 commits)")[![thorn0](https://avatars.githubusercontent.com/u/94334?v=4)](https://github.com/thorn0 "thorn0 (1 commits)")[![timgluz](https://avatars.githubusercontent.com/u/1223889?v=4)](https://github.com/timgluz "timgluz (1 commits)")

---

Tags

googlecssthemebootstrap

### Embed Badge

![Health badge](/badges/todc-todc-bootstrap/health.svg)

```
[![Health](https://phpackages.com/badges/todc-todc-bootstrap/health.svg)](https://phpackages.com/packages/todc-todc-bootstrap)
```

###  Alternatives

[ttskch/select2-bootstrap4-theme

Select2 v4 theme for Bootstrap4

43424.6k2](/packages/ttskch-select2-bootstrap4-theme)[bk2k/bootstrap-package

Bootstrap Package delivers a full configured frontend theme for TYPO3, based on the Bootstrap CSS Framework.

357891.4k72](/packages/bk2k-bootstrap-package)[raoul2000/yii2-bootswatch-asset

Use Bootswatch theme in your Yii application with minimum effort

2145.0k4](/packages/raoul2000-yii2-bootswatch-asset)[mervick/material-design-icons

Google Material Design Icons For Using With Bootstrap

10191.4k7](/packages/mervick-material-design-icons)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
