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

The following examples show how to use @fortawesome/free-solid-svg-icons#faComment. 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: Sidebar.jsx    From MyHome-Web with Apache License 2.0 5 votes vote down vote up
getLinks() {
    return [
      {
        link: '/',
        icon: faHome,
        text: 'Home',
      },
      {
        link: '/notifications',
        icon: faBell,
        text: 'Notifications',
      },
      {
        link: '/bookamenity',
        icon: faCalendar,
        text: 'Book Amenity',
      },
      {
        link: '/payments',
        icon: faMoneyBill,
        text: 'Payments',
      },
      {
        link: '/settings',
        icon: faCogs,
        text: 'Settings',
      },
      {
        normal: true,
        link: 'https://example.org',
        icon: faQuestion,
        text: 'Help',
      },
      {
        normal: true,
        icon: faComment,
        link: 'https://github.com/',
        text: 'Feedback',
      },
    ];
  }
Example #2
Source File: RequestInput.js    From Postman-Clone with MIT License 5 votes vote down vote up
RequestInput = (props) => {
  const { tab, handleChange, handleSubmit } = props;
  if (tab !== undefined) {
    return (
      <div className="content__requestInputWrapper">
        <div className="content__requestDetailsRow">
          <div className="content__requestDetailsColumn">
            <FontAwesomeIcon icon={faCaretRight} />
            <span className="content__requestDetailsName">{tab.name}</span>
          </div>
          <div className="content__requestDetailsColumn">
            <FontAwesomeIcon icon={faComment} />
            <span className="content__requestDetailsName">
              Comments
              <span className="content__requestBadge">0</span>
            </span>
            <span className="content__requestDetailsName">
              Examples
              <span className="content__requestBadge">0</span>
            </span>
            <FontAwesomeIcon icon={faCaretDown} />
          </div>
        </div>
        {/* Input */}

        <div className="content__requestInputRow">
          <div className="content__requestInputColumn">
            <select>
              <option>GET</option>
              <option>POST</option>
            </select>
            <input type="text" placeholder="" onChange={handleChange} />
            <button
              className="content__requestSendButton"
              onClick={handleSubmit}
            >
              Send
              <FontAwesomeIcon
                icon={faCaretDown}
                className="content__requestSendButtonIcon"
              />
            </button>
            <button className="content__requestSaveButton ">
              Save
              <FontAwesomeIcon
                icon={faCaretDown}
                className="content__requestSendButtonIcon"
              />
            </button>
          </div>
        </div>
      </div>
    );
  } else {
    return null;
  }
}
Example #3
Source File: PlayerStats.jsx    From ashteki with GNU Affero General Public License v3.0 4 votes vote down vote up
render() {
        let t = this.props.t;
        let userStyle = {};
        if (this.props.user?.faveColor) {
            userStyle.color = this.props.user.faveColor;
        }
        let userClass = 'username' + (this.props.user.role ? ` ${this.props.user.role.toLowerCase()}-role` : '');

        let playerAvatar = (
            <div className='state'>
                <Avatar imgPath={this.props.user?.avatar} />
                <b className={userClass} style={userStyle}>{this.props.user?.username || t('Noone')}</b>
            </div>
        );

        let statsClass = classNames('panel player-stats', {
            'active-player': this.props.activePlayer
        });

        let firstPlayerToken = this.props.firstPlayer ? (
            <div className='state'>
                <img src={FirstPlayerImage} title='First Player' />
            </div>
        ) : (
            ''
        );

        return (
            <div className={statsClass}>
                {playerAvatar}
                {this.renderLifeRemaining()}
                {this.renderActions()}
                {firstPlayerToken}
                {this.props.activePlayer && (
                    <div className='state first-player-state'>
                        <Trans>Active Player</Trans>
                    </div>
                )}

                {this.props.showMessages && (
                    <div className='state chat-status'>
                        <div className='state'>
                            <a href='#' className='pr-1 pl-1' title='Show dice/card history'>
                                <FontAwesomeIcon
                                    icon={faHistory}
                                    onClick={this.props.onDiceHistoryClick}
                                ></FontAwesomeIcon>
                            </a>
                        </div>
                        <div className='state'>
                            <a href='#' className='pr-1 pl-1' title='Mute spectators'>
                                <FontAwesomeIcon
                                    icon={this.props.muteSpectators ? faEyeSlash : faEye}
                                    onClick={this.props.onMuteClick}
                                ></FontAwesomeIcon>
                            </a>
                        </div>
                        {this.props.showManualMode && (
                            <div className='state'>
                                <a
                                    href='#'
                                    className={this.props.manualModeEnabled ? 'text-danger' : ''}
                                    onClick={this.props.onManualModeClick}
                                >
                                    <FontAwesomeIcon icon={faWrench}></FontAwesomeIcon>
                                    <span className='ml-1'>
                                        <Trans>Manual Mode</Trans>
                                    </span>
                                </a>&nbsp;
                                <a href='#' className='pr-1 pl-1' title='Show manual command list'>
                                    <FontAwesomeIcon
                                        icon={faList}
                                        onClick={this.props.onManualCommandsClick}
                                    />
                                </a>
                            </div>
                        )}
                        <div className='state'>
                            <a
                                href='#'
                                onClick={this.onSettingsClick.bind(this)}
                                className='pr-1 pl-1'
                            >
                                <FontAwesomeIcon icon={faCogs}></FontAwesomeIcon>
                                <span className='ml-1'>
                                    <Trans>Settings</Trans>
                                </span>
                            </a>
                        </div>
                        <div className='state'>
                            <a href='#' className='pr-1 pl-1' title='Copy chat to clipboard'>
                                <FontAwesomeIcon
                                    icon={faCopy}
                                    onClick={this.writeChatToClipboard.bind(this)}
                                ></FontAwesomeIcon>
                            </a>
                        </div>
                        <div>
                            <a
                                href='#'
                                onClick={this.props.onMessagesClick}
                                className='pl-1'
                                title='Toggle chat'
                            >
                                <FontAwesomeIcon icon={faComment}></FontAwesomeIcon>
                                {this.props.numMessages > 0 && (
                                    <Badge variant='danger'>{this.props.numMessages}</Badge>
                                )}
                            </a>
                        </div>
                    </div>
                )}
            </div>
        );
    }