Multiple Bug fixes

components/change_url_modal.jsx

@@ -135,7 +135,7 @@ export default class ChangeUrlModal extends React.Component {
 
  if (this.props.serverError || this.state.urlError) {
  error = (
- <div className='form-group has-error'>
+ <div className='has-error'>
  <p className='input__help error'>
  {this.state.urlError || this.props.serverError}
  </p>
@@ -170,13 +170,13 @@ export default class ChangeUrlModal extends React.Component {
  />
  </div>
  <div className='form-group'>
- <label className='col-sm-2 form__label control-label'>
+ <label className='col-sm-3 form__label control-label'>
  <FormattedMessage
  id='change_url.urlLabel'
  defaultMessage='Channel URL'
  />
  </label>
- <div className='col-sm-10'>
+ <div className='col-sm-9'>
  <div className={urlClass}>
  <OverlayTrigger
  trigger={['hover', 'focus']}

components/delete_modal_trigger.jsx

@@ -51,12 +51,12 @@ export default class DeleteModalTrigger extends React.Component {
  render() {
  return (
  <span>
- <a
- href='#'
+ <button
+ className='color--link style--none'
  onClick={this.handleOpenModal}
  >
  { this.triggerTitle }
- </a>
+ </button>
  <ConfirmModal
  show={this.state.showDeleteModal}
  title={this.modalTitle}

components/integrations/components/installed_command.jsx

@@ -108,15 +108,15 @@ export default class InstalledCommand extends React.PureComponent {
  if (this.props.canChange) {
  actions = (
  <div className='item-actions'>
- <a
- href='#'
+ <button
+ className='style--none color--link'
  onClick={this.handleRegenToken}
  >
  <FormattedMessage
  id='installed_integrations.regenToken'
  defaultMessage='Regenerate Token'
  />
- </a>
+ </button>
  {' - '}
  <Link to={`/${this.props.team.name}/integrations/commands/edit?id=${command.id}`}>
  <FormattedMessage

components/integrations/components/installed_oauth_app.jsx

@@ -158,40 +158,40 @@ export default class InstalledOAuthApp extends React.PureComponent {
  let showHide;
  if (this.state.clientSecret === FAKE_SECRET) {
  showHide = (
- <a
- href='#'
+ <button
+ className='style--none color--link'
  onClick={this.handleShowClientSecret}
  >
  <FormattedMessage
  id='installed_integrations.showSecret'
  defaultMessage='Show Secret'
  />
- </a>
+ </button>
  );
  } else {
  showHide = (
- <a
- href='#'
+ <button
+ className='style--none color--link'
  onClick={this.handleHideClientSecret}
  >
  <FormattedMessage
  id='installed_integrations.hideSecret'
  defaultMessage='Hide Secret'
  />
- </a>
+ </button>
  );
  }
 
  const regen = (
- <a
- href='#'
+ <button
+ className='style--none color--link'
  onClick={this.handleRegenerate}
  >
  <FormattedMessage
  id='installed_integrations.regenSecret'
  defaultMessage='Regenerate Secret'
  />
- </a>
+ </button>
  );
 
  let icon;

components/integrations/components/installed_outgoing_webhook.jsx

@@ -184,15 +184,15 @@ export default class InstalledOutgoingWebhook extends React.PureComponent {
  if (this.props.canChange) {
  actions = (
  <div className='item-actions'>
- <a
- href='#'
+ <button
+ className='style--none color--link'
  onClick={this.handleRegenToken}
  >
  <FormattedMessage
  id='installed_integrations.regenToken'
  defaultMessage='Regen Token'
  />
- </a>
+ </button>
  {' - '}
  <Link to={`/${this.props.team.name}/integrations/outgoing_webhooks/edit?id=${outgoingWebhook.id}`}>
  <FormattedMessage

components/mfa/mfa_controller.jsx

@@ -24,8 +24,8 @@ export default class MFAController extends React.Component {
  if (window.mm_config.EnforceMultifactorAuthentication === 'true') {
  backButton = (
  <div className='signup-header'>
- <a
- href='#'
+ <button
+ className='style--none color--link'
  onClick={(e) => {
  e.preventDefault();
  emitUserLoggedOutEvent('/login');
@@ -36,7 +36,7 @@ export default class MFAController extends React.Component {
  id='web.header.logout'
  defaultMessage='Logout'
  />
- </a>
+ </button>
  </div>
  );
  } else {

components/new_channel_flow.jsx

@@ -113,14 +113,16 @@ export default class NewChannelFlow extends React.Component {
  this.doOnModalExited();
  }
  }
- typeSwitched() {
+ typeSwitched(e) {
+ e.preventDefault();
  if (this.state.channelType === 'P') {
  this.setState({channelType: 'O'});
  } else {
  this.setState({channelType: 'P'});
  }
  }
- urlChangeRequested() {
+ urlChangeRequested(e) {
+ e.preventDefault();
  this.setState({flowState: SHOW_EDIT_URL});
  }
  urlChangeSubmitted(newURL) {

components/new_channel_modal/new_channel_modal.jsx

@@ -167,27 +167,27 @@ export default class NewChannelModal extends React.PureComponent {
  }
 
  let createPublicChannelLink = (
- <a
- href='#'
+ <button
+ className='style--none color--link'
  onClick={this.props.onTypeSwitched}
  >
  <FormattedMessage
  id='channel_modal.publicChannel1'
  defaultMessage='Create a public channel'
  />
- </a>
+ </button>
  );
 
  let createPrivateChannelLink = (
- <a
- href='#'
+ <button
+ className='style--none color--link'
  onClick={this.props.onTypeSwitched}
  >
  <FormattedMessage
  id='channel_modal.privateGroup2'
  defaultMessage='Create a private channel'
  />
- </a>
+ </button>
  );
 
  if (!ChannelUtils.showCreateOption(Constants.OPEN_CHANNEL, this.props.isTeamAdmin, this.props.isSystemAdmin)) {

components/sidebar.jsx

@@ -943,14 +943,14 @@ export default class Sidebar extends React.Component {
  show={this.state.showTopUnread}
  onClick={this.scrollToFirstUnreadChannel}
  extraClass='nav-pills__unread-indicator-top'
- text={above}
+ content={above}
  />
  <UnreadChannelIndicator
  name='Bottom'
  show={this.state.showBottomUnread}
  onClick={this.scrollToLastUnreadChannel}
  extraClass='nav-pills__unread-indicator-bottom'
- text={below}
+ content={below}
  />
 
  <div

sass/base/_typography.scss

@@ -18,6 +18,7 @@ a {
 }
 
 .color--link {
+ color: $link-color;
  cursor: pointer;
 
  &:hover,

sass/components/_modal.scss

@@ -128,6 +128,7 @@
  .custom-textarea {
  border-color: $light-gray;
  color: inherit;
+ padding-right: 30px;
 
  &:focus {
  border-color: $light-gray;

sass/layout/_headers.scss

@@ -223,7 +223,6 @@
  &:hover,
  &:focus {
  color: inherit;
- text-decoration: underline;
  }
  }
 

sass/utils/_variables.scss

@@ -11,6 +11,7 @@ $yellow: rgb(255, 255, 0);
 $light-gray: rgba(0, 0, 0, .15);
 $gray: rgba(0, 0, 0, .3);
 $dark-gray: rgba(0, 0, 0, .5);
+$link-color: rgb(35, 137, 215);
 
 // Page Variables
 $border-gray: 1px solid #ddd;

utils/utils.jsx

@@ -1057,7 +1057,7 @@ export function displayEntireNameForUser(user) {
  return '';
  }
 
- let displayName = user.username;
+ let displayName = '@' + user.username;
  const fullName = getFullName(user);
 
  if (fullName && user.nickname) {