@fortawesome/free-solid-svg-icons#faBan JavaScript Examples

The following examples show how to use @fortawesome/free-solid-svg-icons#faBan. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: ModalConfirm.js    From agenda with MIT License 6 votes vote down vote up 
ModalConfirm = ({
    message,
    title,
    onAccept,
    onDismiss,
    children,
    large
}) => (
    <Modal
        isOpen
        centered
        toggle={onDismiss}
        size={large ? 'lg' : null}
    >
        <ModalHeader toggle={onDismiss}>
            {title}
        </ModalHeader>
        <ModalBody >
            {message}
            {children}
        </ModalBody>
        <ModalFooter>
            {onAccept && (
                <Button onClick={onAccept} color="primary">
                    <FontAwesomeIcon icon={faCheck}/>
                    &nbsp;Confirmar
                </Button>
            )}
            <Button onClick={onDismiss}>
                <FontAwesomeIcon icon={faBan}/>
                &nbsp;Cancelar
            </Button>
        </ModalFooter>
    </Modal>
)
Example #2
Source File: ServerStatus.jsx    From ashteki with GNU Affero General Public License v3.0 5 votes vote down vote up 
ServerStatus = (props) => {
    const { connecting, connected, responseTime, serverType } = props;
    const { t } = useTranslation();

    let className = '';
    let toolTip = `${serverType} is`;
    let pingText;
    let icon = faCheckCircle;
    let splash = null;

    if (connected) {
        className += ' text-success';
        toolTip += ' connected';

        let pingClass;

        if (responseTime === undefined) {
            pingText = <span>{t('Waiting for ping')}</span>;
        } else {
            if (responseTime < 150) {
                pingClass = 'text-success';
            } else if (responseTime < 300) {
                pingClass = 'text-warning';
            } else {
                pingClass = 'text-danger';
            }

            pingText = (
                <React.Fragment>
                    <span>{serverType}: </span>
                    <span className={pingClass}>{responseTime}ms</span>
                </React.Fragment>
            );
        }
    } else if (connecting) {
        className += ' text-warning';
        icon = faTimesCircle;
        toolTip += ' connecting';
        pingText = (
            <React.Fragment>
                <span>{serverType}: </span>
                <span className='text-warning'>{t('Connecting')}</span>
            </React.Fragment>
        );
    } else {
        className += ' text-danger';
        icon = faBan;
        toolTip += ' disconnected';
        pingText = (
            <React.Fragment>
                <span>{serverType}: </span>
                <span className='text-danger'>{t('Disconnected')}</span>
            </React.Fragment>
        );
        splash = <div className='disconnect-splash panel'><span className='text-danger'>Disconnected!</span></div>
    }

    return (
        <li className='server-status'>
            {pingText}
            <span className={className}>
                <FontAwesomeIcon icon={icon} title={t(toolTip)} />
            </span>
            {splash}
        </li>
    );
}
Example #3
Source File: Job.component.js    From hiring-system with GNU General Public License v3.0 5 votes vote down vote up 
Job = ({ job }) => {
  const {
    userId,
    jobTitle,
    jobCreatorLogo,
    jobLocation,
    // jobApplyURL,
    jobCreator,
    dateModified,
    jobDescription,
    jobWorkType,
  } = job;

  const [dropdownOpen, setDropdownOpen] = useState(false);

  const toggle = () => setDropdownOpen((prevState) => !prevState);

  return (
    <ListGroupItem className="job-card" key={userId}>
      <div className="d-flex flex-column">
        <div className="job-card--header mb-3">
          {jobCreatorLogo ? (
            <img className="job-image" src={jobCreatorLogo} alt={jobCreator} />
          ) : (
            <h3 className="company mr-4">{jobCreator}</h3>
          )}

          <span className="text-tiny job-time">
            {moment(dateModified).fromNow()}
          </span>

          <Dropdown
            className="drop-down-icon"
            isOpen={dropdownOpen}
            toggle={toggle}
          >
            <DropdownToggle>
              <FontAwesomeIcon icon={faEllipsisV} />
            </DropdownToggle>
            <DropdownMenu right>
              <DropdownItem>
                <FontAwesomeIcon icon={faHeart} className="mr-1" /> Save Job
              </DropdownItem>
              <DropdownItem>
                <FontAwesomeIcon icon={faBan} className="mr-2" />
                Not Interested
              </DropdownItem>
            </DropdownMenu>
          </Dropdown>
        </div>

        <div className="mr-auto">
          <h4 className="job-card--title text-dark">{jobTitle}</h4>
          <h6 className="text-muted">
            <FontAwesomeIcon icon={faMapMarkerAlt} />
            <span className="ml-2">{jobLocation}</span>
          </h6>

          <p>
            {jobDescription.replace(/(<([^>]+)>)/gi, "").substring(0, 100)} ...
          </p>

          <Badge className="p-2 mt-1 mr-2" color="primary">
            {jobWorkType}
          </Badge>
        </div>
      </div>
    </ListGroupItem>
  );
}