BootstrapNotify aims to be a simple notification system that you can easily drop into your Rails project for nice looking notify flashes. BootstrapNotify is based off of bootstrap-notify by user goodybag http://goodybag.github.com/bootstrap-notify/
You can see a demo at: http://goodybag.github.com/bootstrap-notify
This is a based off of my SCSS conversion of bootstrap-notify.
Requirements:
- SCSS version of bootstrap installed from https://github.com/thomas-mcdonald/bootstrap-sass
- jQuery
Add it to your Gemfile:
gem 'bootstrap_notify', :git => "https://github.com/jclay/bootstrap-notify-gem.git"Include the javascripts in application.js. Make sure to include after jQuery:
//= require jquery
//= require jquery_ujs
//= require bootstrap_notify
Import the SCSS after you import bootstrap:
@import "bootstrap";
@import "bootstrap_notify";
Quick and Dirty style:
Create a partial with the contents
# app/views/partials/_notify.html.haml
- if !notice.blank?
:javascript
$(document).ready(function () {
$('.top-right').notify({
message: { text: "#{notice}" }
}).show();
});Render the partial in your layout with the <head> tag, after your javascript and CSS have been included.
# app/views/layouts/application.html.haml
= render(:partial => "partials/notify")Don't forget to include the div to attach the notification to:
# app/views/layouts/application.html.haml
.notifications.top-right
Additional configuration and placement options can be found at: http://goodybag.github.com/bootstrap-notify
You can offset the placement of the notification by adjusting the top, bottom, left or right variables.
$notify_right: 100px;
$notify_left: $notify_right;
$notify_top: 500px;
$notify_bottom: $notify_top;
@import "bootstrap_notify";
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent