• Stars
    star
    1
  • Language
    Ruby
  • License
    MIT License
  • Created over 9 years ago
  • Updated almost 9 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

🍞 Context sensitive notifications for Rails

Crouton Gem Version License

Context sensitive notifications for Rails && XHR.

Installation

gem install 'crouton'

Usage

Simply require crouton in your javascript and css:

//= require crouton
@import 'crouton';

Then, use the render_crouton method in your controllers, any option you pass will be converted to a message.

class PostsController < ActionController::Base

  def update
    if @post.save
      render_crouton notice: 'Saved'
    else
      render_crouton errors: @post.errors
    end
  end
end

Finally, find a good spot in your HTML for the Crouton, and add the .crouton-placeholder CSS class in the container of choice.

<div class="content crouton-placeholder">
  ...

Customization

Three styles are supported out of the box: info, warning and danger. The duration of each message is 1500, 2000 and 3000 respectively.

screen shot 2014-08-11 at 3 44 10 pm screen shot 2014-08-11 at 3 43 44 pm screen shot 2014-08-11 at 3 43 23 pm

You can customize the colours for this three styles by defining the following SASS variables:

  • $crouton-info
  • $crouton-warning
  • $crouton-danger

You can also create your custom messages:

render_crouton Crouton::Message.new(:hint, 'You can double tap for more info.', duration: 5000), placeholder: '.custom-crouton-placeholder'

License

Copyright (c) 2014 MΓ‘ximo Mussini

Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
"Software"), to deal in the Software without restriction, including
without limitation the rights to use, copy, modify, merge, publish,
distribute, sublicense, and/or sell copies of the Software, and to
permit persons to whom the Software is furnished to do so, subject to
the following conditions:

The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Credits

The name and the idea of Crouton originates in a blog article by Cyril Mottier.

More Repositories

1

vite_ruby

⚑️ Vite.js in Ruby, bringing joy to your JavaScript experience
Ruby
1,124
star
2

iles

🏝 The joyful site generator
TypeScript
1,043
star
3

vite-plugin-image-presets

πŸ–Ό Image Presets for Vite.js apps
TypeScript
243
star
4

vite-plugin-environment

Easily expose environment variables in Vite.js
TypeScript
132
star
5

vite-plugin-full-reload

♻️ Automatically reload the page when files are modified
JavaScript
121
star
6

oj_serializers

⚑️ Faster JSON serialization for Ruby on Rails. Easily migrate away from Active Model Serializers.
Ruby
98
star
7

js_from_routes

πŸ›£οΈ Generate path helpers and API methods from your Rails routes
Ruby
86
star
8

request_store_rails

πŸ“¦ Per-request global storage for Rails prepared for multi-threaded apps
Ruby
83
star
9

types_from_serializers

βœ… Generate TypeScript interfaces from your JSON serializers
Ruby
71
star
10

vuex-stores

πŸ—„ Store objects for Vuex, a simple and more fluid API for state-management.
JavaScript
63
star
11

vue-custom-element-example

An example on how to define custom elements using Vue 3
TypeScript
54
star
12

mongoid_includes

🌿 Improves eager loading support for Mongoid
Ruby
46
star
13

jekyll-vite

⚑️🩸 Use Vite.js in Jekyll as your assets pipeline
Ruby
44
star
14

queryable

❔ Gives your queries a home and avoid tucking scopes inside your models
Ruby
42
star
15

vite-plugin-stimulus-hmr

⚑️ HMR for Stimulus controllers in Vite.js
TypeScript
42
star
16

stimulus-vite-helpers

Helpers to easily load all your Stimulus controllers when using Vite.js
TypeScript
37
star
17

capybara-compose

βœ… Easily write fluent integration tests with Capybara in Ruby
Ruby
31
star
18

better_settings

βš™ Settings for Ruby apps – fast, immutable, better.
Ruby
20
star
19

vite-plugin-bugsnag

Report builds and upload source maps to Bugsnag
TypeScript
18
star
20

i18n_multitenant

🌎 Provides a convenient way to use tenant-specific translations
Ruby
16
star
21

vite-plugin-manifest-sri

Subresource Integrity for Vite.js manifest files
JavaScript
13
star
22

resourcerer

✨ Works like magic to dry up your controllers
Ruby
10
star
23

sublime-toggle-dark-mode

🌚🌞 Toggle between dark and light mode in Sublime Text 4
JavaScript
9
star
24

pakiderm

🐘 Pakiderm will never forget the return value
Ruby
7
star
25

presenter_rails

πŸ”­ Expose your view models in a convenient way
Ruby
6
star
26

vite-plugin-erb

Use ERB files in Vite.js projects with a Ruby backend
TypeScript
5
star
27

journeyman

Let your factories use your business logic, making them flexible and easier to update.
Ruby
5
star
28

jekyll-vite-minima

⚑️🩸 Use Vite.js in Jekyll minima theme as your assets pipeline
Ruby
3
star
29

automatic-music-transcription

Automatically exported from code.google.com
C
2
star
30

vite-plugin-xdm

Use XDM in VIte.js
JavaScript
2
star
31

fast-food-mvc

Automatically exported from code.google.com
C#
1
star
32

ElMassimo

1
star
33

vite-vue-router-hmr-repro

Vue
1
star