✏️ Minor classname fixes

Author: KRRISH96

lib/checkbox/index.js

@@ -27,7 +27,7 @@ const Checkbox = ({
           type="checkbox"
           {...props}
         />
-        <span className={cx({ [theme['check-item-inverted']]: inverted && checked }, theme['check-item'])} />
+        <span className={cx({ [theme['check-item-inverted']]: inverted && checked }, theme['check-item'], 'check-item')} />
       </span>
       {label && <span className={theme.label}>{label}</span>}
     </span>

lib/checkboxGroup/index.js

@@ -35,7 +35,7 @@ class CheckboxGroup extends React.Component {
       theme,
     } = this.props;
 
-    const classNames = cx(theme['checkbox-group'], { [theme.inline]: inline });
+    const classNames = cx(theme['checkbox-group'], (inline ? `${theme.inline} inline` : ''));
     return (
       <div className={classNames}>
         {options.map(option => (

lib/chip/index.js

@@ -35,7 +35,7 @@ const Chip = ({
     theme.chip,
     theme[size],
     theme[outlined ? `${color}Outlined` : color],
-    avatarElement && theme.avatarMarginLeft,
+    avatarElement && `${theme.avatarMarginLeft} avatarMarginLeft`,
     { [theme.clickable]: Element === 'a' },
     className,
   );

lib/modal/theme.module.scss

@@ -11,7 +11,7 @@
     box-sizing: border-box;
   }
 
-  .animation {
+  :local(.animation) {
     opacity: 0;
     transition: opacity 0.3s;
   }

lib/navbar/index.js

@@ -157,7 +157,7 @@ class Navbar extends React.Component {
             </div>)
           }
         </div>
-        <div className={theme.clearfix} />
+        <div className={classnames(theme.clearfix, 'clearfix')} />
       </div>
     );
   }

lib/progressbar/index.js

@@ -28,7 +28,7 @@ class ProgressBar extends React.Component {
     return (
       <div className={classes}>
         { showProgressText &&
-          <div className={theme.text} aria-label="progress-text"><strong>{ `${this.state.progress}%` }</strong></div> }
+          <div className={classnames(theme.text, 'text')} aria-label="progress-text"><strong>{ `${this.state.progress}%` }</strong></div> }
         <div
           aria-label="progress"
           className={progress}