How to use the @uifabric/fluent-theme.NeutralColors.gray160 function in @uifabric/fluent-theme

To help you get started, we’ve selected a few @uifabric/fluent-theme examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github OfficeDev / office-ui-fabric-react / packages / example-app-base / src / components / ExampleCard / ExampleCard.styles.ts View on Github external
borderTopLeftRadius: '4px',
    borderTopRightRadius: '4px',
    padding: '4px 12px',
    minWidth: 100,
    transition: `border ${AnimationVariables.durationValue3} ${AnimationVariables.easeFunction1}`
  };

  const codeButtonActiveStyles: IRawStyle = {
    backgroundColor: NeutralColors.gray20,
    borderColor: NeutralColors.gray90,
    selectors: {
      '.ms-Button-icon': {
        color: theme.palette.themePrimary
      },
      '.ms-Button-label': {
        color: NeutralColors.gray160
      }
    }
  };

  const dropdownStyles: Partial = {
    caretDownWrapper: {
      top: '6px'
    },
    title: [
      sharedToggleButtonStyles,
      {
        alignItems: 'center',
        display: 'flex',
        height: 40,
        width: 150,
        selectors: {
github microsoft / BotFramework-Composer / Composer / packages / lib / code-editor / src / RichEditor.tsx View on Github external
),
    }
  );

  const getHeight = () => {
    if (height === null || height === undefined) {
      return '100%';
    }

    return processSize(height);
  };

  let borderColor = NeutralColors.gray120;

  if (hovered) {
    borderColor = NeutralColors.gray160;
  }

  if (isInvalid) {
    borderColor = SharedColors.red20;
  }

  return (
github microsoft / BotFramework-Composer / Composer / packages / extensions / obiformeditor / src / Form / widgets / WidgetLabel.tsx View on Github external
),
      }}
      delay={TooltipDelay.zero}
      directionalHint={DirectionalHint.leftCenter}
      styles={{ root: { display: 'flex', alignItems: 'center' } }}
      id={`${id}-description`}
    >
      
    
  );
};
github OfficeDev / office-ui-fabric-react / packages / example-app-base / src / components / CodeSnippet / CodeSnippet.styles.ts View on Github external
import { IStyleFunction, IRawStyle } from 'office-ui-fabric-react';
import { FontSizes, NeutralColors } from '@uifabric/fluent-theme';
import { ICodeSnippetStyleProps, ICodeSnippetStyles } from './CodeSnippet';

const codeFontFamily = 'Monaco, Menlo, Consolas, "Droid Sans Mono", "Inconsolata", "Courier New", monospace';

export const baseCodeStyle: IRawStyle = {
  fontFamily: codeFontFamily,
  fontSize: FontSizes.size14,
  background: NeutralColors.gray20,
  color: NeutralColors.gray160
};

export const getStyles: IStyleFunction = props => {
  return {
    root: [
      {
        overflowY: 'auto',
        maxHeight: '400px',
        display: 'flex',
        margin: '12px 0',

        selectors: {
          code: {
            fontFamily: codeFontFamily,
            lineHeight: '1.6'
          }