@gravityforms/utils/src/dom/apply-browser-classes.js

JavaScript utilities for Gravity Forms development.

import browsers from './browsers';

/**
 * @module browserClasses
 * @description Applies classes to the body element that describe the browser type and whether the system
 * is ios or android as well.
 *
 * `device-android` or `device-ios`.
 * `browser-edge` or `browser-chrome` or `browser-firefox` or `browser-ie` or `browser-opera` or `browser-safari`.
 *
 * @since 1.0.0
 *
 * @requiresbrowsers
 *
 * @return {void}
 *
 * @example
 * import { browserClasses } from "@gravityforms/utils";
 *
 * function Example() {
 *   browserClasses();
 * }
 *
 */
export default function browserClasses() {
	const browser = browsers();
	const classes = document.body.classList;

	if ( browser.android ) {
		classes.add( 'device-android' );
	} else if ( browser.ios ) {
		classes.add( 'device-ios' );
	}

	if ( browser.edge ) {
		classes.add( 'browser-edge' );
	} else if ( browser.chrome ) {
		classes.add( 'browser-chrome' );
	} else if ( browser.firefox ) {
		classes.add( 'browser-firefox' );
	} else if ( browser.ie ) {
		classes.add( 'browser-ie' );
	} else if ( browser.opera ) {
		classes.add( 'browser-opera' );
	} else if ( browser.safari ) {
		classes.add( 'browser-safari' );
	}
}