Improve account bar css (#8087)
* Remove superfluous span tags * Make account bar items (except dropdown) flexible to work well with custom CSS * Fix CSS lint warning (0px → 0)
This commit is contained in:
		
							parent
							
								
									bb71538bb5
								
							
						
					
					
						commit
						2ccef52a4f
					
				
					 2 changed files with 5 additions and 6 deletions
				
			
		| 
						 | 
				
			
			@ -142,17 +142,17 @@ export default class ActionBar extends React.PureComponent {
 | 
			
		|||
        <div className='account__action-bar'>
 | 
			
		||||
          <div className='account__action-bar-links'>
 | 
			
		||||
            <Link className='account__action-bar__tab' to={`/accounts/${account.get('id')}`}>
 | 
			
		||||
              <span><FormattedMessage id='account.posts' defaultMessage='Toots' /></span>
 | 
			
		||||
              <FormattedMessage id='account.posts' defaultMessage='Toots' />
 | 
			
		||||
              <strong>{shortNumberFormat(account.get('statuses_count'))}</strong>
 | 
			
		||||
            </Link>
 | 
			
		||||
 | 
			
		||||
            <Link className='account__action-bar__tab' to={`/accounts/${account.get('id')}/following`}>
 | 
			
		||||
              <span><FormattedMessage id='account.follows' defaultMessage='Follows' /></span>
 | 
			
		||||
              <FormattedMessage id='account.follows' defaultMessage='Follows' />
 | 
			
		||||
              <strong>{shortNumberFormat(account.get('following_count'))}</strong>
 | 
			
		||||
            </Link>
 | 
			
		||||
 | 
			
		||||
            <Link className='account__action-bar__tab' to={`/accounts/${account.get('id')}/followers`}>
 | 
			
		||||
              <span><FormattedMessage id='account.followers' defaultMessage='Followers' /></span>
 | 
			
		||||
              <FormattedMessage id='account.followers' defaultMessage='Followers' />
 | 
			
		||||
              <strong>{shortNumberFormat(account.get('followers_count'))}</strong>
 | 
			
		||||
            </Link>
 | 
			
		||||
          </div>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -1236,7 +1236,6 @@ a .account__avatar {
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
.account__action-bar-dropdown {
 | 
			
		||||
  flex: 0 1 calc(50% - 140px);
 | 
			
		||||
  padding: 10px;
 | 
			
		||||
 | 
			
		||||
  .icon-button {
 | 
			
		||||
| 
						 | 
				
			
			@ -1268,9 +1267,9 @@ a .account__avatar {
 | 
			
		|||
.account__action-bar__tab {
 | 
			
		||||
  text-decoration: none;
 | 
			
		||||
  overflow: hidden;
 | 
			
		||||
  flex: 0 1 80px;
 | 
			
		||||
  flex: 0 1 100%;
 | 
			
		||||
  border-right: 1px solid lighten($ui-base-color, 8%);
 | 
			
		||||
  padding: 10px 5px;
 | 
			
		||||
  padding: 10px 0;
 | 
			
		||||
 | 
			
		||||
  & > span {
 | 
			
		||||
    display: block;
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		
		Reference in a new issue