Fix overflowing email addresses on user info popup

 






 

 


  Review Request #5422
  —
  Created Feb. 7, 2014 and submitted 

 


















 

  

   Information

  





 
 

  hellosjsu
 









 
 

  Review Board
 









 
 

  master
 









 
 

  3215
 









 
 

  
 






 




 

  

   Reviewers

  





 
 

  reviewboard, students
 









 
 

  
 






 








 





  


 
 

  
Fix overflowing email addresses on user info popup

 








  


 
 

  
I maxed out the character limit of a user's email address.

 







 









 





  








 

  
  


   

    

     

     

     

    

   


   

    

     

     

     

    

   


   

  

 







 
 
 

  

   

    

     
    

    
    
     
  • 
      
     
    • 
     
  • 
      
     
    • 
     
  • 
      
     
    • 
     
  • 
      
     
    • 
     
  • 
      
     
    • 
    

   

   

    
     

      Description
      From
      Last Updated
     

    
    



     

      
       
       
I wonder if instead of putting a hard-coded width here, we should put a max-width on the #user-infobox instead? I …

      		
      
       mike_conleymike_conley
      
      
       
      
     




     

      
       
       
Rup - sorry, I meant max-width on the #user-infobox - that way, we don't have to set widths on everything …

      		
      
       mike_conleymike_conley
      
      
       
      
     


    
   

  

 







 






  

 








 














 





 

  

   




mike_conley




   

   







  

 



 

  


   

   

    
 
mike_conley


    
   


  

  

  



    




  1. 
 
    
  
    
   
    Looking good, Stephanie. Would you mind mentioning the kind of testing you did with this bug, and maybe provide some before/after screenshots?
    
  
    
 
    

 
    
  


    
 
    
 
      

  

 
    


    

 
    

    2. 

















  2. 
 
    
  
  
    
  
 
    
  
    
   
    
    
     
    
      
       reviewboard/static/rb/css/common.less
       


        (Diff revision 1)


       
      
     
    
        
    
     
     
    

     
     
    

        
   
    
  
    
 
    

   
    
    
    




    
 
    
  
  
  

  
  
   Show all issues
  
 
    

    



    
    I wonder if instead of putting a hard-coded width here, we should put a max-width on the #user-infobox instead? I think I might prefer that...
    
  
    
 
    

 
    
  


    
 
    
 
      

  

 
    


    

 
    

    3. 




  3. 
 
    
  
    
   
    
  
    
 
    

 
    
  


    
 
    
 
      

  

 
    


    

 
    

    4. 




  

 
















 



 

  

   





 HE





   

   

  

 



 















 





 

  

   




david




   

   





  

 



 

  


   

   

    
 
david


    
   


  

  

  



    




  1. 
 
    
  
    
   
    Can you put the bug number into the "Bugs" field?
    
  
    
 
    

 
    
  


    
 
    
 
      

  

 
    


    

 
    

    2. 















  2. 
 
    
  
    
   
    
  
    
 
    

 
    
  


    
 
    
 
      

  

 
    


    

 
    

    3. 




  

 
















 



 

  

   





 HE





   

   

  

 



 















 





 

  

   




mike_conley




   

   







  

 



 

  


   

   

    
 
mike_conley


    
   


  

  

  



    




  1. 
 
    
  
    
   
    
  
    
 
    

 
    
  


    
 
    
 
      

  

 
    


    

 
    

    2. 

















  2. 
 
    
  
  
    
  
 
    
  
    
   
    
    
     
    
      
       reviewboard/static/rb/css/common.less
       


        (Diff revision 2)


       
      
     
    
        
    
     
     
    

     
     
    

        
   
    
  
    
 
    

   
    
    
    




    
 
    
  
  
  

  
  
   Show all issues
  
 
    

    



    
    Rup - sorry, I meant max-width on the #user-infobox - that way, we don't have to set widths on everything beneath #user-infobox.
    
  
    
 
    

 
    
  


    
 
    
 
      

  


    1. 
 
 
      
 
      
  
 
      
 
      
  
      Setting max-width on the #user-infobox doesn't fix the text overflow issue though. I think {word-wrap: break-word;} only works when the div itself has a max-width. Moving word-wrap to #user-infobox also fails to fix the issue.
      
 
      

      2. 



    2. 
 
 
      
 
      
  
 
      
 
      
  
      What about if you put the max-width on the #user-infobox, and max-width: inherit on the text label?
      
 
      

      3. 



    3. 
 
 
      
 
      
  
 
      
 
      
  
      Ok, it looks like max-width: inherit doesn't do what we want. :(
      

      Alright, let's just put the width on the text field itself.
      
 
      

      4. 



    4. 
 
 
      
 
      
  
 
      
 
      
  
      Hmmm it still looks the same as without the inherit. Also, shouldn't the .infobox-text width be less than the #user-infobox width since it needs to make room for the profile picture's width as well?
      
 
      

      5. 



    5. 
 
 
      
 
      
  
 
      
 
      
  
      That's a good call - 200px would not have been enough.
      
 
      

      6. 


 
    


    

 
    

    3. 




  3. 
 
    
  
    
   
    
  
    
 
    

 
    
  


    
 
    
 
      

  

 
    


    

 
    

    4. 




  

 
















 



 

  

   





 HE





   

   

  

 



 















 





 

  

   




mike_conley




   

   







  

 



 

  


   

   

    
 
mike_conley


    
   


  

  

  



    




  1. 
 
    
  
    
   
    Ship It!
    
  
    
 
    

 
    
  


    
 
    
 
      

  

 
    


    

 
    

    2. 















  2. 
 
    
  
    
   
    
  
    
 
    

 
    
  


    
 
    
 
      

  

 
    


    

 
    

    3. 




  

 
















 





 

  

   





 HE





   

   







  

 



 

  


   

   

    
 
hellosjsu


    
   


  

  

  



    




  1. 
 
    
  
    
   
    Ship It!
    
  
    
 
    

 
    
  


    
 
    
 
      

  


    1. 
 
 
      
 
      
  
 
      
 
      
  
      Heh - for future reference, you don't normally give a Ship It on your own review requests. ;)
      

      A+ for enthusiasm though!
      
 
      

      2. 


 
    


    

 
    

    2. 















  2. 
 
    
  
    
   
    
  
    
 
    

 
    
  


    
 
    
 
      

  

 
    


    

 
    

    3. 




  

 
















 



 

  

   





 HE





   

   

  

 



 

  


   

   

    
 Review request changed

    
   


  

  

  







  

   

    Status:
   

   


    Completed

   

  




  

   

    Change Summary:
   

   

    
Thanks! 55ac4fa4