Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Meteor accounts-ui package updated to use twitter/bootstrap 3
JavaScript CSS

This branch is 130 commits ahead, 33 commits behind erobit:master

README.md

meteor-accounts-ui-bootstrap-3

Meteor accounts-ui styled with twitter/bootstrap 3

Prerequisites

Use the meteorite package manager http://oortcloud.github.com/meteorite/

[sudo] npm install -g meteorite

You will also need the following:

  • Bootstrap 3: mrt add bootstrap-3
  • At least one accounts plugin: mrt add accounts-password, mrt add accounts-github, etc.

How to add to your meteor app

mrt add accounts-ui-bootstrap-3

How to use

Add {{> loginButtons }} to your template

Example:

<div class="navbar navbar-default" role="navigation">
    <div class="navbar-header">
        <a class="navbar-brand" href="#">Project name</a>
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
    </div>
    <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav">
            <li class="active"><a href="#">Link</a></li>
        </ul>
        <ul class="nav navbar-nav navbar-right">
            {{> loginButtons }} <!-- here -->
        </ul>
    </div>
</div>

Add additional logged in actions

You can add additional markup to the logged in dropdown, e.g. to edit the user's account or profile, by defining a _loginButtonsAdditionalLoggedInDropdownActions template and specifying the corresponding events.

<template name="_loginButtonsAdditionalLoggedInDropdownActions">
    <button class="btn btn-default btn-block" id="login-buttons-edit-profile">Edit profile</button>
</template>
Template._loginButtonsLoggedInDropdown.events({
    'click #login-buttons-edit-profile': function(event) {
        event.stopPropagation();
        Template._loginButtons.toggleDropdown();
        Router.go('profileEdit');
    }
});

Screenshots

Sign In Sign Up Configure Login Service

Something went wrong with that request. Please try again.