Bstyles

Change the default Browsersync notification styles. Choose from different styles and alignments. Check the examples on the screen.

Available styles

• Top - 100% width top banner, green background
• TopLeft - Subtle green text, transparent background
• BottomLeft - Small circular badge. White text with grey background
• BottomRight - Subtle grey text, transparent background

Example usage with Gulp

import gulp from 'gulp';
import browserSync from 'browser-sync';
import paths from '../config';
import bstyles from 'bstyles';
const reload = browserSync.reload;

gulp.task('browser-sync', () => {
  browserSync.init([
    paths.css.srcB
    paths.scripts.src,
    paths.html.src
  ],
    {
      server: {
        baseDir: "./"
      },
      notify: true,
      notify: {
        styles: bstyles.BottomRight
      }
    });
});

gulp.task('bs-reload', () => {
  browserSync.reload();
});