npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

ember-cli-bootstrap3-sass

v1.0.6

Published

This addon installs the bootstrap3 javascript components and fonts. Once installed, you can compile the bootstrap sass into your app. Understand that this addon is for Ember applications that are compiling their styles using SASS. __If your Ember appli

Downloads

15

Readme

ember-cli-bootstrap3-sass GitHub version

npm version CircleCI Code Climate Dependencies ember-observer-badge License

This addon installs the bootstrap3 javascript components and fonts. Once installed, you can compile the bootstrap sass into your app. Understand that this addon is for Ember applications that are compiling their styles using SASS.

If your Ember application is using pure CSS or LESS, than this addon is NOT for you.

What Does This Addon Do?

This addon will make sure that the latest version of the ember-cli-sass Ember Addon is installed in your Ember-App. In addition, the latest version of the bootstrap-sass library from bower will be downloaded in order to acquire the javascript, fonts, and SASS source. The relevant javascript and font files are copied to your Ember-App's assets directory and are then referred to from the stylesheet.

Requirements

  • Ember >= 1.13.0
  • Ember CLI

Installation

Installation is basically two simple steps: one install the addon, and two import the SASS source into your app.scss file.

The following will install this addon along with the bootstrap-sass source and fonts:

$ ember install ember-cli-bootstrap3-sass

Next, inside your app/styles/app.scss file you must compile the bootstrap source into your application's stylesheet:

// `app/styles/app.scss`
...
@import 'ember-cli-bootstrap3-sass';
...

Alternate Bootstrap Theme With Fancier Buttons?

Access to Bootstrap's alternate theme is as simple as adding one more import: ember-cli-bootstrap3-theme. So your app/styles/app.scss should look like this:

// `app/styles/app.scss`
...
@import 'ember-cli-bootstrap3-sass';
@import 'ember-cli-bootstrap3-theme';
...

So it should go without saying, if you want to include some other canned theme from bower or wherever, you can include it just after the aforementioned import(s).

Bootstrap Variables & Mixins Convenience Importer

Sometimes you need access to the default Bootstrap variables or you require Bootstrap's mixins to generate prior to your loading of the full bootstrap suite. I've included both convenience imports to this addon.

Bootstrap Variables

// `app/styles/app.scss`
...
@import 'ember-cli-bootstrap3-variables';
...

The bootstrap variables will now be available for you to override or re-use in whatever way you see fit.

Bootstrap Mixins

// `app/styles/app.scss`
...
@import 'ember-cli-bootstrap3-mixins';
...

The bootstrap mixins will be available once this has been imported.

Alternate Glyphicon Font Path?

By default, this addon takes care of the Glyphicon font paths for you. If for some reason you need to customize this path, you can do so by supplying the $icon-font-path variable value before you import ember-cli-bootstrap3-sass. Make sure the path you specify includes the trailing slash!

// `app/styles/app.scss`
...
$icon-font-path: '/some/absolute/path/'
@import 'ember-cli-bootstrap3-sass';
...

Upgrading

If you want to upgrade this addon at any time, simply invoke the ember install ember-cli-bootstrap3-sass command.

When working through the Ember-CLI upgrade process, I again recommend invoking the ember install ember-cli-bootstrap3-sass command to get the latest version of the addon. Notice that this may update the bootstrap-sass bower dependency to the latest 3.x.x version.

Troubleshooting And Tips

  1. You need ember-cli-sass to be configured in your application. This means that by default your styles have been compiled inside your app/styles/app.scss file. If you've adjusted the configuration to use a different file, then you must add the @import 'ember-cli-bootstrap3-sass' directive there.
  2. As bootstrap-3 version updates are made available, simply reinstall your bower packages and in some cases update your bower.json to ensure the version you want is being brought into your application. Understand that this addon does not entertain installing bootstrap-4 at this time.

Ember Addon Building And Testing

Setup

  • git clone [email protected]:cybertoothca/ember-cli-bootstrap3-sass.git
  • npm install
  • bower install

Running The Dummy Application

  • ember server
  • Visit your app at http://localhost:4200.

Running Addon Tests

  • npm test (Runs ember try:testall to test your addon against multiple Ember versions)
  • ember test
  • ember test --server

Building The Addon

  • ember build

For more information on using ember-cli, visit http://ember-cli.com/.

Linking This Addon For Local Testing

Linking

  1. From the command line at the root of this project run the npm link command to link this addon within your local node repository.
  2. From the other Ember project that you wish to test this addon in, execute the following command: npm link ember-cli-bootstrap3-sass.
  3. Now in that same other Ember project, you should go into the package.json and add the ember addon with the version *. It will look something like this: "ember-cli-bootstrap3-sass": "*". Now when/if you execute npm install on this other project it will know to look for the linked addon rather than fetch it from the central repository.

Unlinking

  1. Remove the addon from your local node repository with the following command (that can be run anywhere): npm uninstall -g ember-cli-bootstrap3-sass
  2. Remove the reference to the ember-cli-bootstrap3-sass in your other project's package.json.
  3. Run an npm prune from the root of your other project's command line.